vviinn-widgets 2.166.0 → 2.167.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.
Files changed (84) hide show
  1. package/dist/cjs/{index-B9ytLPxZ.js → index-DYvhURIh.js} +12 -0
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/{package-cwS3_cup.js → package-CTmKiTyO.js} +1 -1
  4. package/dist/cjs/vviinn-button_2.cjs.entry.js +2 -2
  5. package/dist/cjs/vviinn-camera_12.cjs.entry.js +16 -16
  6. package/dist/cjs/vviinn-carousel_10.cjs.entry.js +77 -32
  7. package/dist/cjs/vviinn-detected-object_7.cjs.entry.js +7 -7
  8. package/dist/cjs/vviinn-text-search.cjs.entry.js +3 -3
  9. package/dist/cjs/vviinn-vps-button.cjs.entry.js +2 -2
  10. package/dist/cjs/vviinn-widgets.cjs.js +1 -1
  11. package/dist/collection/Image/renderTitleImage.js +2 -0
  12. package/dist/collection/components/vviinn-modal/vviinn-modal.js +3 -3
  13. package/dist/collection/components/vviinn-product-card/render-helpers.js +29 -9
  14. package/dist/collection/components/vviinn-product-card/vviinn-energy-label/vviinn-energy-label.js +2 -2
  15. package/dist/collection/components/vviinn-product-card/vviinn-product-card.css +42 -0
  16. package/dist/collection/components/vviinn-product-card/vviinn-product-card.js +79 -16
  17. package/dist/collection/components/vviinn-results/vviinn-results.js +3 -3
  18. package/dist/collection/components/vviinn-skeleton/vviinn-skeleton.js +1 -1
  19. package/dist/collection/components/vviinn-slider/vviinn-slide/vviinn-slide.js +1 -1
  20. package/dist/collection/components/vviinn-slider/vviinn-slider.js +1 -1
  21. package/dist/collection/components/vviinn-teaser/vviinn-teaser.js +1 -1
  22. package/dist/collection/components/vviinn-text-search/vviinn-text-search.js +2 -2
  23. package/dist/collection/components/vviinn-vpr-button/recommendations-sidebar/recommendations-sidebar.js +1 -1
  24. package/dist/collection/components/vviinn-vpr-button/vviinn-vpr-button.js +2 -2
  25. package/dist/collection/components/vviinn-vpr-widget/vviinn-vpr-widget.css +1 -1
  26. package/dist/collection/components/vviinn-vps-button/vviinn-vps-button.js +2 -2
  27. package/dist/collection/components/vviinn-vps-widget/vviinn-vps-widget.js +9 -9
  28. package/dist/collection/cssParts/index.js +2 -1
  29. package/dist/collection/cssParts/product.js +10 -0
  30. package/dist/collection/helpers/url/getLastUrlPath.js +14 -0
  31. package/dist/collection/helpers/url/getLastUrlPath.test.js +23 -0
  32. package/dist/collection/store/search.store.js +1 -1
  33. package/dist/collection/utils/string/joinTruthy.js +3 -0
  34. package/dist/collection/utils/string/joinTruthy.test.js +17 -0
  35. package/dist/esm/{index-DJLLuTh-.js → index-CYUAT3RF.js} +12 -1
  36. package/dist/esm/loader.js +1 -1
  37. package/dist/esm/{package-BRkye-3Y.js → package-Ds0qJGAs.js} +1 -1
  38. package/dist/esm/vviinn-button_2.entry.js +2 -2
  39. package/dist/esm/vviinn-camera_12.entry.js +16 -16
  40. package/dist/esm/vviinn-carousel_10.entry.js +77 -32
  41. package/dist/esm/vviinn-detected-object_7.entry.js +7 -7
  42. package/dist/esm/vviinn-text-search.entry.js +3 -3
  43. package/dist/esm/vviinn-vps-button.entry.js +2 -2
  44. package/dist/esm/vviinn-widgets.js +1 -1
  45. package/dist/types/Image/renderTitleImage.d.ts +1 -0
  46. package/dist/types/components/vviinn-product-card/render-helpers.d.ts +10 -2
  47. package/dist/types/components/vviinn-product-card/vviinn-product-card.d.ts +8 -1
  48. package/dist/types/components.d.ts +24 -0
  49. package/dist/types/cssParts/index.d.ts +1 -0
  50. package/dist/types/cssParts/product.d.ts +1 -0
  51. package/dist/types/helpers/url/getLastUrlPath.d.ts +1 -0
  52. package/dist/types/helpers/url/getLastUrlPath.test.d.ts +1 -0
  53. package/dist/types/utils/string/joinTruthy.d.ts +1 -0
  54. package/dist/types/utils/string/joinTruthy.test.d.ts +1 -0
  55. package/dist/vviinn-widgets/p-08c03082.entry.js +1 -0
  56. package/{www/build/p-f97aa42e.entry.js → dist/vviinn-widgets/p-177e130c.entry.js} +1 -1
  57. package/dist/vviinn-widgets/{p-d06c3d98.entry.js → p-53347933.entry.js} +1 -1
  58. package/dist/vviinn-widgets/{p-e70adb2f.entry.js → p-6e0b7760.entry.js} +1 -1
  59. package/dist/vviinn-widgets/{p-464d7e0c.entry.js → p-7d12f926.entry.js} +1 -1
  60. package/dist/vviinn-widgets/{p-DJLLuTh-.js → p-CYUAT3RF.js} +1 -1
  61. package/dist/vviinn-widgets/{p-BRkye-3Y.js → p-Ds0qJGAs.js} +1 -1
  62. package/dist/vviinn-widgets/{p-f4a75f92.entry.js → p-bb74e1b1.entry.js} +2 -2
  63. package/dist/vviinn-widgets/vviinn-widgets.esm.js +1 -1
  64. package/package.json +1 -1
  65. package/www/build/p-08c03082.entry.js +1 -0
  66. package/{dist/vviinn-widgets/p-f97aa42e.entry.js → www/build/p-177e130c.entry.js} +1 -1
  67. package/www/build/{p-d06c3d98.entry.js → p-53347933.entry.js} +1 -1
  68. package/www/build/{p-e70adb2f.entry.js → p-6e0b7760.entry.js} +1 -1
  69. package/www/build/{p-464d7e0c.entry.js → p-7d12f926.entry.js} +1 -1
  70. package/www/build/p-9fa69445.js +1 -0
  71. package/www/build/{p-DJLLuTh-.js → p-CYUAT3RF.js} +1 -1
  72. package/www/build/{p-BRkye-3Y.js → p-Ds0qJGAs.js} +1 -1
  73. package/www/build/{p-f4a75f92.entry.js → p-bb74e1b1.entry.js} +2 -2
  74. package/www/build/vviinn-widgets.esm.js +1 -1
  75. package/www/index.html +1 -1
  76. package/dist/collection/Image/renderImage.js +0 -2
  77. package/dist/collection/helpers/index.js +0 -1
  78. package/dist/collection/utils/string/index.js +0 -1
  79. package/dist/types/Image/renderImage.d.ts +0 -1
  80. package/dist/types/helpers/index.d.ts +0 -1
  81. package/dist/types/utils/string/index.d.ts +0 -1
  82. package/dist/vviinn-widgets/p-d6ea882d.entry.js +0 -1
  83. package/www/build/p-ca47d016.js +0 -1
  84. package/www/build/p-d6ea882d.entry.js +0 -1
@@ -1,11 +1,11 @@
1
1
  import { h, r as registerInstance, c as createEvent, F as Fragment, H as Host, g as getElement } from './index-BcMtFp89.js';
2
2
  import { o as has, q as tuple, c as addIfNotEmpty, _ as _functionExports, v as _ArrayExports, g as globalState, u as useSearchStore, w as requireSemigroup, O as OptionExports, E as EitherExports, s as searchState, x as pipe$1, y as chainW, z as makeRequest, A as fromEither, B as getApiPath, C as createInitPostRequest, D as Apply, a as updateGlobalState, l as trackEvent, T as TaskEitherExports } from './search.store-yqygS_Os.js';
3
- import { c as campaignTypeNames, f as fromString, a as fold, v as version } from './package-BRkye-3Y.js';
3
+ import { c as campaignTypeNames, f as fromString, a as fold, v as version } from './package-Ds0qJGAs.js';
4
4
  import { C as CONTENT_GROUP_CSS_CLASS, i as CAROUSEL_IMAGE_WIDTH_CSS_VAR, S as SET_MODE_IMAGE_WIDTH_CSS_VAR, j as CAROUSEL_CONTENT_WIDTH_CSS_VAR, R as RESULTS_CALCULATED_COLUMNS_CSS_VAR, D as DEFAULT_COLUMNS_NUMBER, g as getCustomLabels, P as PlusIcon, v as v4, b as createAddToBasketEvent, d as createAddToWishlistEvent, c as createWidgetEvent, e as createResultEventByType, f as createProductEventByType, k as getRecommendationsBody } from './index-DHDA4hJT.js';
5
5
  import { P as PRODUCT_CARD_IMAGE_WIDTH, D as DISCOVERY_WIDGET_IMAGE_RESOLUTION_WIDTH } from './constants-CR1-OmNa.js';
6
6
  import { i as instance, a as isClickedInRectBound } from './Rectangle-Blhy9XN1.js';
7
7
  import { s as slotChangeListener, S as SlotSkeleton } from './customized-slots-s64pq2zp.js';
8
- import { g as energyLabelParts, h as priceRangeParts, p as productCardParts } from './index-DJLLuTh-.js';
8
+ import { g as energyLabelParts, h as priceRangeParts, i as contentCardParts, p as productCardParts } from './index-CYUAT3RF.js';
9
9
  import { i as isIntervalFilter, b as triggerResetFilters, g as getPriceLabel, a as isSubFilterActive, R as RenderFilterButton, t as triggerFilter } from './triggerFilter-B6lQhawz.js';
10
10
  import { r as resources } from './resources-DcA7Zxs5.js';
11
11
 
@@ -477,9 +477,9 @@ const VviinnEnergyLabel = class {
477
477
  slotChangeListener(this, this.el);
478
478
  }
479
479
  render() {
480
- return (h(Host, { key: 'c9ca5e5f0a76e5497c7ecfa420dec094373feaa7', class: {
480
+ return (h(Host, { key: '7342ec4499392827d9255605eb5d00587b1d59b9', class: {
481
481
  hidden: !this.classIconUrls && !this.productType && !this.classDataSheetUrl,
482
- }, exportparts: energyLabelParts }, h("div", { key: 'd7312425ece39ffe6fc8f37680c8e07c45fef845', class: "container", part: "energy-label-container" }, !!this.classIconUrls && (h("img", { key: '133182a1aa678209825f9c2208fbeefe884121ec', class: "class-label-icon", part: "energy-label-icon", src: this.classIconUrls[this.iconDirection] })), (this.productType || this.classDataSheetUrl) && (h("div", { key: 'c46674ea4ccf0fb286f6547211757403f3a6a738', class: "info-container" }, this.productType && (h("span", { key: 'c9f08b56673c60f45fcbebaae5c3316045202572', class: "product-type", part: "energy-label-product-type" }, this.productType)), this.classDataSheetUrl && (h("a", { key: '7813f860d0d75f90d40ec47ba98ceb8559ad7ba4', class: "data-sheet-link", part: "energy-label-data-sheet-link", href: this.classDataSheetUrl, target: "_blank", rel: "noopener noreferrer" }, h("slot", { key: '004bde63524de975899fc5eb830f68f3aad892b6', name: "vviinn-energy-label-data-sheet-text" }, instance.t("energyLabel.dataSheetText")))))))));
482
+ }, exportparts: energyLabelParts }, h("div", { key: '4d1ec82fefe845a6168091584ec1d65e4f4cce9c', class: "container", part: "energy-label-container" }, !!this.classIconUrls && (h("img", { key: 'cf6e369e1aa542648cae38bd7434ecf3aeb5f62b', class: "class-label-icon", part: "energy-label-icon", src: this.classIconUrls[this.iconDirection] })), (this.productType || this.classDataSheetUrl) && (h("div", { key: 'ae0e42d623443b26c3614c8adc24ebc55627877b', class: "info-container" }, this.productType && (h("span", { key: 'd139a2c9d57764bc02fbd7bffc4d9b1a2a0b5cb4', class: "product-type", part: "energy-label-product-type" }, this.productType)), this.classDataSheetUrl && (h("a", { key: '194d6282f79f2854c2e47e703bf50ffff967b258', class: "data-sheet-link", part: "energy-label-data-sheet-link", href: this.classDataSheetUrl, target: "_blank", rel: "noopener noreferrer" }, h("slot", { key: '16b7c90e062b5f7f5eb15b0ecef44aec6520df16', name: "vviinn-energy-label-data-sheet-text" }, instance.t("energyLabel.dataSheetText")))))))));
483
483
  }
484
484
  get el() { return getElement(this); }
485
485
  };
@@ -1085,6 +1085,25 @@ const getCommonAnalytics = () => _functionExports.pipe(OptionExports.fromNullabl
1085
1085
  const analyticsMonoid = OptionExports.getMonoid(SemigroupExports.first());
1086
1086
  const getAnalyticsModule = analyticsMonoid.concat(getGtagAnalytics(), getCommonAnalytics());
1087
1087
 
1088
+ function getLastUrlPath(url) {
1089
+ if (!url)
1090
+ return "";
1091
+ if (!url.includes("://"))
1092
+ return url;
1093
+ try {
1094
+ const parsed = new URL(url);
1095
+ const segments = parsed.pathname.split("/").filter(Boolean);
1096
+ return segments.length ? `/${segments.pop()}` : url;
1097
+ }
1098
+ catch (_a) {
1099
+ return url;
1100
+ }
1101
+ }
1102
+
1103
+ function joinTruthy(arr) {
1104
+ return arr.filter(Boolean).join(" ");
1105
+ }
1106
+
1088
1107
  const FIT_EXPR = /fit\/\d+\//;
1089
1108
  const containsFit = (url) => {
1090
1109
  return _functionExports.pipe(url.match(FIT_EXPR), EitherExports.fromNullable(url), EitherExports.map(() => url));
@@ -1162,7 +1181,7 @@ const ImageOrPlaceholder = (props) => {
1162
1181
  const hasImage = !!props.src;
1163
1182
  const { num: widthNum, px: widthPx } = getDimensionValues(props.width);
1164
1183
  const { num: heightNum, px: heightPx } = getDimensionValues(props.height);
1165
- return hasImage ? (h("img", { src: props.src, width: widthNum, height: heightNum, alt: props.alt, title: props.title, class: props.className, ref: props.ref, onLoad: props.onLoad, loading: "lazy", part: "image" })) : (h("div", { style: {
1184
+ return hasImage ? (h("img", { src: props.src, width: widthNum, height: heightNum, alt: props.alt, title: props.title, class: props.className, ref: props.ref, onLoad: props.onLoad, loading: "lazy", part: props.part })) : (h("div", { style: {
1166
1185
  width: widthPx,
1167
1186
  height: heightPx,
1168
1187
  }, class: "image-placeholder", part: "image-placeholder", ref: props.ref },
@@ -1172,19 +1191,40 @@ const ImageOrPlaceholder = (props) => {
1172
1191
  const getProcessedSrc = (src, imageResolutionWidth) => {
1173
1192
  return imageResolutionWidth ? processWidth(src, imageResolutionWidth) : src;
1174
1193
  };
1175
- const Image = (props, onLoadEnd = () => undefined) => {
1176
- const processedSrc = getProcessedSrc(props.src, props.imageResolutionWidth);
1177
- return (h("picture", { part: "image-picture" },
1178
- h(ImageOrPlaceholder, { src: processedSrc, width: props.width, height: props.height, alt: props.title, title: props.title, className: "image", ref: props.ref, onLoad: onLoadEnd }),
1179
- props.isSource && h(PlusIcon, null)));
1194
+ const UniversalImage = ({ width, height, title, src, ref, isSource, imageResolutionWidth, isResponsive = false, isFullHeight = false, additionalClasses = [], additionalParts = [], onLoadEnd = () => undefined, }) => {
1195
+ const processedSrc = getProcessedSrc(src, imageResolutionWidth);
1196
+ const classes = joinTruthy([
1197
+ "image",
1198
+ isResponsive && "responsive",
1199
+ isFullHeight && "content-card-image",
1200
+ ...additionalClasses,
1201
+ ]);
1202
+ const computeParts = (base) => joinTruthy([
1203
+ base,
1204
+ isFullHeight &&
1205
+ (base === "image-picture"
1206
+ ? "content-card-image-picture"
1207
+ : "content-card-image"),
1208
+ ...additionalParts,
1209
+ ]);
1210
+ const parts = computeParts("image-picture");
1211
+ const imageParts = computeParts("image");
1212
+ return (h("picture", { part: parts },
1213
+ h(ImageOrPlaceholder, { src: processedSrc, width: !isResponsive ? width : undefined, height: !isResponsive ? height : undefined, alt: title, title: title, part: imageParts, className: classes, ref: ref, onLoad: onLoadEnd }),
1214
+ isSource && h(PlusIcon, null)));
1215
+ };
1216
+ const renderImage = (imageProps, isResponsive, isFullHeight = false) => {
1217
+ return UniversalImage(Object.assign(Object.assign({}, imageProps), { isResponsive,
1218
+ isFullHeight }));
1180
1219
  };
1181
- const ResponsiveImage = (props, onLoadEnd = () => undefined) => {
1182
- const processedSrc = getProcessedSrc(props.src, props.imageResolutionWidth);
1183
- return (h("picture", { part: "image-picture" },
1184
- h(ImageOrPlaceholder, { src: processedSrc, alt: props.title, title: props.title, className: "image responsive", ref: props.ref, onLoad: onLoadEnd })));
1220
+ const ContentCardContent = (contentText, contentLink, labelText = "Content") => {
1221
+ return (h("div", { class: "content-container", part: "content-container content-card-content-container" },
1222
+ h("div", { class: "content-label", part: "content-label" }, labelText),
1223
+ contentText && (h("div", { class: "content-text", part: "content-text", title: contentText }, contentText)),
1224
+ contentLink && (h(Linked, { deeplink: contentLink, class: "content-link", part: "content-link" }, getLastUrlPath(contentLink)))));
1185
1225
  };
1186
1226
 
1187
- const vviinnProductCardCss$1 = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{--product-card-content-align-default:flex-start;--product-card-text-align-default:left;--product-card-image-border-default:none;--product-card-image-bg-color-default:var(--surface-bg-color-01);--basket-button-bg-color-pressed-default:var(--button-bg-color-positive);position:relative;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );font-family:var(--font-family, var(--font-family-base));font-weight:var(--font-weight-400);font-size:var(--font-size-body);line-height:var(--line-height-body);font-style:normal;color:var(--color-text-primary);gap:var(--spacing-100)}.image-container{position:relative;width:100%}.image-placeholder{display:flex;align-items:center;justify-content:center;background:#f0f0f0;aspect-ratio:1 / 1;width:100%;height:auto}.basket-button-container{width:100%;display:flex;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.content-container{display:grid;width:100%;grid-template-columns:1fr;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );gap:var(--spacing-50)}.price-container{display:flex;flex-direction:column;gap:var(--spacing-50);flex-wrap:wrap;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.price-outdated,.price-sale,.price-regular{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );display:flex;gap:var(--spacing-100);flex-wrap:wrap}.price-outdated{color:var(--color-text-helper);text-decoration:line-through}.custom-label{font-weight:var(--font-weight-600);display:none}.price-amount,.custom-label>span,.currency{white-space:nowrap}.custom-label>span{margin-right:var(--spacing-75)}.price-amount--base{color:var(--color-text-helper);font-size:var(--font-size-caption)}.product-type{word-wrap:anywhere}.image{box-sizing:border-box;display:grid;align-content:center;-o-object-position:50% 50%;object-position:50% 50%;aspect-ratio:1;-o-object-fit:contain;object-fit:contain;text-align:center;border:var(\n --product-card-image-border,\n var(--product-card-image-border-default)\n )}.image.responsive{width:100%;height:auto}.currency{padding-left:var(--spacing-50)}.brand,.title,.product-type{display:-webkit-box;max-width:var(--product-card-set-mode-max-width);text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.title{font-weight:var(--font-weight-600);color:var(--color-text-primary);-webkit-line-clamp:2}.deeplink{max-width:100%;text-decoration:none}.image-link{display:contents}picture{display:block;width:100%;height:100%;position:relative}picture::before{display:block;box-sizing:border-box;position:absolute;width:100%;height:100%;top:0;left:0;content:\"\";opacity:0}.product-card-actions,.product-card-actions-top{line-height:0px;position:absolute;right:var(--spacing-75)}.product-card-actions-top{top:var(--spacing-75)}.product-card-actions{bottom:var(--spacing-75)}::slotted([slot=\"vviinn-product-card-actions\"]),.product-card-actions-top,.product-card-actions{display:flex;flex-direction:column;gap:4px}.product-card-actions-top button,.product-card-actions button,vviinn-vpr-button::part(button),.update-button{width:24px;height:24px;line-height:0px;z-index:1;border:none;cursor:pointer;background:none;background-color:var(--button-bg-color-frosted);color:var(--color-icon-on-color);-webkit-backdrop-filter:blur(calc(var(--filter-blur-150) / 2));backdrop-filter:blur(calc(var(--filter-blur-150) / 2));border-radius:var(--border-radius-100);padding:var(--spacing-50);display:flex;justify-content:center;align-items:center}.product-card-actions-top button:hover,.product-card-actions button:hover,.product-card-actions vviinn-vpr-button::part(button):hover,.update-button:hover{background-color:var(--button-bg-color-frosted-hover)}.product-card-actions-top button::after,.product-card-actions button::after,.product-card-actions vviinn-vpr-button::part(button)::after,.update-button::after{position:absolute;width:calc(100% + var(--spacing-100));height:calc(100% + var(--spacing-100));top:calc(-1 * var(--spacing-50));right:calc(-1 * var(--spacing-50));content:\"\";cursor:pointer}.basket-button{box-sizing:border-box;border:none;width:100%;padding:var(--spacing-100);font-size:var(--font-size-label);font-weight:var(--font-weight-600);font-family:var(--font-family, var(--font-family-base));color:var(--color-text-primary);background-color:var(--button-bg-color-secondary);cursor:pointer}.basket-button:hover{background-color:var(--button-bg-color-secondary-hover)}.basket-button-icon-container{display:inline-flex;align-items:center;justify-content:center}picture::after{box-sizing:border-box;display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(\n --product-card-image-bg-color,\n var(--product-card-image-bg-color-default)\n );mix-blend-mode:multiply;content:\"\"}: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\");position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px);background-color:transparent}:host(.animated) .product-card-actions,:host(.animated) .product-card-actions-top{display:none}.basket-button-content{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--spacing-75)}:host(.product-card--source){flex-grow:1}:host(.product-card--source) picture{aspect-ratio:1}picture .plus-icon{position:absolute;width:32px;height:32px;top:calc(50% - 32px);right:-88px;padding:var(--spacing-200);background-color:var(--color-bg-base);color:var(--color-text-placeholder);outline:1px solid var(--color-border-01);z-index:1;border-radius:50%}.basket-button.pressed{background-color:var(\n --basket-button-bg-color-pressed,\n var(--basket-button-bg-color-pressed-default)\n )}.basket-button.pressed .discount-percentage{padding-right:var(--spacing-50)}@media (max-width: 768px){picture .plus-icon{padding:var(--spacing-100);top:calc(50% - var(--spacing-300));right:calc(-1 * var(--spacing-300))}}@keyframes pulse{0%{background-color:var(--surface-bg-color-01)}50%{background-color:var(--surface-bg-color-01-active)}100%{background-color:var(--surface-bg-color-01)}}.discount-label{position:absolute;left:var(--spacing-none);top:var(--spacing-150);padding:var(--spacing-25) var(--spacing-50);border-radius:var(--border-radius-none) var(--border-radius-50)\n var(--border-radius-50) var(--border-radius-none);color:var(--color-text-on-color);background-color:var(--label-bg-color-accent);letter-spacing:var(--letter-spacing-label)}vviinn-energy-label{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.footer-arrow{position:absolute;bottom:-35px;left:50%;width:0;height:0;transform:translate(-50%, 0) rotate(90deg);border-top:22px solid transparent;border-bottom:22px solid transparent;border-right:22px solid var(--color-border-02);z-index:99}.footer-arrow::after{content:\"\";width:0;height:0;border-top:21px solid transparent;border-bottom:21px solid transparent;border-right:21.5px solid #ffffff;position:absolute;top:-21px;left:1px}.hidden{display:none !important}";
1227
+ const vviinnProductCardCss$1 = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{--product-card-content-align-default:flex-start;--product-card-text-align-default:left;--product-card-image-border-default:none;--product-card-image-bg-color-default:var(--surface-bg-color-01);--basket-button-bg-color-pressed-default:var(--button-bg-color-positive);position:relative;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );font-family:var(--font-family, var(--font-family-base));font-weight:var(--font-weight-400);font-size:var(--font-size-body);line-height:var(--line-height-body);font-style:normal;color:var(--color-text-primary);gap:var(--spacing-100)}.image-container{position:relative;width:100%}.image-placeholder{display:flex;align-items:center;justify-content:center;background:#f0f0f0;aspect-ratio:1 / 1;width:100%;height:auto}.basket-button-container{width:100%;display:flex;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.content-container{display:grid;width:100%;grid-template-columns:1fr;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );gap:var(--spacing-50)}.price-container{display:flex;flex-direction:column;gap:var(--spacing-50);flex-wrap:wrap;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.price-outdated,.price-sale,.price-regular{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );display:flex;gap:var(--spacing-100);flex-wrap:wrap}.price-outdated{color:var(--color-text-helper);text-decoration:line-through}.custom-label{font-weight:var(--font-weight-600);display:none}.price-amount,.custom-label>span,.currency{white-space:nowrap}.custom-label>span{margin-right:var(--spacing-75)}.price-amount--base{color:var(--color-text-helper);font-size:var(--font-size-caption)}.product-type{word-wrap:anywhere}.image{box-sizing:border-box;display:grid;align-content:center;-o-object-position:50% 50%;object-position:50% 50%;aspect-ratio:1;-o-object-fit:contain;object-fit:contain;text-align:center;border:var(\n --product-card-image-border,\n var(--product-card-image-border-default)\n )}.image.responsive{width:100%;height:auto}.currency{padding-left:var(--spacing-50)}.brand,.title,.product-type{display:-webkit-box;max-width:var(--product-card-set-mode-max-width);text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.title{font-weight:var(--font-weight-600);color:var(--color-text-primary);-webkit-line-clamp:2}.deeplink{max-width:100%;text-decoration:none}.image-link{display:contents}picture{display:block;width:100%;height:100%;position:relative}picture::before{display:block;box-sizing:border-box;position:absolute;width:100%;height:100%;top:0;left:0;content:\"\";opacity:0}.product-card-actions,.product-card-actions-top{line-height:0px;position:absolute;right:var(--spacing-75)}.product-card-actions-top{top:var(--spacing-75)}.product-card-actions{bottom:var(--spacing-75)}::slotted([slot=\"vviinn-product-card-actions\"]),.product-card-actions-top,.product-card-actions{display:flex;flex-direction:column;gap:4px}.product-card-actions-top button,.product-card-actions button,vviinn-vpr-button::part(button),.update-button{width:24px;height:24px;line-height:0px;z-index:1;border:none;cursor:pointer;background:none;background-color:var(--button-bg-color-frosted);color:var(--color-icon-on-color);-webkit-backdrop-filter:blur(calc(var(--filter-blur-150) / 2));backdrop-filter:blur(calc(var(--filter-blur-150) / 2));border-radius:var(--border-radius-100);padding:var(--spacing-50);display:flex;justify-content:center;align-items:center}.product-card-actions-top button:hover,.product-card-actions button:hover,.product-card-actions vviinn-vpr-button::part(button):hover,.update-button:hover{background-color:var(--button-bg-color-frosted-hover)}.product-card-actions-top button::after,.product-card-actions button::after,.product-card-actions vviinn-vpr-button::part(button)::after,.update-button::after{position:absolute;width:calc(100% + var(--spacing-100));height:calc(100% + var(--spacing-100));top:calc(-1 * var(--spacing-50));right:calc(-1 * var(--spacing-50));content:\"\";cursor:pointer}.basket-button{box-sizing:border-box;border:none;width:100%;padding:var(--spacing-100);font-size:var(--font-size-label);font-weight:var(--font-weight-600);font-family:var(--font-family, var(--font-family-base));color:var(--color-text-primary);background-color:var(--button-bg-color-secondary);cursor:pointer}.basket-button:hover{background-color:var(--button-bg-color-secondary-hover)}.basket-button-icon-container{display:inline-flex;align-items:center;justify-content:center}picture::after{box-sizing:border-box;display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(\n --product-card-image-bg-color,\n var(--product-card-image-bg-color-default)\n );mix-blend-mode:multiply;content:\"\"}: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\");position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px);background-color:transparent}:host(.animated) .product-card-actions,:host(.animated) .product-card-actions-top{display:none}.basket-button-content{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--spacing-75)}:host(.product-card--source){flex-grow:1}:host(.product-card--source) picture{aspect-ratio:1}picture .plus-icon{position:absolute;width:32px;height:32px;top:calc(50% - 32px);right:-88px;padding:var(--spacing-200);background-color:var(--color-bg-base);color:var(--color-text-placeholder);outline:1px solid var(--color-border-01);z-index:1;border-radius:50%}.basket-button.pressed{background-color:var(\n --basket-button-bg-color-pressed,\n var(--basket-button-bg-color-pressed-default)\n )}.basket-button.pressed .discount-percentage{padding-right:var(--spacing-50)}@media (max-width: 768px){picture .plus-icon{padding:var(--spacing-100);top:calc(50% - var(--spacing-300));right:calc(-1 * var(--spacing-300))}}@keyframes pulse{0%{background-color:var(--surface-bg-color-01)}50%{background-color:var(--surface-bg-color-01-active)}100%{background-color:var(--surface-bg-color-01)}}.discount-label{position:absolute;left:var(--spacing-none);top:var(--spacing-150);padding:var(--spacing-25) var(--spacing-50);border-radius:var(--border-radius-none) var(--border-radius-50)\n var(--border-radius-50) var(--border-radius-none);color:var(--color-text-on-color);background-color:var(--label-bg-color-accent);letter-spacing:var(--letter-spacing-label)}vviinn-energy-label{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}:host(.content-card){height:auto}.content-card-image-container{height:100%}.content-card-image{aspect-ratio:unset;-o-object-fit:cover;object-fit:cover}.content-card-image.responsive{min-width:100%;height:100%}.content-text,.content-link{display:-webkit-box;-webkit-box-orient:vertical;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.content-text{-webkit-line-clamp:3;font-size:var(--font-size-headline);font-weight:var(--font-weight-600);line-height:var(--line-height-headline);letter-spacing:var(--letter-spacing-headline)}.content-link{-webkit-line-clamp:1;color:var(--color-content-accent);text-decoration:none}.footer-arrow{position:absolute;bottom:-35px;left:50%;width:0;height:0;transform:translate(-50%, 0) rotate(90deg);border-top:22px solid transparent;border-bottom:22px solid transparent;border-right:22px solid var(--color-border-02);z-index:99}.footer-arrow::after{content:\"\";width:0;height:0;border-top:21px solid transparent;border-bottom:21px solid transparent;border-right:21.5px solid #ffffff;position:absolute;top:-21px;left:1px}.hidden{display:none !important}";
1188
1228
 
1189
1229
  const VviinnProductCard = class {
1190
1230
  constructor(hostRef) {
@@ -1206,6 +1246,8 @@ const VviinnProductCard = class {
1206
1246
  this.responsive = false;
1207
1247
  this.customLabels = "";
1208
1248
  this.addPriceContainer = false;
1249
+ /** If true, renders the card in 'Content' mode (special layout) */
1250
+ this.isContentCard = false;
1209
1251
  /** @internal */
1210
1252
  this.index = 0;
1211
1253
  /** @internal */
@@ -1241,6 +1283,7 @@ const VviinnProductCard = class {
1241
1283
  }
1242
1284
  connectedCallback() {
1243
1285
  this.productData = this.getProductData();
1286
+ this.imageProps = this.getImageProps();
1244
1287
  this.isStandalone &&
1245
1288
  instance.init({
1246
1289
  lng: this.locale,
@@ -1325,8 +1368,8 @@ const VviinnProductCard = class {
1325
1368
  getProduct() {
1326
1369
  return searchState.results.find((r) => r.productId === this.productId);
1327
1370
  }
1328
- renderImage() {
1329
- const props = {
1371
+ getImageProps() {
1372
+ return {
1330
1373
  width: this.imageWidth,
1331
1374
  height: this.imageWidth * this.imageRatio,
1332
1375
  src: this.image,
@@ -1337,19 +1380,21 @@ const VviinnProductCard = class {
1337
1380
  },
1338
1381
  isSource: this.isSourceProduct,
1339
1382
  };
1340
- return this.responsive ? ResponsiveImage(props) : Image(props);
1341
1383
  }
1342
1384
  render() {
1343
1385
  var _a, _b, _c;
1344
- return (h(Host, { key: 'f337ddf6a59fc953360eeea9c7f02dc2e338c6fe', part: "product-card", class: {
1386
+ if (this.isContentCard) {
1387
+ return (h(Host, { part: "product-card content-card", class: "content-card", exportparts: contentCardParts }, h("div", { class: "image-container content-card-image-container", part: "image-container" }, h(Linked, { deeplink: this.contentLink, part: "image-link content-image-link" }, renderImage(this.imageProps, this.responsive, true))), ContentCardContent(this.contentText, this.contentLink)));
1388
+ }
1389
+ return (h(Host, { part: "product-card", class: {
1345
1390
  animated: this.isTransitioning,
1346
- }, exportparts: productCardParts }, h("div", { key: 'e40481a4a6abd09c88a38e0c285c7c3211f5bea2', class: "image-container", part: "image-container" }, h(Linked, { key: 'fe990c9a1da8c3c848c700c83b7f929509119064', deeplink: this.deeplink, part: "image-link" }, this.renderImage()), h("div", { key: '636ad988a90b0a5b741a86c50d1ce6a4b9addb04', class: "product-card-actions-top", part: "product-card-actions-top" }, h("button", { key: '3c54a8d77d1ff3be9a1d60011919bc195f9ba007', class: {
1391
+ }, exportparts: productCardParts }, h("div", { class: "image-container", part: "image-container" }, h(Linked, { deeplink: this.deeplink, part: "image-link" }, renderImage(this.imageProps, this.responsive)), h("div", { class: "product-card-actions-top", part: "product-card-actions-top" }, h("button", { class: {
1347
1392
  hidden: !this.favoriteShow || this.isSourceProduct,
1348
1393
  }, part: "favorite-button", onClick: this.favoriteButtonClickHandler.bind(this) }, h("div", { key: "favorite-not-pressed", class: {
1349
1394
  hidden: this.favoriteButonPressed,
1350
- } }, h("slot", { key: '7f83941b23b05114ac0a432eefb24d6ff3fae8cf', name: "vviinn-favorite-icon" }, h(FavoriteIcon, { key: '3493c7d29b7620c290033f23c9e7372a4d12cfa2', width: 14, height: 14 }))), h("div", { key: "favorite-pressed", class: {
1395
+ } }, h("slot", { name: "vviinn-favorite-icon" }, h(FavoriteIcon, { width: 14, height: 14 }))), h("div", { key: "favorite-pressed", class: {
1351
1396
  hidden: !this.favoriteButonPressed,
1352
- } }, h("slot", { key: '4976316d03f0c12046d23779a79e52626de2c93b', name: "vviinn-favorite-icon-pressed" }, h(FavoriteIconPressed, { key: '2978acc4ade06171cf7084365e68ec4aaed8ab9c', width: 14, height: 14 })))), h("button", { key: '61a5b1da74beaf53bf77f18a4a67f642c0c950f2', class: {
1397
+ } }, h("slot", { name: "vviinn-favorite-icon-pressed" }, h(FavoriteIconPressed, { width: 14, height: 14 })))), h("button", { class: {
1353
1398
  "update-button": true,
1354
1399
  hidden: !this.isShowUpdateButton(),
1355
1400
  }, part: "update-button-item", onClick: () => {
@@ -1357,26 +1402,26 @@ const VviinnProductCard = class {
1357
1402
  animationInterval: generateRandomNumber(800, 1400),
1358
1403
  productData: this.productData,
1359
1404
  });
1360
- } }, h("div", { key: '1c95d46fd4ff65d2beb7e2ea7a86e28d9bd7c415' }, h("slot", { key: '6c877dd6cbb3484dc9f2995a9b69e4ff139b3c83', name: "vviinn-update-button-icon" }, h(UpdateIcon, { key: 'de48212dcd3c45b54deebe58019c5a5728a298f5', width: 14, height: 14 }))))), h("div", { key: 'ce4b9ff27a1064691a6fbfa44e01bc45f67f46f9', class: "product-card-actions", part: "product-card-actions" }, h("slot", { key: '811383f3be2955ed6f5103a1dc13d3ffe6167c69', name: "vviinn-product-card-actions" }))), h("div", { key: 'b282b8135396c679dcfb04f1c12b9ab420567e45', class: "content-container", part: "content-container" }, this.isTransitioning ? (h(Fragment, null, h("vviinn-skeleton", { height: 40 }), h("vviinn-skeleton", { height: 20, halfWidth: true }))) : (h(Fragment, null, h(Linked, { deeplink: this.deeplink, part: "deeplink" }, h("span", { class: "title", part: "title" }, this.productTitle)), ((_a = this.brand) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("span", { class: "brand", part: "brand" }, this.brand)), ((_b = this.productType) === null || _b === void 0 ? void 0 : _b.length) > 0 && (h("span", { class: "product-type", part: "product-type" }, this.productType)), ((_c = this === null || this === void 0 ? void 0 : this.energyCertifications) !== null && _c !== void 0 ? _c : []).map((energyCertification) => (h("vviinn-energy-label", { classIconUrls: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.classIconUrls, classDataSheetUrl: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.classDataSheetUrl, productType: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.productType }))), h(Price, { prefix: this.pricePrefix, currency: this.currency, locale: this.locale, price: this.price, basePrice: parseBasePrice(this.basePrice), salePrice: this.salePrice, baseSalePrice: parseBasePrice(this.baseSalePrice), showInContainer: this.addPriceContainer }), this.setMode &&
1405
+ } }, h("div", null, h("slot", { name: "vviinn-update-button-icon" }, h(UpdateIcon, { width: 14, height: 14 }))))), h("div", { class: "product-card-actions", part: "product-card-actions" }, h("slot", { name: "vviinn-product-card-actions" }))), h("div", { class: "content-container", part: "content-container" }, this.isTransitioning ? (h(Fragment, null, h("vviinn-skeleton", { height: 40 }), h("vviinn-skeleton", { height: 20, halfWidth: true }))) : (h(Fragment, null, h(Linked, { deeplink: this.deeplink, part: "deeplink" }, h("span", { class: "title", part: "title" }, this.productTitle)), ((_a = this.brand) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("span", { class: "brand", part: "brand" }, this.brand)), ((_b = this.productType) === null || _b === void 0 ? void 0 : _b.length) > 0 && (h("span", { class: "product-type", part: "product-type" }, this.productType)), ((_c = this === null || this === void 0 ? void 0 : this.energyCertifications) !== null && _c !== void 0 ? _c : []).map((energyCertification) => (h("vviinn-energy-label", { classIconUrls: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.classIconUrls, classDataSheetUrl: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.classDataSheetUrl, productType: energyCertification === null || energyCertification === void 0 ? void 0 : energyCertification.productType }))), h(Price, { prefix: this.pricePrefix, currency: this.currency, locale: this.locale, price: this.price, basePrice: parseBasePrice(this.basePrice), salePrice: this.salePrice, baseSalePrice: parseBasePrice(this.baseSalePrice), showInContainer: this.addPriceContainer }), this.setMode &&
1361
1406
  !this.appliedDiscountPercentage &&
1362
- this.currentDiscountPercentage && (h("div", { class: "discount-label", part: "discount-label" }, `-${this.currentDiscountPercentage}%`)), renderCustomLabels(this.customLabels.split(",")))), h("vviinn-skeleton", { key: '1f965e02586545c4c06ca183f87108adda8aeea0', height: 40, class: {
1407
+ this.currentDiscountPercentage && (h("div", { class: "discount-label", part: "discount-label" }, `-${this.currentDiscountPercentage}%`)), renderCustomLabels(this.customLabels.split(",")))), h("vviinn-skeleton", { height: 40, class: {
1363
1408
  hidden: !this.isTransitioning,
1364
- } })), h("div", { key: '8eac508b0683163c2d6b693c952785c4cf580afa', class: {
1409
+ } })), h("div", { class: {
1365
1410
  "basket-button-container": true,
1366
1411
  hidden: !this.isShowBasketButton(),
1367
- }, part: "basket-button-container" }, h("button", { key: '7dbea605523c5f4bed52439503a6acc8cd35fa75', class: {
1412
+ }, part: "basket-button-container" }, h("button", { class: {
1368
1413
  "basket-button": true,
1369
1414
  hidden: this.isTransitioning,
1370
1415
  pressed: this.basketButonPressed,
1371
1416
  }, part: "basket-button", onClick: this.basketButtonClickHandler.bind(this) }, h("div", { class: {
1372
1417
  "basket-button-content": true,
1373
1418
  hidden: this.basketButonPressed,
1374
- }, key: "not-pressed" }, h("span", { key: 'a6c45b45a0ff89b879d45507614624a8019124cf', class: "basket-button-icon-container" }, h("slot", { key: '15cb52751d3b1bcff3c4a29faa20178c98d6a410', name: "vviinn-basket-button-icon" }, h(BasketIcon, { key: '1f5ee9586437f3694a4ff8a8a75b6925e52c598f' }))), h("span", { key: '2ad2ab09bb4aee9c50020a611d27c6eb5b2cf33f' }, this.setMode ? (h("slot", { name: "vviinn-basket-button-text", key: "button-text-set" }, instance.t("setMode.basketButtonText"))) : (h("slot", { name: "vviinn-basket-button-text", key: "button-text-default" }, instance.t("basketButtonText"))))), h("div", { key: "pressed", class: {
1419
+ }, key: "not-pressed" }, h("span", { class: "basket-button-icon-container" }, h("slot", { name: "vviinn-basket-button-icon" }, h(BasketIcon, null))), h("span", null, this.setMode ? (h("slot", { name: "vviinn-basket-button-text", key: "button-text-set" }, instance.t("setMode.basketButtonText"))) : (h("slot", { name: "vviinn-basket-button-text", key: "button-text-default" }, instance.t("basketButtonText"))))), h("div", { key: "pressed", class: {
1375
1420
  "basket-button-content": true,
1376
1421
  hidden: !this.basketButonPressed,
1377
- } }, h("span", { key: '6ac34d88bd4fbd4b56326ac2f71735d7f6b93b40', class: "basket-button-icon-container" }, h("slot", { key: '43b0b7be5d77bbc0d9d25666311e1f3f07ee4f01', name: "vviinn-basket-button-icon-pressed" }, h(CheckCircleIcon, { key: '6e624a83806879c8a3d9722b7598e025459e65ac' }))), h("span", { key: '14076b9fcf92d4de86bbbc7fd278ebebff6db32d' }, h("span", { key: 'a98fdf104b5fbcf748575d8c584e862cec22a775', class: "discount-percentage", part: "discount-percentage", hidden: !(this.setMode && this.appliedDiscountPercentage) }, this.appliedDiscountPercentage, "%"), h("slot", { key: '493b7a6d83066dab4462464743605873ba175547', name: "vviinn-basket-button-text-pressed" }, this.setMode
1422
+ } }, h("span", { class: "basket-button-icon-container" }, h("slot", { name: "vviinn-basket-button-icon-pressed" }, h(CheckCircleIcon, null))), h("span", null, h("span", { class: "discount-percentage", part: "discount-percentage", hidden: !(this.setMode && this.appliedDiscountPercentage) }, this.appliedDiscountPercentage, "%"), h("slot", { name: "vviinn-basket-button-text-pressed" }, this.setMode
1378
1423
  ? instance.t("setMode.basketButtonPressedText")
1379
- : instance.t("basketButtonPressedText")))))), this.showFooterArrow && h("div", { key: 'd9cea5cbd30650aabe32e2a424f3cf95761b0ec0', class: "footer-arrow" })));
1424
+ : instance.t("basketButtonPressedText")))))), this.showFooterArrow && h("div", { class: "footer-arrow" })));
1380
1425
  }
1381
1426
  get el() { return getElement(this); }
1382
1427
  static get watchers() { return {
@@ -1386,7 +1431,7 @@ const VviinnProductCard = class {
1386
1431
  };
1387
1432
  VviinnProductCard.style = vviinnProductCardCss$1;
1388
1433
 
1389
- const vviinnProductCardCss = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{--product-card-content-align-default:flex-start;--product-card-text-align-default:left;--product-card-image-border-default:none;--product-card-image-bg-color-default:var(--surface-bg-color-01);--basket-button-bg-color-pressed-default:var(--button-bg-color-positive);position:relative;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );font-family:var(--font-family, var(--font-family-base));font-weight:var(--font-weight-400);font-size:var(--font-size-body);line-height:var(--line-height-body);font-style:normal;color:var(--color-text-primary);gap:var(--spacing-100)}.image-container{position:relative;width:100%}.image-placeholder{display:flex;align-items:center;justify-content:center;background:#f0f0f0;aspect-ratio:1 / 1;width:100%;height:auto}.basket-button-container{width:100%;display:flex;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.content-container{display:grid;width:100%;grid-template-columns:1fr;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );gap:var(--spacing-50)}.price-container{display:flex;flex-direction:column;gap:var(--spacing-50);flex-wrap:wrap;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.price-outdated,.price-sale,.price-regular{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );display:flex;gap:var(--spacing-100);flex-wrap:wrap}.price-outdated{color:var(--color-text-helper);text-decoration:line-through}.custom-label{font-weight:var(--font-weight-600);display:none}.price-amount,.custom-label>span,.currency{white-space:nowrap}.custom-label>span{margin-right:var(--spacing-75)}.price-amount--base{color:var(--color-text-helper);font-size:var(--font-size-caption)}.product-type{word-wrap:anywhere}.image{box-sizing:border-box;display:grid;align-content:center;-o-object-position:50% 50%;object-position:50% 50%;aspect-ratio:1;-o-object-fit:contain;object-fit:contain;text-align:center;border:var(\n --product-card-image-border,\n var(--product-card-image-border-default)\n )}.image.responsive{width:100%;height:auto}.currency{padding-left:var(--spacing-50)}.brand,.title,.product-type{display:-webkit-box;max-width:var(--product-card-set-mode-max-width);text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.title{font-weight:var(--font-weight-600);color:var(--color-text-primary);-webkit-line-clamp:2}.deeplink{max-width:100%;text-decoration:none}.image-link{display:contents}picture{display:block;width:100%;height:100%;position:relative}picture::before{display:block;box-sizing:border-box;position:absolute;width:100%;height:100%;top:0;left:0;content:\"\";opacity:0}.product-card-actions,.product-card-actions-top{line-height:0px;position:absolute;right:var(--spacing-75)}.product-card-actions-top{top:var(--spacing-75)}.product-card-actions{bottom:var(--spacing-75)}::slotted([slot=\"vviinn-product-card-actions\"]),.product-card-actions-top,.product-card-actions{display:flex;flex-direction:column;gap:4px}.product-card-actions-top button,.product-card-actions button,vviinn-vpr-button::part(button),.update-button{width:24px;height:24px;line-height:0px;z-index:1;border:none;cursor:pointer;background:none;background-color:var(--button-bg-color-frosted);color:var(--color-icon-on-color);-webkit-backdrop-filter:blur(calc(var(--filter-blur-150) / 2));backdrop-filter:blur(calc(var(--filter-blur-150) / 2));border-radius:var(--border-radius-100);padding:var(--spacing-50);display:flex;justify-content:center;align-items:center}.product-card-actions-top button:hover,.product-card-actions button:hover,.product-card-actions vviinn-vpr-button::part(button):hover,.update-button:hover{background-color:var(--button-bg-color-frosted-hover)}.product-card-actions-top button::after,.product-card-actions button::after,.product-card-actions vviinn-vpr-button::part(button)::after,.update-button::after{position:absolute;width:calc(100% + var(--spacing-100));height:calc(100% + var(--spacing-100));top:calc(-1 * var(--spacing-50));right:calc(-1 * var(--spacing-50));content:\"\";cursor:pointer}.basket-button{box-sizing:border-box;border:none;width:100%;padding:var(--spacing-100);font-size:var(--font-size-label);font-weight:var(--font-weight-600);font-family:var(--font-family, var(--font-family-base));color:var(--color-text-primary);background-color:var(--button-bg-color-secondary);cursor:pointer}.basket-button:hover{background-color:var(--button-bg-color-secondary-hover)}.basket-button-icon-container{display:inline-flex;align-items:center;justify-content:center}picture::after{box-sizing:border-box;display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(\n --product-card-image-bg-color,\n var(--product-card-image-bg-color-default)\n );mix-blend-mode:multiply;content:\"\"}: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\");position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px);background-color:transparent}:host(.animated) .product-card-actions,:host(.animated) .product-card-actions-top{display:none}.basket-button-content{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--spacing-75)}:host(.product-card--source){flex-grow:1}:host(.product-card--source) picture{aspect-ratio:1}picture .plus-icon{position:absolute;width:32px;height:32px;top:calc(50% - 32px);right:-88px;padding:var(--spacing-200);background-color:var(--color-bg-base);color:var(--color-text-placeholder);outline:1px solid var(--color-border-01);z-index:1;border-radius:50%}.basket-button.pressed{background-color:var(\n --basket-button-bg-color-pressed,\n var(--basket-button-bg-color-pressed-default)\n )}.basket-button.pressed .discount-percentage{padding-right:var(--spacing-50)}@media (max-width: 768px){picture .plus-icon{padding:var(--spacing-100);top:calc(50% - var(--spacing-300));right:calc(-1 * var(--spacing-300))}}@keyframes pulse{0%{background-color:var(--surface-bg-color-01)}50%{background-color:var(--surface-bg-color-01-active)}100%{background-color:var(--surface-bg-color-01)}}.discount-label{position:absolute;left:var(--spacing-none);top:var(--spacing-150);padding:var(--spacing-25) var(--spacing-50);border-radius:var(--border-radius-none) var(--border-radius-50)\n var(--border-radius-50) var(--border-radius-none);color:var(--color-text-on-color);background-color:var(--label-bg-color-accent);letter-spacing:var(--letter-spacing-label)}vviinn-energy-label{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.footer-arrow{position:absolute;bottom:-35px;left:50%;width:0;height:0;transform:translate(-50%, 0) rotate(90deg);border-top:22px solid transparent;border-bottom:22px solid transparent;border-right:22px solid var(--color-border-02);z-index:99}.footer-arrow::after{content:\"\";width:0;height:0;border-top:21px solid transparent;border-bottom:21px solid transparent;border-right:21.5px solid #ffffff;position:absolute;top:-21px;left:1px}.hidden{display:none !important}";
1434
+ const vviinnProductCardCss = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{--product-card-content-align-default:flex-start;--product-card-text-align-default:left;--product-card-image-border-default:none;--product-card-image-bg-color-default:var(--surface-bg-color-01);--basket-button-bg-color-pressed-default:var(--button-bg-color-positive);position:relative;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );font-family:var(--font-family, var(--font-family-base));font-weight:var(--font-weight-400);font-size:var(--font-size-body);line-height:var(--line-height-body);font-style:normal;color:var(--color-text-primary);gap:var(--spacing-100)}.image-container{position:relative;width:100%}.image-placeholder{display:flex;align-items:center;justify-content:center;background:#f0f0f0;aspect-ratio:1 / 1;width:100%;height:auto}.basket-button-container{width:100%;display:flex;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.content-container{display:grid;width:100%;grid-template-columns:1fr;align-items:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );gap:var(--spacing-50)}.price-container{display:flex;flex-direction:column;gap:var(--spacing-50);flex-wrap:wrap;justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}.price-outdated,.price-sale,.price-regular{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n );display:flex;gap:var(--spacing-100);flex-wrap:wrap}.price-outdated{color:var(--color-text-helper);text-decoration:line-through}.custom-label{font-weight:var(--font-weight-600);display:none}.price-amount,.custom-label>span,.currency{white-space:nowrap}.custom-label>span{margin-right:var(--spacing-75)}.price-amount--base{color:var(--color-text-helper);font-size:var(--font-size-caption)}.product-type{word-wrap:anywhere}.image{box-sizing:border-box;display:grid;align-content:center;-o-object-position:50% 50%;object-position:50% 50%;aspect-ratio:1;-o-object-fit:contain;object-fit:contain;text-align:center;border:var(\n --product-card-image-border,\n var(--product-card-image-border-default)\n )}.image.responsive{width:100%;height:auto}.currency{padding-left:var(--spacing-50)}.brand,.title,.product-type{display:-webkit-box;max-width:var(--product-card-set-mode-max-width);text-align:var(\n --product-card-text-align,\n var(--product-card-text-align-default)\n );-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.title{font-weight:var(--font-weight-600);color:var(--color-text-primary);-webkit-line-clamp:2}.deeplink{max-width:100%;text-decoration:none}.image-link{display:contents}picture{display:block;width:100%;height:100%;position:relative}picture::before{display:block;box-sizing:border-box;position:absolute;width:100%;height:100%;top:0;left:0;content:\"\";opacity:0}.product-card-actions,.product-card-actions-top{line-height:0px;position:absolute;right:var(--spacing-75)}.product-card-actions-top{top:var(--spacing-75)}.product-card-actions{bottom:var(--spacing-75)}::slotted([slot=\"vviinn-product-card-actions\"]),.product-card-actions-top,.product-card-actions{display:flex;flex-direction:column;gap:4px}.product-card-actions-top button,.product-card-actions button,vviinn-vpr-button::part(button),.update-button{width:24px;height:24px;line-height:0px;z-index:1;border:none;cursor:pointer;background:none;background-color:var(--button-bg-color-frosted);color:var(--color-icon-on-color);-webkit-backdrop-filter:blur(calc(var(--filter-blur-150) / 2));backdrop-filter:blur(calc(var(--filter-blur-150) / 2));border-radius:var(--border-radius-100);padding:var(--spacing-50);display:flex;justify-content:center;align-items:center}.product-card-actions-top button:hover,.product-card-actions button:hover,.product-card-actions vviinn-vpr-button::part(button):hover,.update-button:hover{background-color:var(--button-bg-color-frosted-hover)}.product-card-actions-top button::after,.product-card-actions button::after,.product-card-actions vviinn-vpr-button::part(button)::after,.update-button::after{position:absolute;width:calc(100% + var(--spacing-100));height:calc(100% + var(--spacing-100));top:calc(-1 * var(--spacing-50));right:calc(-1 * var(--spacing-50));content:\"\";cursor:pointer}.basket-button{box-sizing:border-box;border:none;width:100%;padding:var(--spacing-100);font-size:var(--font-size-label);font-weight:var(--font-weight-600);font-family:var(--font-family, var(--font-family-base));color:var(--color-text-primary);background-color:var(--button-bg-color-secondary);cursor:pointer}.basket-button:hover{background-color:var(--button-bg-color-secondary-hover)}.basket-button-icon-container{display:inline-flex;align-items:center;justify-content:center}picture::after{box-sizing:border-box;display:block;position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(\n --product-card-image-bg-color,\n var(--product-card-image-bg-color-default)\n );mix-blend-mode:multiply;content:\"\"}: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\");position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px);background-color:transparent}:host(.animated) .product-card-actions,:host(.animated) .product-card-actions-top{display:none}.basket-button-content{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:var(--spacing-75)}:host(.product-card--source){flex-grow:1}:host(.product-card--source) picture{aspect-ratio:1}picture .plus-icon{position:absolute;width:32px;height:32px;top:calc(50% - 32px);right:-88px;padding:var(--spacing-200);background-color:var(--color-bg-base);color:var(--color-text-placeholder);outline:1px solid var(--color-border-01);z-index:1;border-radius:50%}.basket-button.pressed{background-color:var(\n --basket-button-bg-color-pressed,\n var(--basket-button-bg-color-pressed-default)\n )}.basket-button.pressed .discount-percentage{padding-right:var(--spacing-50)}@media (max-width: 768px){picture .plus-icon{padding:var(--spacing-100);top:calc(50% - var(--spacing-300));right:calc(-1 * var(--spacing-300))}}@keyframes pulse{0%{background-color:var(--surface-bg-color-01)}50%{background-color:var(--surface-bg-color-01-active)}100%{background-color:var(--surface-bg-color-01)}}.discount-label{position:absolute;left:var(--spacing-none);top:var(--spacing-150);padding:var(--spacing-25) var(--spacing-50);border-radius:var(--border-radius-none) var(--border-radius-50)\n var(--border-radius-50) var(--border-radius-none);color:var(--color-text-on-color);background-color:var(--label-bg-color-accent);letter-spacing:var(--letter-spacing-label)}vviinn-energy-label{justify-content:var(\n --product-card-content-align,\n var(--product-card-content-align-default)\n )}:host(.content-card){height:auto}.content-card-image-container{height:100%}.content-card-image{aspect-ratio:unset;-o-object-fit:cover;object-fit:cover}.content-card-image.responsive{min-width:100%;height:100%}.content-text,.content-link{display:-webkit-box;-webkit-box-orient:vertical;overflow-wrap:anywhere;text-overflow:ellipsis;overflow:hidden}.content-text{-webkit-line-clamp:3;font-size:var(--font-size-headline);font-weight:var(--font-weight-600);line-height:var(--line-height-headline);letter-spacing:var(--letter-spacing-headline)}.content-link{-webkit-line-clamp:1;color:var(--color-content-accent);text-decoration:none}.footer-arrow{position:absolute;bottom:-35px;left:50%;width:0;height:0;transform:translate(-50%, 0) rotate(90deg);border-top:22px solid transparent;border-bottom:22px solid transparent;border-right:22px solid var(--color-border-02);z-index:99}.footer-arrow::after{content:\"\";width:0;height:0;border-top:21px solid transparent;border-bottom:21px solid transparent;border-right:21.5px solid #ffffff;position:absolute;top:-21px;left:1px}.hidden{display:none !important}";
1390
1435
 
1391
1436
  const VviinnProductCardSkeleton = class {
1392
1437
  constructor(hostRef) {
@@ -1410,7 +1455,7 @@ const VviinnSkeleton = class {
1410
1455
  this.halfWidth = false;
1411
1456
  }
1412
1457
  render() {
1413
- return (h(Host, { key: '0142c176f6b684a465e8636af7cb8f148317ae53' }, h("div", { key: 'b8ba6779f3d89c725089bb42c89b951ad7e1e79d', class: {
1458
+ return (h(Host, { key: '749d83daa34563328a2e9bd99d9e0698c8092842' }, h("div", { key: 'dee29d665b867b7d6a6f2b17e96de450b0c3d733', class: {
1414
1459
  "vviinn-skeleton": true,
1415
1460
  }, style: {
1416
1461
  height: this.height ? `${this.height.toString()}px` : "100%",
@@ -10909,7 +10954,7 @@ const getVCSRecommendations = (body) => (options) => {
10909
10954
 
10910
10955
  const getRecommendationsService = (campaignType) => _functionExports.pipe(fromString(campaignType), fold(() => getVPRRecommendations, () => getVCSRecommendations));
10911
10956
 
10912
- const vviinnVprWidgetCss = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{display:grid;grid-gap:var(--spacing-200);width:100%}:host(:not(.loaded)){position:absolute;visibility:hidden}:host(.set){grid-gap:var(--spacing-300)}:host(.set) vviinn-carousel{overflow-x:auto;scrollbar-width:thin}:host(.set) vviinn-product-card::part(image){width:var(--vviinn-set-mode-image-width, 100%);height:auto;min-width:var(--image-set-mode-min-width);aspect-ratio:1 / 1}:host(.set) vviinn-product-card.product-card--source::part(image){width:100%;height:auto}:host(.grid) h2{justify-content:center}.filters-header{display:flex;justify-content:space-between;gap:14px}.filters-header>vviinn-extended-filters{width:44px;height:44px}@media (max-width: 768px){.filters-header>vviinn-filters{flex:1;width:100px}}.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}.widget-header h2,.widget-header h3{margin:0;font-family:var(--font-family, var(--font-family-base))}.widget-header h2{font-weight:var(--font-weight-600);line-height:var(--line-height-title)}.widget-header h3{line-height:var(--line-height-body);margin-top:var(--spacing-100)}.update-button{display:flex;align-items:center;align-self:flex-end;justify-content:center;font-family:var(--font-family, var(--font-family-base));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}.results{display:grid;grid-gap:1rem}.no-result-text{line-height:var(--line-height-headline);font-family:var(--font-family, var(--font-family-base));font-size:var(--font-size-headline);padding-bottom:48px}.visually-hidden{position:absolute;top:0;left:0;z-index:-1;height:0;width:0}.recommendations-results.recommendations-grid{width:100%;align-content:center;align-items:start;box-sizing:border-box;display:grid;grid-gap:32px 16px;grid-template-columns:repeat(\n auto-fill,\n minmax(\n var(--product-card-width, var(--product-card-results-min-width)),\n 1fr\n )\n );padding-bottom:var(--spacing-300)}@media (max-width: 768px){:host(.show-in-widget) .recommendations-results.recommendations-grid{width:unset;grid-gap:24px 16px;justify-content:center;grid-template-columns:repeat(auto-fill, minmax(155px, 1fr))}}";
10957
+ const vviinnVprWidgetCss = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{display:grid;grid-gap:var(--spacing-200);width:100%}:host(:not(.loaded)){position:absolute;visibility:hidden}:host(.set){grid-gap:var(--spacing-300)}:host(.set) vviinn-carousel{overflow-x:auto;scrollbar-width:thin}:host(.set) vviinn-product-card::part(image){width:var(--vviinn-set-mode-image-width, 100%);height:100%;min-width:var(--image-set-mode-min-width);aspect-ratio:1 / 1}:host(.set) vviinn-product-card.product-card--source::part(image){width:100%;height:auto}:host(.grid) h2{justify-content:center}.filters-header{display:flex;justify-content:space-between;gap:14px}.filters-header>vviinn-extended-filters{width:44px;height:44px}@media (max-width: 768px){.filters-header>vviinn-filters{flex:1;width:100px}}.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}.widget-header h2,.widget-header h3{margin:0;font-family:var(--font-family, var(--font-family-base))}.widget-header h2{font-weight:var(--font-weight-600);line-height:var(--line-height-title)}.widget-header h3{line-height:var(--line-height-body);margin-top:var(--spacing-100)}.update-button{display:flex;align-items:center;align-self:flex-end;justify-content:center;font-family:var(--font-family, var(--font-family-base));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}.results{display:grid;grid-gap:1rem}.no-result-text{line-height:var(--line-height-headline);font-family:var(--font-family, var(--font-family-base));font-size:var(--font-size-headline);padding-bottom:48px}.visually-hidden{position:absolute;top:0;left:0;z-index:-1;height:0;width:0}.recommendations-results.recommendations-grid{width:100%;align-content:center;align-items:start;box-sizing:border-box;display:grid;grid-gap:32px 16px;grid-template-columns:repeat(\n auto-fill,\n minmax(\n var(--product-card-width, var(--product-card-results-min-width)),\n 1fr\n )\n );padding-bottom:var(--spacing-300)}@media (max-width: 768px){:host(.show-in-widget) .recommendations-results.recommendations-grid{width:unset;grid-gap:24px 16px;justify-content:center;grid-template-columns:repeat(auto-fill, minmax(155px, 1fr))}}";
10913
10958
 
10914
10959
  var __rest = (undefined && undefined.__rest) || function (s, e) {
10915
10960
  var t = {};
@@ -3,8 +3,8 @@ import { _ as _functionExports, O as OptionExports, d as detectedObjectEq, s as
3
3
  import { s as scaleWithSized, c as center, i as instance } from './Rectangle-Blhy9XN1.js';
4
4
  import { W as WarningIcon } from './WarningIcon-d_dhTVTw.js';
5
5
  import { s as slotChangeListener } from './customized-slots-s64pq2zp.js';
6
- import { c as campaignTypeNames, v as version } from './package-BRkye-3Y.js';
7
- import { m as modalParts } from './index-DJLLuTh-.js';
6
+ import { c as campaignTypeNames, v as version } from './package-Ds0qJGAs.js';
7
+ import { m as modalParts } from './index-CYUAT3RF.js';
8
8
  import { P as PRODUCT_CARD_IMAGE_WIDTH, D as DISCOVERY_WIDGET_IMAGE_RESOLUTION_WIDTH } from './constants-CR1-OmNa.js';
9
9
 
10
10
  const SecondaryActionIcon = () => (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
@@ -68,7 +68,7 @@ const VviinnEmptyResults = class {
68
68
  }
69
69
  };
70
70
 
71
- const renderImage = (image) => image ? (h("img", { width: "28", height: "28", src: image.src, class: "title-image" })) : null;
71
+ const renderTitleImage = (image) => image ? (h("img", { width: "28", height: "28", src: image.src, class: "title-image" })) : null;
72
72
 
73
73
  const vviinnModalCss = ":host{--font-family-base:Inter, system-ui, sans-serif;--font-family-mono:monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-size-title:24px;--font-size-headline:18px;--font-size-label-large:16px;--font-size-label:14px;--font-size-body-large:16px;--font-size-body:14px;--font-size-caption:12px;--line-height-title:32px;--line-height-headline:24px;--line-height-label-large:24px;--line-height-label:20px;--line-height-body-large:24px;--line-height-body:20px;--line-height-caption:16px;--letter-spacing-title:0px;--letter-spacing-headline:0px;--letter-spacing-label-large:0px;--letter-spacing-label:0px;--letter-spacing-body-large:0px;--letter-spacing-body:0px;--letter-spacing-caption:0px;--font-weight-400:400;--font-weight-500:500;--font-weight-600:600;--font-weight-700:700;--spacing-none:0px;--spacing-25:2px;--spacing-50:4px;--spacing-75:6px;--spacing-100:8px;--spacing-125:10px;--spacing-150:12px;--spacing-200:16px;--spacing-250:20px;--spacing-300:24px;--spacing-400:32px;--spacing-500:40px;--spacing-600:48px;--border-radius-none:0px;--border-radius-25:2px;--border-radius-50:4px;--border-radius-100:8px;--border-radius-150:12px;--border-radius-200:16px;--border-radius-300:24px;--border-radius-400:32px;--border-radius-full:9999px;--stroke-width-none:0px;--stroke-width-25:1px;--stroke-width-50:2px;--stroke-width-75:3px;--stroke-width-100:4px;--stroke-width-150:6px;--stroke-width-200:8px;--stroke-width-300:12px;--product-card-widget-min-width:135px;--product-card-results-min-width:250px;--image-set-mode-min-width:155px;--product-card-set-mode-max-width:300px;--source-card-set-mode-max-width:500px;--filter-blur-none:0px;--filter-blur-100:8px;--filter-blur-150:12px;--filter-blur-200:16px;--color-bg-base:#ffffff;--color-bg-inverse:#161616;--color-border-00:#ffffff;--color-border-01:#f4f4f4;--color-border-02:#e0e0e0;--color-border-03:#c6c6c6;--color-border-inverse-00:#161616;--color-border-inverse-01:#393939;--color-field-01:#ffffff;--color-field-02:#f4f4f4;--color-icon-primary:#161616;--color-icon-secondary:#525252;--color-icon-helper:#8d8d8d;--color-icon-on-color:#ffffff;--color-icon-inverse:#ffffff;--color-icon-disabled:#16161640;--color-text-primary:#161616;--color-text-secondary:#525252;--color-text-helper:#8d8d8d;--color-text-placeholder:#a8a8a8;--color-text-on-color:#ffffff;--color-text-inverse:#ffffff;--color-text-disabled:#16161640;--button-bg-color-primary:#000000;--button-bg-color-primary-hover:#161616;--button-bg-color-primary-active:#1e1e1e;--button-bg-color-secondary:#f4f4f4;--button-bg-color-secondary-hover:#e0e0e0;--button-bg-color-secondary-active:#c6c6c6;--button-bg-color-ghost-hover:#f4f4f4;--button-bg-color-ghost-active:#eaeaea;--button-bg-color-frosted:#6f6f6f66;--button-bg-color-frosted-hover:#6f6f6f80;--button-bg-color-frosted-active:#6f6f6f99;--button-bg-color-disabled:#e0e0e0;--button-bg-color-positive:#dcfce7;--surface-bg-color-01:#f4f4f4;--surface-bg-color-01-hover:#eaeaea;--surface-bg-color-01-active:#e0e0e0;--surface-bg-color-02:#ffffff;--surface-bg-color-inverse:#262626;--surface-bg-color-inverse-hover:#303030;--surface-bg-color-inverse-active:#393939;--surface-bg-color-disabled:#e0e0e0;--chip-bg-color-primary:#161616;--chip-bg-color-primary-hover:#1e1e1e;--chip-bg-color-primary-active:#262626;--chip-bg-color-subtle:#f4f4f4;--chip-bg-color-subtle-hover:#eaeaea;--chip-bg-color-subtle-active:#e0e0e0;--chip-bg-color-outline-hover:#f4f4f4;--chip-bg-color-outline-active:#eaeaea;--label-bg-color-accent:#ff3944;}:host{background:white;border-radius:var(--modal-border-radius, var(--border-radius-300));box-sizing:border-box;display:grid;grid-template-rows:min-content auto;max-width:960px;overflow:auto;position:relative}.head{height:64px;font-family:var(--font-family, var(--font-family-base));position:absolute;width:100%;box-sizing:border-box;display:flex;align-items:center;z-index:1;padding:16px}.title{display:flex;align-items:center;transform:translateX(-6px);font-weight:var(--font-weight-600);font-size:18px;line-height:24px;margin:0 auto}.title-image{border-radius:50%;border:1px solid rgb(244, 244, 244);-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;margin-right:8px}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:grid;padding:6px;color:#8d8d8d}button:hover{color:#000}@media (max-width: 768px){:host{animation-name:fade-in;animation-duration:0.5s;animation-fill-mode:forwards;border-radius:24px 24px 0 0}:host(.closed){animation-name:fade-out;animation-fill-mode:none}.head{z-index:1}:host(:not(.first-screen)) .head{position:sticky;background:#ffffff}.body{overflow-y:auto}:host(:not(.first-screen)) .body{padding-bottom:160px}.title{color:#161616;display:flex;align-items:center;font-weight:500;font-size:16px;line-height:24px;margin:0 auto}.title-image{border-radius:50%;border:1px solid rgb(244, 244, 244);-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;margin-right:8px}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;cursor:pointer;display:grid;color:#6f6f6f;padding:0}button:hover{color:#000}:host(.first-screen) button,:host(.first-screen) button:hover{color:white}}@keyframes fade-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fade-out{from{transform:translateY(0)}to{transform:translateY(100%)}}";
74
74
 
@@ -101,10 +101,10 @@ const VviinnModal = class {
101
101
  this.slider = true;
102
102
  }
103
103
  render() {
104
- return (h(Host, { key: 'e6008534642fb543ed667c82154df5c91cdf661c', exportparts: modalParts, class: { closed: !this.active, "first-screen": this.isFirstScreen }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, h("div", { key: 'c3d57c092a9ac2f3037b1385a0389eb22c4c7965', class: "head" }, !this.hideBackButton && (h("button", { key: 'faa3f5d2e4da15e6a988875e9553a45f38540695', part: "secondary-action", onClick: () => {
104
+ return (h(Host, { key: '2b55d24feb158395efb28601b6dd4ea7cb44c8ac', exportparts: modalParts, class: { closed: !this.active, "first-screen": this.isFirstScreen }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, h("div", { key: 'ee63734e3825bc1d1a84bae2e0c16a458145c0fc', class: "head" }, !this.hideBackButton && (h("button", { key: '504e4e580cb092883d423f51cafb0188e8466566', part: "secondary-action", onClick: () => {
105
105
  this.resetState();
106
106
  this.resetTopScroll();
107
- } }, h(SecondaryActionIcon, { key: '96c95e076b462a3bdeba8918941c3922c41b4bd2' }))), h("div", { key: '6b32deba8baeebb5095452dff4428682e69efb13', class: "title", part: "results-title" }, renderImage(searchState.image), h("slot", { key: '7afa8824c1faf611df220af8ca2e9c544f46f499', name: "vviinn-image-search-modal-title" }, instance.t("imageSearchModalTitle"))), h("button", { key: 'eea6caff0dd54414cdc9e79038615deb38740da2', onClick: () => this.close(), class: "close-button", part: "close-button" }, h("svg", { key: 'b88941fd4689430292f3827b2bc99b58b8f374a0', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '1aaa800ac58360486e2186c103cdb622cdc7aa6c', d: "M12 13.3892L6.91958 18.4696C6.72248 18.6667 6.49095 18.7653 6.225 18.7653C5.95905 18.7653 5.72753 18.6667 5.53043 18.4696C5.33333 18.2725 5.23478 18.041 5.23478 17.775C5.23478 17.5091 5.33333 17.2776 5.53043 17.0805L10.6109 12L5.53043 6.9196C5.33333 6.7225 5.23478 6.49098 5.23478 6.22503C5.23478 5.95908 5.33333 5.72755 5.53043 5.53045C5.72753 5.33335 5.95905 5.2348 6.225 5.2348C6.49095 5.2348 6.72248 5.33335 6.91958 5.53045L12 10.6109L17.0804 5.53045C17.2775 5.33335 17.5091 5.2348 17.775 5.2348C18.041 5.2348 18.2725 5.33335 18.4696 5.53045C18.6667 5.72755 18.7652 5.95908 18.7652 6.22503C18.7652 6.49098 18.6667 6.7225 18.4696 6.9196L13.3892 12L18.4696 17.0805C18.6667 17.2776 18.7652 17.5091 18.7652 17.775C18.7652 18.041 18.6667 18.2725 18.4696 18.4696C18.2725 18.6667 18.041 18.7653 17.775 18.7653C17.5091 18.7653 17.2775 18.6667 17.0804 18.4696L12 13.3892Z", fill: "currentColor" })))), h("div", { key: 'e96b98b285f63b78f80d4c47a4e81f2e04b043ad', class: "body" }, h("slot", { key: '27f6ce02ee4a772a98dbc3d619494144cf2f8244' }))));
107
+ } }, h(SecondaryActionIcon, { key: 'f8f41fee98264906fa76666eeb11fc24c507853c' }))), h("div", { key: 'ace69d25186ed7eba74d408a2cf97ed6ce780159', class: "title", part: "results-title" }, renderTitleImage(searchState.image), h("slot", { key: '183a67aa73731bda97a7401d7d7581913f021f5c', name: "vviinn-image-search-modal-title" }, instance.t("imageSearchModalTitle"))), h("button", { key: 'ce0803f9b42a861a01d5672fc983f0dcbd93b763', onClick: () => this.close(), class: "close-button", part: "close-button" }, h("svg", { key: '186c273af33ab58b785759e74f5e6d0f9a056137', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '0c444b987ec0d748fe7f4339c7be78973ef02774', d: "M12 13.3892L6.91958 18.4696C6.72248 18.6667 6.49095 18.7653 6.225 18.7653C5.95905 18.7653 5.72753 18.6667 5.53043 18.4696C5.33333 18.2725 5.23478 18.041 5.23478 17.775C5.23478 17.5091 5.33333 17.2776 5.53043 17.0805L10.6109 12L5.53043 6.9196C5.33333 6.7225 5.23478 6.49098 5.23478 6.22503C5.23478 5.95908 5.33333 5.72755 5.53043 5.53045C5.72753 5.33335 5.95905 5.2348 6.225 5.2348C6.49095 5.2348 6.72248 5.33335 6.91958 5.53045L12 10.6109L17.0804 5.53045C17.2775 5.33335 17.5091 5.2348 17.775 5.2348C18.041 5.2348 18.2725 5.33335 18.4696 5.53045C18.6667 5.72755 18.7652 5.95908 18.7652 6.22503C18.7652 6.49098 18.6667 6.7225 18.4696 6.9196L13.3892 12L18.4696 17.0805C18.6667 17.2776 18.7652 17.5091 18.7652 17.775C18.7652 18.041 18.6667 18.2725 18.4696 18.4696C18.2725 18.6667 18.041 18.7653 17.775 18.7653C17.5091 18.7653 17.2775 18.6667 17.0804 18.4696L12 13.3892Z", fill: "currentColor" })))), h("div", { key: 'a6f61fc03402c68460b981c5e7a5e1c5fed3f521', class: "body" }, h("slot", { key: 'e7ee82a4e8add5bf2bb0f3adc0e5e76761fdb5d7' }))));
108
108
  }
109
109
  get el() { return getElement(this); }
110
110
  };
@@ -233,7 +233,7 @@ const VviinnVprButton = class {
233
233
  }
234
234
  }
235
235
  render() {
236
- return (h(Host, { key: '87aa8b75fca93a8ecfa4a6dde703196dc30d338b', onClick: () => {
236
+ return (h(Host, { key: '09dfd61dbbc3bc43ae2d4cc034faa105d676999f', onClick: () => {
237
237
  if (this.appendSidebarToId && !this.targetAppendSidebarTo) {
238
238
  setTimeout(() => {
239
239
  this.handleClick();
@@ -242,7 +242,7 @@ const VviinnVprButton = class {
242
242
  else {
243
243
  this.handleClick();
244
244
  }
245
- }, role: "button", tabindex: "0" }, h("vviinn-button", { key: 'ef75f37eeeadc8155b23d0f2787cd62e30806195', addStyle: this.addStyle, part: "vviinn-button" }, h("slot", { key: '8307b99a1b93514a512225544e643c5a6e367cee' }, this.campaignType === "VCS" ? (h(CrossSellingIcon, { width: this.iconSideSize, height: this.iconSideSize })) : (h(SimilarProductsIcon, { width: this.iconSideSize, height: this.iconSideSize }))))));
245
+ }, role: "button", tabindex: "0" }, h("vviinn-button", { key: '60b4167b9189c9b396c003a043ed231776bf8210', addStyle: this.addStyle, part: "vviinn-button" }, h("slot", { key: '158ae74be03b06097840931dba71301354368ac8' }, this.campaignType === "VCS" ? (h(CrossSellingIcon, { width: this.iconSideSize, height: this.iconSideSize })) : (h(SimilarProductsIcon, { width: this.iconSideSize, height: this.iconSideSize }))))));
246
246
  }
247
247
  handleClick() {
248
248
  const sidebar = document.createElement("vviinn-recommendations-sidebar");
@@ -3,7 +3,7 @@ import { a as updateGlobalState, u as useSearchStore, g as globalState, _ as _fu
3
3
  import { s as slotChangeListener } from './customized-slots-s64pq2zp.js';
4
4
  import { i as instance } from './Rectangle-Blhy9XN1.js';
5
5
  import { r as resources } from './resources-DcA7Zxs5.js';
6
- import { s as searchBarParts } from './index-DJLLuTh-.js';
6
+ import { s as searchBarParts } from './index-CYUAT3RF.js';
7
7
 
8
8
  const TextSearchIcon = () => (h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
9
9
  h("path", { d: "M20.6 4.57C17.39 4.19 16.88 3.68 16.42 0.37C16.38 0.15 16.22 0 16.01 0C15.8 0 15.63 0.15 15.59 0.37C15.12 3.66 14.63 4.13 11.41 4.57C11.17 4.61 11.01 4.77 11.01 5C11.01 5.23 11.17 5.39 11.41 5.42C14.63 5.81 15.14 6.31 15.59 9.62C15.63 9.84 15.8 10 16.01 10C16.22 10 16.39 9.84 16.42 9.62C16.89 6.31 17.39 5.81 20.6 5.42C20.84 5.38 21 5.22 21 5C21 4.78 20.83 4.6 20.6 4.57Z", fill: "#525252" }),
@@ -226,8 +226,8 @@ const VviinnTextSearch = class {
226
226
  }
227
227
  }
228
228
  render() {
229
- return (h(Host, { key: 'a066fa697365db3c9c5e54a46298e29d811e421d', exportparts: searchBarParts }, h("div", { key: 'bd9405c73b5b3d57573e22c57867a62e6476d424', class: "text-search-container", part: "text-search-container" }, h("input", { key: 'a10326c55a1e0388869d937b18832ab5e5242b88', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.searchQuery, onInput: (event) => this.handleInputChange(event), onKeyUp: (event) => this.handleKeyPress(event) }), this.mode === "extended" && (h("vviinn-vps-button", { key: 'e1761d5971f891e66fe8c202d83247419de9d0d3', token: globalState.token, locale: globalState.locale, apiPath: globalState.apiPath, addStyle: false, showInWidget: false, exportparts: "vviinn-button" })), this.mode === "basic" && (h("slot", { key: 'be7158671ace61a4171a2cc9ba50208c3192e1ec', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
230
- this.recognition && (h("button", { key: 'a8f654025d2870aae5850bf17ee2a3d5769b4380', class: "speech-button", part: "speech-button", onClick: () => this.handleSpeech() }, h(MicIcon, { key: '636b4c426410f1a7f45923718462940b494cfe91' }), this.isShowRecording() && (h("span", { key: 'd0d64aecf6b9850237cdabee58595652a6568c32', class: "recording-indicator" })))), h("button", { key: '6c21d014e94e087ed3b8b9dc5f2654d9d31ca633', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), disabled: this.state.loading }, this.isShowPreloader() ? (h("vviinn-preloader", null)) : (h("slot", { name: "vviinn-text-search-icon" }, h(TextSearchIcon, null))))), this.showTooltip && (h("p", { key: 'ce6634b658ae8535e0ee007370c728cafa941387', class: "text-search-tooltip", part: "text-search-tooltip" }, instance.t(this.tooltipText)))));
229
+ return (h(Host, { key: 'c4929073c1229ccdc941c4168ce4c20e7ab86748', exportparts: searchBarParts }, h("div", { key: '6b18110e89fce5f80de212cdcd8bb4aa93c9a252', class: "text-search-container", part: "text-search-container" }, h("input", { key: 'd65c310e2ead8f2e918e29c23c6ee6810d3f023f', class: "text-search-input", part: "text-search-input", type: "text", placeholder: this.getPlaceholderText(), value: this.searchQuery, onInput: (event) => this.handleInputChange(event), onKeyUp: (event) => this.handleKeyPress(event) }), this.mode === "extended" && (h("vviinn-vps-button", { key: '63c12d90c876c52d3b1ac0672657ba9034d566e2', token: globalState.token, locale: globalState.locale, apiPath: globalState.apiPath, addStyle: false, showInWidget: false, exportparts: "vviinn-button" })), this.mode === "basic" && (h("slot", { key: 'b0d3250b809ea692bff4a0c9f8ae9c88e4afe702', name: "vviinn-text-search-actions" })), (this.mode === "extended" || this.showInWidget) &&
230
+ this.recognition && (h("button", { key: 'f59432039bddcae76e224e9ad4dd1dc4a57f56da', class: "speech-button", part: "speech-button", onClick: () => this.handleSpeech() }, h(MicIcon, { key: '155bee4ac5cb4e7b86ffcd28483027d36a378caa' }), this.isShowRecording() && (h("span", { key: 'da1ab308baab739ccb48f0eb68f32c6c40b68e30', class: "recording-indicator" })))), h("button", { key: 'bbe403e8e4a5940fa43f884782a788765d55b846', class: "text-search-button", part: "text-search-button", onClick: () => this.handleTextSearch(), disabled: this.state.loading }, this.isShowPreloader() ? (h("vviinn-preloader", null)) : (h("slot", { name: "vviinn-text-search-icon" }, h(TextSearchIcon, null))))), this.showTooltip && (h("p", { key: '8e40fff9010c28394a8896d5387a5c4141d72f19', class: "text-search-tooltip", part: "text-search-tooltip" }, instance.t(this.tooltipText)))));
231
231
  }
232
232
  get el() { return getElement(this); }
233
233
  };
@@ -108,9 +108,9 @@ const VviinnVpsButton = class {
108
108
  }
109
109
  render() {
110
110
  var _a;
111
- return (h(Host, { key: 'e82401ed7aee7a1fa97df083fc19dd62e84a3e48', tabindex: "0", role: "button" }, h("vviinn-button", { key: 'e2f188230715175e419776f7e890f148bd8854b4', onClick: () => {
111
+ return (h(Host, { key: '1dd180283436297aae545d11108190958b847077', tabindex: "0", role: "button" }, h("vviinn-button", { key: '51c208321957d7d448316935ec63cc42ef3f0d5d', onClick: () => {
112
112
  this.handleClick();
113
- }, addStyle: this.addStyle, part: "vviinn-button" }, h("slot", { key: '679712c82fca1e5c00d78b9581c32032960f73cd' }, this.mode === "camera" ? (h(SearchModalCameraIcon, null)) : this.textSearchShow ? (h(SearchModalFullSearchIcon, null)) : (h(SearchModalImageSearchIcon, null)))), SlotSkeleton("search"), h("vviinn-vps-widget", { key: 'a0708052c0995085bba613b7cad11d9ffb686eb1', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton.bind(this), buttonElementId: this.el.id, active: this.buttonPressed &&
113
+ }, addStyle: this.addStyle, part: "vviinn-button" }, h("slot", { key: '916552c8f50c743b4604b2596234ef7e612a218e' }, this.mode === "camera" ? (h(SearchModalCameraIcon, null)) : this.textSearchShow ? (h(SearchModalFullSearchIcon, null)) : (h(SearchModalImageSearchIcon, null)))), SlotSkeleton("search"), h("vviinn-vps-widget", { key: '2a375cf4b45c81595756939062e35080bee051c4', mode: this.mode, "currency-sign": this.currencySign, token: this.token, locale: this.locale, apiPath: this.apiPath, pricePrefix: this.pricePrefix, campaignId: this.campaignId, campaignIdTextSearch: this.campaignIdTextSearch, campaignIdVisualSearch: this.campaignIdVisualSearch, showingInButton: true, buttonPressed: this.buttonPressed, resetVpsButton: this.resetButton.bind(this), buttonElementId: this.el.id, active: this.buttonPressed &&
114
114
  (this.mode === "modal" || this.mode === "camera"), excluded: this.excluded, productDetailsNewTab: this.productDetailsNewTab, productDetailsRedirect: this.productDetailsRedirect, imageResolutionWidth: this.imageResolutionWidth, exampleImageSource: this.exampleImageSource, textSearchShow: this.textSearchShow, addToBasketShow: this.addToBasketShow, addPriceContainer: this.addPriceContainer, replaceSlotsContentInButton: this.replaceSlotsContent.bind(this), oneClickDiscoveryShow: (_a = this.oneClickDiscoveryShow) !== null && _a !== void 0 ? _a : !!this.oneClickDiscoveryMode, oneClickDiscoveryMode: this.oneClickDiscoveryMode, oneClickDiscoveryCampaigns: this.oneClickDiscoveryCampaigns, favoriteShow: this.favoriteShow, showInWidget: this.showInWidget, parentSlots: this.slots })));
115
115
  }
116
116
  get el() { return getElement(this); }