vviinn-widgets 2.20.21 → 2.20.29

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 (97) hide show
  1. package/dist/cjs/highlight-box_22.cjs.entry.js +25 -10
  2. package/dist/cjs/i18next-74ff3413.js +2258 -0
  3. package/dist/cjs/loader.cjs.js +1 -1
  4. package/dist/cjs/{package-1c24894e.js → package-fc932371.js} +1 -1
  5. package/dist/cjs/vviinn-carousel_3.cjs.entry.js +86 -65
  6. package/dist/cjs/vviinn-recommendations-sidebar.cjs.entry.js +2 -1
  7. package/dist/cjs/vviinn-vpr-button.cjs.entry.js +4 -2
  8. package/dist/cjs/vviinn-vps-button.cjs.entry.js +1 -1
  9. package/dist/cjs/vviinn-vps-widget.cjs.entry.js +69 -2
  10. package/dist/cjs/vviinn-widgets.cjs.js +1 -1
  11. package/dist/collection/components/vviinn-error/vviinn-empty-results/vviinn-empty-results.js +2 -1
  12. package/dist/collection/components/vviinn-example-images/vviinn-example-images.js +19 -1
  13. package/dist/collection/components/vviinn-modal/vviinn-modal.css +20 -2
  14. package/dist/collection/components/vviinn-modal/vviinn-modal.js +12 -1
  15. package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.js +43 -1
  16. package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.js +43 -1
  17. package/dist/collection/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.js +43 -1
  18. package/dist/collection/components/vviinn-onboarding/vviinn-onboarding.js +2 -1
  19. package/dist/collection/components/vviinn-privacy-badge/vviinn-privacy-badge.js +25 -1
  20. package/dist/collection/components/vviinn-product-card/stories/vviinn-product-card.stories.js +1 -1
  21. package/dist/collection/components/vviinn-teaser/vviinn-teaser.js +2 -1
  22. package/dist/collection/components/vviinn-vpr-button/recommendations-sidebar/recommendations-sidebar.js +24 -1
  23. package/dist/collection/components/vviinn-vpr-button/stories/vviinn-vpr-button.stories.js +5 -1
  24. package/dist/collection/components/vviinn-vpr-button/vviinn-vpr-button.js +29 -4
  25. package/dist/collection/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.js +5 -2
  26. package/dist/collection/components/vviinn-vpr-widget/vviinn-vpr-vidget.js +26 -12
  27. package/dist/collection/components/vviinn-vps-button/stories/vviinn-vps-button.stories.js +3 -0
  28. package/dist/collection/components/vviinn-vps-button/vviinn-vps-button.js +9 -4
  29. package/dist/collection/components/vviinn-vps-widget/stories/vviinn-vps-widget.stories.js +10 -8
  30. package/dist/collection/components/vviinn-vps-widget/vviinn-vps-widget.js +22 -10
  31. package/dist/collection/locale/index.js +1 -0
  32. package/dist/collection/locale/resources-vpr.js +12 -0
  33. package/dist/collection/locale/resources-vps.js +60 -0
  34. package/dist/esm/highlight-box_22.entry.js +25 -10
  35. package/dist/esm/i18next-387f2b0a.js +2256 -0
  36. package/dist/esm/loader.js +1 -1
  37. package/dist/esm/package-e2f2d588.js +3 -0
  38. package/dist/esm/vviinn-carousel_3.entry.js +86 -65
  39. package/dist/esm/vviinn-recommendations-sidebar.entry.js +2 -1
  40. package/dist/esm/vviinn-vpr-button.entry.js +4 -2
  41. package/dist/esm/vviinn-vps-button.entry.js +1 -1
  42. package/dist/esm/vviinn-vps-widget.entry.js +69 -2
  43. package/dist/esm/vviinn-widgets.js +1 -1
  44. package/dist/types/components/vviinn-example-images/vviinn-example-images.d.ts +1 -0
  45. package/dist/types/components/vviinn-modal/vviinn-modal.d.ts +1 -0
  46. package/dist/types/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-1/vviinn-onboarding-card-1.d.ts +2 -0
  47. package/dist/types/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-2/vviinn-onboarding-card-2.d.ts +2 -0
  48. package/dist/types/components/vviinn-onboarding/onboarding-cards/vviinn-onboarding-card-3/vviinn-onboarding-card-3.d.ts +2 -0
  49. package/dist/types/components/vviinn-privacy-badge/vviinn-privacy-badge.d.ts +1 -0
  50. package/dist/types/components/vviinn-vpr-button/recommendations-sidebar/recommendations-sidebar.d.ts +2 -0
  51. package/dist/types/components/vviinn-vpr-button/vviinn-vpr-button.d.ts +5 -2
  52. package/dist/types/components/vviinn-vpr-widget/vviinn-vpr-vidget.d.ts +5 -4
  53. package/dist/types/components/vviinn-vps-button/vviinn-vps-button.d.ts +3 -2
  54. package/dist/types/components/vviinn-vps-widget/vviinn-vps-widget.d.ts +3 -2
  55. package/dist/types/components.d.ts +48 -20
  56. package/dist/types/locale/index.d.ts +1 -0
  57. package/dist/types/locale/resources-vpr.d.ts +2 -0
  58. package/dist/types/locale/resources-vps.d.ts +2 -0
  59. package/dist/vviinn-widgets/p-2e76a5c3.js +1 -0
  60. package/dist/vviinn-widgets/p-51dd5bb7.entry.js +1 -0
  61. package/dist/vviinn-widgets/p-5283bad8.entry.js +1 -0
  62. package/dist/vviinn-widgets/p-643545b1.entry.js +1 -0
  63. package/dist/vviinn-widgets/p-a4d06752.entry.js +1 -0
  64. package/dist/vviinn-widgets/p-c06f6765.entry.js +1 -0
  65. package/dist/vviinn-widgets/p-d99266bf.js +1 -0
  66. package/dist/vviinn-widgets/p-df710209.entry.js +1 -0
  67. package/dist/vviinn-widgets/vviinn-widgets.esm.js +1 -1
  68. package/package.json +3 -2
  69. package/www/build/p-2e76a5c3.js +1 -0
  70. package/www/build/p-51dd5bb7.entry.js +1 -0
  71. package/www/build/p-5283bad8.entry.js +1 -0
  72. package/www/build/p-643545b1.entry.js +1 -0
  73. package/www/build/p-9e468d0a.js +161 -0
  74. package/www/build/p-a4d06752.entry.js +1 -0
  75. package/www/build/p-c06f6765.entry.js +1 -0
  76. package/www/build/p-d99266bf.js +1 -0
  77. package/www/build/p-df710209.entry.js +1 -0
  78. package/www/build/p-e0153ae2.css +6 -0
  79. package/www/build/vviinn-widgets.esm.js +1 -1
  80. package/www/index.html +4 -1
  81. package/dist/esm/package-4909a9ed.js +0 -3
  82. package/dist/vviinn-widgets/p-1aa66c1a.entry.js +0 -1
  83. package/dist/vviinn-widgets/p-4cb106e3.entry.js +0 -1
  84. package/dist/vviinn-widgets/p-637925f0.entry.js +0 -1
  85. package/dist/vviinn-widgets/p-6a189f8f.js +0 -1
  86. package/dist/vviinn-widgets/p-a1c3ccce.entry.js +0 -1
  87. package/dist/vviinn-widgets/p-ab973311.entry.js +0 -1
  88. package/dist/vviinn-widgets/p-e5fbf695.entry.js +0 -1
  89. package/www/build/p-1aa66c1a.entry.js +0 -1
  90. package/www/build/p-3fe5816c.js +0 -1
  91. package/www/build/p-4cb106e3.entry.js +0 -1
  92. package/www/build/p-637925f0.entry.js +0 -1
  93. package/www/build/p-6a189f8f.js +0 -1
  94. package/www/build/p-a1c3ccce.entry.js +0 -1
  95. package/www/build/p-a67898be.css +0 -1
  96. package/www/build/p-ab973311.entry.js +0 -1
  97. package/www/build/p-e5fbf695.entry.js +0 -1
@@ -14,7 +14,7 @@ const patchEsm = () => {
14
14
  const defineCustomElements = (win, options) => {
15
15
  if (typeof window === 'undefined') return Promise.resolve();
16
16
  return patchEsm().then(() => {
17
- return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["cropper-handler.cjs",[[1,"cropper-handler",{"handler":[16],"disabled":[4]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-carousel_3.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32]},[[0,"vviinnProductLoad","handleProductLoading"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32]}],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"imageLoaded":[32]}]]],["highlight-box_22.cjs",[[1,"vviinn-image-view",{"basicEventData":[16]}],[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16]}],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge"],[1,"vviinn-teaser"],[1,"image-cropper",{"disabled":[4],"basicEventData":[16],"handleMove":[32]}],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[1,"highlight-box"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"slider":[32]}],[1,"vviinn-onboarding-card-1"],[1,"vviinn-onboarding-card-2"],[1,"vviinn-onboarding-card-3"],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32]},[[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"]}]]]], options);
17
+ return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["cropper-handler.cjs",[[1,"cropper-handler",{"handler":[16],"disabled":[4]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-carousel_3.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32]},[[0,"vviinnProductLoad","handleProductLoading"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32]}],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"imageLoaded":[32]}]]],["highlight-box_22.cjs",[[1,"vviinn-image-view",{"basicEventData":[16]}],[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16],"exampleImagesTitle":[1,"example-images-title"]}],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-teaser"],[1,"image-cropper",{"disabled":[4],"basicEventData":[16],"handleMove":[32]}],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[1,"highlight-box"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"slider":[32]}],[1,"vviinn-onboarding-card-1",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-2",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-3",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32]},[[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"]}]]]], options);
18
18
  });
19
19
  };
20
20
 
@@ -1,5 +1,5 @@
1
1
  'use strict';
2
2
 
3
- const version = "2.20.21";
3
+ const version = "2.20.29";
4
4
 
5
5
  exports.version = version;
@@ -6,7 +6,8 @@ const index = require('./index-a4becaff.js');
6
6
  const imageSearch_store = require('./imageSearch.store-967326bd.js');
7
7
  const index$1 = require('./index-6cfe5293.js');
8
8
  const Campaign = require('./Campaign-778b5b2c.js');
9
- const _package = require('./package-1c24894e.js');
9
+ const i18next = require('./i18next-74ff3413.js');
10
+ const _package = require('./package-fc932371.js');
10
11
  const Handler = require('./Handler-de64afa5.js');
11
12
  const index$2 = require('./index-d33baba2.js');
12
13
 
@@ -510,68 +511,6 @@ const VviinnProductCard = class {
510
511
  };
511
512
  VviinnProductCard.style = vviinnProductCardCss;
512
513
 
513
- const createBearerString = (x) => `Bearer ${x}`;
514
- const createAuthedHeader = (x) => new Headers({
515
- Authorization: x,
516
- });
517
- const createFetchAuthOptions = (x) => {
518
- return {
519
- headers: x,
520
- };
521
- };
522
- const createBearAuthedHeader = imageSearch_store._function.flow(createBearerString, createAuthedHeader, createFetchAuthOptions);
523
-
524
- const sequenceToEither = sequenceT(imageSearch_store.Apply);
525
- const apiGet = (path, data = {}) => Handler.pipe(sequenceToEither(imageSearch_store.getApiPath(), imageSearch_store.createInitGetRequest), imageSearch_store.fromEither, imageSearch_store.chainW(imageSearch_store.makeRequest(path, data)));
526
-
527
- const getVPRRecommendations = (productId) => (color) => (excludedFilters) => (campaigns) => (options) => {
528
- const url = imageSearch_store._function.pipe(campaigns, imageSearch_store.map(encodeURIComponent), imageSearch_store.match(() => {
529
- const params = [];
530
- if (color)
531
- params.push(`color=${color}`);
532
- if (excludedFilters)
533
- params.push(excludedFilters);
534
- const queryString = imageSearch_store.arrayToQueryString(params);
535
- return `product/${productId}/similar-products${queryString}`;
536
- }, (encodedCampaignsIds) => {
537
- const params = [];
538
- if (encodedCampaignsIds)
539
- params.push(`campaigns=${encodedCampaignsIds}`);
540
- if (color)
541
- params.push(`color=${color}`);
542
- if (excludedFilters)
543
- params.push(excludedFilters);
544
- const queryString = imageSearch_store.arrayToQueryString(params);
545
- return `product/${productId}/similar-products${queryString}`;
546
- }));
547
- return apiGet(url, options);
548
- };
549
-
550
- const getVCSRecommendations = (productId) => (color) => (excludedFilters) => (campaigns) => (options) => {
551
- const url = imageSearch_store._function.pipe(campaigns, imageSearch_store.map(encodeURIComponent), imageSearch_store.match(() => {
552
- const params = [];
553
- if (color)
554
- params.push(`color=${color}`);
555
- if (excludedFilters)
556
- params.push(excludedFilters);
557
- const queryString = imageSearch_store.arrayToQueryString(params);
558
- return `product/${productId}/cross-selling-products${queryString}`;
559
- }, (encodedCampaignsIds) => {
560
- const params = [];
561
- if (encodedCampaignsIds)
562
- params.push(`campaigns=${encodedCampaignsIds}`);
563
- if (color)
564
- params.push(`color=${color}`);
565
- if (excludedFilters)
566
- params.push(excludedFilters);
567
- const queryString = imageSearch_store.arrayToQueryString(params);
568
- return `product/${productId}/cross-selling-products${queryString}`;
569
- }));
570
- return apiGet(url, options);
571
- };
572
-
573
- const getRecommendationsService = (campaignType) => imageSearch_store._function.pipe(Campaign.fromString(campaignType), Campaign.fold(() => getVPRRecommendations, () => getVCSRecommendations));
574
-
575
514
  function isFunction(value) {
576
515
  return typeof value === 'function';
577
516
  }
@@ -1180,6 +1119,81 @@ class AnonymousSubject extends Subject {
1180
1119
  }
1181
1120
  }
1182
1121
 
1122
+ const createBearerString = (x) => `Bearer ${x}`;
1123
+ const createAuthedHeader = (x) => new Headers({
1124
+ Authorization: x,
1125
+ });
1126
+ const createFetchAuthOptions = (x) => {
1127
+ return {
1128
+ headers: x,
1129
+ };
1130
+ };
1131
+ const createBearAuthedHeader = imageSearch_store._function.flow(createBearerString, createAuthedHeader, createFetchAuthOptions);
1132
+
1133
+ const sequenceToEither = sequenceT(imageSearch_store.Apply);
1134
+ const apiGet = (path, data = {}) => Handler.pipe(sequenceToEither(imageSearch_store.getApiPath(), imageSearch_store.createInitGetRequest), imageSearch_store.fromEither, imageSearch_store.chainW(imageSearch_store.makeRequest(path, data)));
1135
+
1136
+ const getVPRRecommendations = (productId) => (color) => (excludedFilters) => (campaigns) => (options) => {
1137
+ const url = imageSearch_store._function.pipe(campaigns, imageSearch_store.map(encodeURIComponent), imageSearch_store.match(() => {
1138
+ const params = [];
1139
+ if (color)
1140
+ params.push(`color=${color}`);
1141
+ if (excludedFilters)
1142
+ params.push(excludedFilters);
1143
+ const queryString = imageSearch_store.arrayToQueryString(params);
1144
+ return `product/${productId}/similar-products${queryString}`;
1145
+ }, (encodedCampaignsIds) => {
1146
+ const params = [];
1147
+ if (encodedCampaignsIds)
1148
+ params.push(`campaigns=${encodedCampaignsIds}`);
1149
+ if (color)
1150
+ params.push(`color=${color}`);
1151
+ if (excludedFilters)
1152
+ params.push(excludedFilters);
1153
+ const queryString = imageSearch_store.arrayToQueryString(params);
1154
+ return `product/${productId}/similar-products${queryString}`;
1155
+ }));
1156
+ return apiGet(url, options);
1157
+ };
1158
+
1159
+ const getVCSRecommendations = (productId) => (color) => (excludedFilters) => (campaigns) => (options) => {
1160
+ const url = imageSearch_store._function.pipe(campaigns, imageSearch_store.map(encodeURIComponent), imageSearch_store.match(() => {
1161
+ const params = [];
1162
+ if (color)
1163
+ params.push(`color=${color}`);
1164
+ if (excludedFilters)
1165
+ params.push(excludedFilters);
1166
+ const queryString = imageSearch_store.arrayToQueryString(params);
1167
+ return `product/${productId}/cross-selling-products${queryString}`;
1168
+ }, (encodedCampaignsIds) => {
1169
+ const params = [];
1170
+ if (encodedCampaignsIds)
1171
+ params.push(`campaigns=${encodedCampaignsIds}`);
1172
+ if (color)
1173
+ params.push(`color=${color}`);
1174
+ if (excludedFilters)
1175
+ params.push(excludedFilters);
1176
+ const queryString = imageSearch_store.arrayToQueryString(params);
1177
+ return `product/${productId}/cross-selling-products${queryString}`;
1178
+ }));
1179
+ return apiGet(url, options);
1180
+ };
1181
+
1182
+ const getRecommendationsService = (campaignType) => imageSearch_store._function.pipe(Campaign.fromString(campaignType), Campaign.fold(() => getVPRRecommendations, () => getVCSRecommendations));
1183
+
1184
+ const resources = {
1185
+ de: {
1186
+ translation: {
1187
+ noResultText: "Keine Ergebnisse! Versuche es bitte später erneut.",
1188
+ },
1189
+ },
1190
+ en: {
1191
+ translation: {
1192
+ noResultText: "No results! Please, try again later.",
1193
+ },
1194
+ },
1195
+ };
1196
+
1183
1197
  const vviinnVprWidgetCss = ":host{display:grid;grid-gap:1rem;width:100%}:host(:not(.loaded)){position:absolute;visibility:hidden}:host(.grid) vviinn-product-card::part(image){border:1px solid #dddddd;width:100%}h2{margin:0}vviinn-product-card::part(price-container){align-self:flex-start;text-align:left;display:flex}.results{display:grid;grid-gap:1rem}.no-result-text{font-size:20px}.visually-hidden{position:absolute;top:0;left:0;z-index:-1;height:0;width:0}h2{margin:0}:host(.grid) h2{justify-content:center}:host(.grid) vviinn-product-card::part(image){min-width:100%}:host(.grid) vviinn-product-card::part(image-link){width:100%}:host(.grid) vviinn-product-card::part(title),:host(.grid) vviinn-product-card::part(brand),:host(.grid) vviinn-product-card::part(type){text-align:center}:host(.grid) vviinn-product-card::part(price-container){align-self:center}:host(.continuity) vviinn-product-card::part(title),:host(.continuity) vviinn-product-card::part(brand),:host(.continuity) vviinn-product-card::part(type),:host(.continuity) vviinn-product-card::part(deeplink){text-align:left;max-width:unset;align-self:start}";
1184
1198
 
1185
1199
  var __rest = (undefined && undefined.__rest) || function (s, e) {
@@ -1223,7 +1237,7 @@ const VviinnVprWidget = class {
1223
1237
  this.campaigns = "";
1224
1238
  this.color = "";
1225
1239
  this.gridArrowsDynamic = false;
1226
- this.noResultText = "No results! Please, try again later.";
1240
+ this.noResultText = "";
1227
1241
  this.noResultShow = true;
1228
1242
  this.showScroll = true;
1229
1243
  this.cssUrl = null;
@@ -1314,6 +1328,11 @@ const VviinnVprWidget = class {
1314
1328
  this.trackingApi
1315
1329
  .trackEvent(widgetOpenEvent)
1316
1330
  .then(this.setTrackingDeactivated);
1331
+ i18next.instance.init({
1332
+ lng: this.locale,
1333
+ fallbackLng: "de-DE",
1334
+ resources,
1335
+ });
1317
1336
  }
1318
1337
  disconnectedCallback() {
1319
1338
  if (this.trackingDeactivated)
@@ -1377,7 +1396,9 @@ const VviinnVprWidget = class {
1377
1396
  empty: this.recommendations.length == 0,
1378
1397
  [this.mode]: true,
1379
1398
  }, "aria-hidden": "false" }, index.h(index.Fragment, null, this.renderExternalCSS(), index.h("style", null, imageSearch_store.state.fallbackStyles), index.h("h2", { part: "recommendations-title" }, this.blockTitle), this.recommendations.length > 0 &&
1380
- (this.useCarousel ? this.renderCarousel() : this.renderResults()), this.recommendations.length === 0 && this.hasErrorOnLoad && (index.h("p", { class: "no-result-text" }, this.noResultText)))));
1399
+ (this.useCarousel ? this.renderCarousel() : this.renderResults()), this.recommendations.length === 0 && this.hasErrorOnLoad && (index.h("p", { class: "no-result-text" }, this.noResultText.length
1400
+ ? this.noResultText
1401
+ : i18next.instance.t("noResultText"))))));
1381
1402
  }
1382
1403
  renderRecommendation(recommendation, index$1) {
1383
1404
  return (index.h("vviinn-product-card", { part: "product-part", productId: recommendation.productId, productTitle: recommendation.title, productType: recommendation.productType, deeplink: recommendation.deeplink, image: recommendation.image.thumbnail, brand: recommendation.brand, imageWidth: this.imageWidth, imageRatio: 1, price: recommendation.price.actual, salePrice: recommendation.price.sale, responsive: this.mode === "grid", dimmedBackground: this.useDimmedBackgroundInCard(), campaignTypeId: this.campaignType, index: index$1, widgetElementId: this.id, widgetVersion: _package.version }));
@@ -22,6 +22,7 @@ const RecommendationsSidebar = class {
22
22
  this.campaigns = "";
23
23
  this.campaignType = undefined;
24
24
  this.color = undefined;
25
+ this.locale = undefined;
25
26
  this.imageWidth = 300;
26
27
  this.currencySign = "€";
27
28
  this.noResultText = undefined;
@@ -60,7 +61,7 @@ const RecommendationsSidebar = class {
60
61
  return (_a = this.el.shadowRoot.querySelector("aside")) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
61
62
  }
62
63
  render() {
63
- return (index.h(index.Host, { class: this.getClassMap() }, index.h("aside", { class: "sidebar", part: "body", onAnimationEnd: (e) => this.handleAnimationEnd(e) }, index.h("header", { class: { "contains-source-img": this.isSourceImageValid() }, part: "sidebar-header" }, this.isSourceImageValid() ? this.renderSourceImage() : null, index.h("span", { class: "title", part: "title" }, this.sidebarTitle), index.h("button", { class: "close-sidebar", onClick: () => (this.state = "closed") }, index.h(index$1.CrossIcon, null))), index.h("main", { part: "sidebar-content" }, index.h("vviinn-vpr-widget", { exportparts: "brand, currency, deeplink, image, image-link, price-amount, price-container, price-prefix, price-outdated, price-regular, price-sale, title: product-title, carousel-button, product-card, items-group", token: this.token, productId: this.productId, imageWidth: this.imageWidth, blockTitle: "", mode: this.mode, useCarousel: this.position === "bottom", onVviinnRecommendationsLoaded: () => (this.state = "open"), showScroll: this.widgetScrollbar, campaigns: this.campaigns, color: this.color, currencySign: this.currencySign, apiPath: this.apiPath, buttonElementId: this.buttonElementId, noResultText: this.noResultText, noResultShow: this.noResultShow, gridArrowsDynamic: this.gridArrowsDynamic, showingInButton: this.showingInButton, excluded: this.excluded, productDetailNewTab: this.productDetailNewTab })))));
64
+ return (index.h(index.Host, { class: this.getClassMap() }, index.h("aside", { class: "sidebar", part: "body", onAnimationEnd: (e) => this.handleAnimationEnd(e) }, index.h("header", { class: { "contains-source-img": this.isSourceImageValid() }, part: "sidebar-header" }, this.isSourceImageValid() ? this.renderSourceImage() : null, index.h("span", { class: "title", part: "title" }, this.sidebarTitle), index.h("button", { class: "close-sidebar", onClick: () => (this.state = "closed") }, index.h(index$1.CrossIcon, null))), index.h("main", { part: "sidebar-content" }, index.h("vviinn-vpr-widget", { exportparts: "brand, currency, deeplink, image, image-link, price-amount, price-container, price-prefix, price-outdated, price-regular, price-sale, title: product-title, carousel-button, product-card, items-group", token: this.token, productId: this.productId, imageWidth: this.imageWidth, blockTitle: "", mode: this.mode, useCarousel: this.position === "bottom", onVviinnRecommendationsLoaded: () => (this.state = "open"), showScroll: this.widgetScrollbar, campaigns: this.campaigns, color: this.color, currencySign: this.currencySign, apiPath: this.apiPath, locale: this.locale, buttonElementId: this.buttonElementId, noResultText: this.noResultText, noResultShow: this.noResultShow, gridArrowsDynamic: this.gridArrowsDynamic, showingInButton: this.showingInButton, excluded: this.excluded, productDetailNewTab: this.productDetailNewTab })))));
64
65
  }
65
66
  renderSourceImage() {
66
67
  return (index.h("img", { class: "source-image", part: "source-image", src: this.sourceImage }));
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a4becaff.js');
6
- const _package = require('./package-1c24894e.js');
6
+ const _package = require('./package-fc932371.js');
7
7
  const index$1 = require('./index-6cfe5293.js');
8
8
 
9
9
  const vviinnVprButtonCss = ":host{display:block}";
@@ -30,12 +30,13 @@ const VviinnVprButton = class {
30
30
  this.modalScrollbar = false;
31
31
  this.campaigns = "";
32
32
  this.campaignType = "VPR";
33
+ this.locale = "de-DE";
33
34
  this.color = "";
34
35
  this.addStyle = true;
35
36
  this.mode = "continuity";
36
37
  this.imageWidth = 300;
37
38
  this.currencySign = "€";
38
- this.noResultText = "No results! Please, try again later.";
39
+ this.noResultText = "";
39
40
  this.noResultShow = true;
40
41
  this.gridArrowsDynamic = false;
41
42
  this.excluded = "";
@@ -58,6 +59,7 @@ const VviinnVprButton = class {
58
59
  sidebar.campaigns = this.campaigns;
59
60
  sidebar.campaignType = this.campaignType;
60
61
  sidebar.color = this.color;
62
+ sidebar.locale = this.locale;
61
63
  sidebar.mode = this.position === "right" ? "grid" : this.mode;
62
64
  sidebar.imageWidth = this.imageWidth;
63
65
  sidebar.currencySign = this.currencySign;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a4becaff.js');
6
- const _package = require('./package-1c24894e.js');
6
+ const _package = require('./package-fc932371.js');
7
7
  const index$1 = require('./index-6cfe5293.js');
8
8
  const customizedSlots = require('./customized-slots-aee3f39d.js');
9
9
  const Campaign = require('./Campaign-778b5b2c.js');
@@ -3,13 +3,75 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a4becaff.js');
6
- const _package = require('./package-1c24894e.js');
7
6
  const imageSearch_store = require('./imageSearch.store-967326bd.js');
7
+ const i18next = require('./i18next-74ff3413.js');
8
+ const _package = require('./package-fc932371.js');
8
9
  const customizedSlots = require('./customized-slots-aee3f39d.js');
9
10
  const index$1 = require('./index-d33baba2.js');
10
11
  const Campaign = require('./Campaign-778b5b2c.js');
11
12
  require('./Handler-de64afa5.js');
12
13
 
14
+ const resources = {
15
+ "de-DE": {
16
+ translation: {
17
+ exampleImagesTitle: "Mit den Beispielbildern die Suche direkt ausprobieren",
18
+ imageUploadButtonText: "Kamera oder Bild auswählen",
19
+ privacyBadgeText: "Durch das Hochladen eines Bildes willigst Du in die Verarbeitung durch unseren Partner Vviinn ein. Das Bild wird nach einer Stunde Inaktivität gelöscht.",
20
+ teaserText_1: "Finde Produkte auf",
21
+ teaserText_2: "einem Foto",
22
+ imageSearchModalTitle: "Bildsuche",
23
+ onboardingBlock: {
24
+ onboardingTitleText: "So funktioniert es",
25
+ onboardingCard1: {
26
+ title: "Starte die Bildsuche",
27
+ text: "Lade ein Bild aus Deiner Galerie hoch oder fotografiere ein Produkt mit Deiner Kamera.",
28
+ },
29
+ onboardingCard2: {
30
+ title: "Verfeiner Deine Suche",
31
+ text: "Du kannst den Bildrahmen selber festlegen und so die Produkte genau auswählen.",
32
+ },
33
+ onboardingCard3: {
34
+ title: "Ohne Hintergrund",
35
+ text: "Die besten Ergebnisse erhältst Du, wenn das gesuchte Objekt mit einfarbigem und hellem Hintergrund zu sehen ist.",
36
+ },
37
+ },
38
+ emptyResultsBlock: {
39
+ title: "Leider nichts gefunden",
40
+ text: "Leider konnten wir keine passenden Produkte finden. Bitte versuche es mit einem anderen Bildausschnitt noch einmal.",
41
+ },
42
+ },
43
+ },
44
+ en: {
45
+ translation: {
46
+ exampleImagesTitle: "Try out the search with the example images",
47
+ imageUploadButtonText: "Select camera or image",
48
+ privacyBadgeText: "By uploading a picture you agree to the processing by our partner Vviinn. The image will be deleted after one hour of inactivity.",
49
+ teaserText_1: "Find products in a photo",
50
+ teaserText_2: "",
51
+ imageSearchModalTitle: "Visual Search",
52
+ onboardingBlock: {
53
+ onboardingTitleText: "This is how it works",
54
+ onboardingCard1: {
55
+ title: "Start the Visual Search",
56
+ text: "Upload a picture from your gallery or take a picture of a product with your camera.",
57
+ },
58
+ onboardingCard2: {
59
+ title: "Refine Your Search",
60
+ text: "You can set the frame yourself, so you can choose exactly what you want.",
61
+ },
62
+ onboardingCard3: {
63
+ title: "Without Background",
64
+ text: "For best results, display the object you are looking for against a monochrome, light background.",
65
+ },
66
+ },
67
+ emptyResultsBlock: {
68
+ title: "Sorry, nothing was found",
69
+ text: "Sorry, we could not find any matching products. Please try again by selecting a different area of the image.",
70
+ },
71
+ },
72
+ },
73
+ };
74
+
13
75
  const vviinnVpsWidgetCss = ":host{--color-primary-system:#0F62FE;--color-primary-hover-system:#014CDA;--color-icons-system:#2F8EDF;--spacer:8px}:host{display:block}.hidden{visibility:hidden;height:1px}vviinn-overlayed-modal.first-screen::part(title),vviinn-overlayed-modal.first-screen::part(secondary-action){visibility:hidden}.start-page{display:grid;grid-template-columns:repeat(2, 1fr);min-height:580px}.start-page_block{align-content:start;border-right:1px solid #f4f4f4;display:grid;padding:48px}.start-page_block.error{align-content:center}#onboarding-block{border-right:unset;box-sizing:border-box;grid-gap:24px;overflow-y:auto;position:relative;width:100%}vviinn-teaser{margin-bottom:32px;margin-top:-24px}vviinn-image-selector{align-items:center;background:var(--color-primary, var(--color-primary-system));border-color:var(--color-primary, var(--color-primary-system));border-radius:2px;color:white;display:grid;font-size:16px;font-weight:600;height:56px;justify-items:center;margin-bottom:16px;transition:background 0.1s ease-in-out}vviinn-image-selector:hover{background:var(--color-primary-hover, var(--color-primary-hover-system));border-color:var(--color-primary-hover, var(--color-primary-hover-system))}vviinn-image-selector:active{border-color:black}.upload-button-content{display:grid;align-items:center;justify-items:start;justify-content:center;grid-template-columns:max-content auto;grid-gap:16px}.results-page{display:grid;grid-template-columns:336px auto;box-sizing:border-box}.results-page>*{padding:24px;box-sizing:border-box}.products{align-content:center;align-items:start;box-sizing:border-box;display:grid;grid-gap:32px 16px;grid-template-columns:repeat(auto-fill, minmax(152px, 1fr));justify-items:center;padding:24px;padding-right:0;position:absolute;width:calc(100% - 16px)}.products.hidden{display:none}vviinn-empty-results{width:280px;align-self:center;justify-self:center}.products-wrapper{display:grid;overflow-y:auto;overflow-x:hidden;padding:unset;position:relative;width:100%}.image-wrapper{border-right:1px solid #f4f4f4;display:grid;grid-template-rows:min-content 1fr;grid-gap:24px;min-width:100%}.onboarding-wrapper{position:absolute;width:100%;padding:48px;box-sizing:border-box;display:grid;grid-gap:64px;padding-bottom:24px}vviinn-product-card{gap:0;width:100%}vviinn-product-card::part(image){border:1px solid #eaeaea;margin-bottom:8px}vviinn-product-card::part(price-container),vviinn-product-card::part(deeplink),vviinn-product-card::part(title){align-self:start}search-filters span{display:none}search-filters::part(filter){background:#f4f4f4;border-radius:8px;box-sizing:border-box;color:#161616;margin-bottom:4px;font-size:14px;font-weight:400;line-height:20px}search-filters:first-child::part(show-more-filters){display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid #f4f4f4;min-width:40px;height:40px;border-radius:100px;box-sizing:border-box;color:#161616}search-filters::part(show-more-filters):hover{background:#eaeaea}search-filters::part(filter active){background:var(--color-primary, var(--color-primary-system));color:white}.filters-wrapper{overflow-x:auto;transform:translateX(-24px);min-width:calc(100% + 48px)}@media (max-width: 640px){.filters-wrapper{min-width:calc(100% + 40px)}}.results-page:not(.active){display:none}.nothing-found{display:grid;grid-gap:64px;justify-self:center;padding-top:64px;padding-bottom:16px;position:absolute;width:60%}@media (max-width: 768px){.start-page_block{padding:24px}.onboarding-wrapper{padding:24px}}@media (max-width: 640px){.start-page{grid-template-rows:min-content;grid-template-columns:unset;grid-gap:48px;padding:24px 0 48px 0}}@media (max-width: 640px){.results-page>*{box-sizing:border-box;padding:24px}vviinn-slide{padding-bottom:48px}.start-page_block:last-of-type{border-right:unset;overflow-y:unset;position:static;box-sizing:border-box;width:unset}.start-page_block{padding:0 24px}vviinn-teaser{margin-top:24px}.onboarding-wrapper{position:static;width:unset;padding:unset;box-sizing:border-box}.results-page{grid-template-columns:unset;grid-template-rows:min-content auto}.image{margin-bottom:8px}.image-wrapper{grid-template-rows:min-content auto;width:100%}.products-wrapper{align-content:start;position:static;overflow-y:unset;width:100%;padding-top:0}.products{position:static;padding:0;width:unset;grid-gap:32px 16px;justify-content:center}.nothing-found{position:static;grid-gap:64px;padding:unset;align-content:start;width:unset}}@media (max-width: 320px){.products{grid-template-columns:unset}}vviinn-wrong-format,vviinn-server-error{width:280px;align-self:center;justify-self:center}";
14
76
 
15
77
  var __rest = (undefined && undefined.__rest) || function (s, e) {
@@ -177,6 +239,11 @@ const VviinnVpsWidget = class {
177
239
  this.uiSessionId = index$1.v4();
178
240
  this.trackingApi = index$1.createTrackingApi(this.apiPath, this.token);
179
241
  this.id = this.el.id;
242
+ i18next.instance.init({
243
+ lng: this.locale,
244
+ fallbackLng: "de-DE",
245
+ resources,
246
+ });
180
247
  }
181
248
  componentWillLoad() {
182
249
  customizedSlots.slotChangeListener(this, this.el);
@@ -263,7 +330,7 @@ const VviinnVpsWidget = class {
263
330
  }
264
331
  }, onVviinnNoResult: () => (this.wrongImageFormat = true), resetVpsButton: this.resetVpsButton, basicEventData: this.getBasicEventData(), part: "select-image_button", startUpload: this.buttonPressed &&
265
332
  this.showingInButton &&
266
- this.mode === "upload" }, index.h("span", { slot: "upload-button-text", class: "upload-button-content" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "29", height: "28", fill: "none" }, index.h("defs", null), index.h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M10.271 3.89A.875.875 0 0111 3.5h7c.293 0 .566.146.728.39l1.49 2.235h3.033a2.625 2.625 0 012.625 2.625V21a2.625 2.625 0 01-2.625 2.625H5.75A2.625 2.625 0 013.125 21V8.75A2.625 2.625 0 015.75 6.125h3.031l1.49-2.235zm1.197 1.36l-1.49 2.235a.875.875 0 01-.729.39H5.75a.875.875 0 00-.875.875V21a.875.875 0 00.875.875h17.5a.875.875 0 00.875-.875V8.75a.875.875 0 00-.875-.875h-3.5a.875.875 0 01-.729-.39l-1.49-2.235h-6.063z", "clip-rule": "evenodd" }), index.h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M14.5 11.375a3.062 3.062 0 100 6.125 3.062 3.062 0 000-6.125zm-4.813 3.063a4.812 4.812 0 119.625 0 4.812 4.812 0 01-9.625 0z", "clip-rule": "evenodd" })), index.h("slot", { name: "vviinn-image-upload-button-text" }, index.h("span", null, "Kamera oder Bild ausw\u00E4hlen")))), index.h("vviinn-privacy-badge", { class: { hidden: this.haveErrors() } })), index.h("div", { id: "onboarding-block", class: "start-page_block" }, index.h("div", { class: "onboarding-wrapper" }, index.h("vviinn-onboarding", null), index.h("vviinn-example-images", { part: "example-images", onVviinnImageUpload: () => this.handleImageSelection("example"), onVviinnNoResult: () => this.resetScroll("onboarding-block", "smooth"), basicEventData: this.getBasicEventData() })))), index.h("vviinn-slide", { class: { "results-page": true, active: this.slidePosition == 1 } }, index.h("div", { class: "image-wrapper" }, index.h("vviinn-image-view", { basicEventData: this.getBasicEventData() }), index.h("div", { class: "filters-wrapper" }, index.h("div", { class: "filters" }, imageSearch_store.imageSearchState.filters.map((filter) => (index.h("search-filters", { filter: filter, basicEventData: this.getBasicEventData() })))))), index.h("div", { id: "results-block", class: "products-wrapper" }, index.h("div", { class: {
333
+ this.mode === "upload" }, index.h("span", { slot: "upload-button-text", class: "upload-button-content" }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "29", height: "28", fill: "none" }, index.h("defs", null), index.h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M10.271 3.89A.875.875 0 0111 3.5h7c.293 0 .566.146.728.39l1.49 2.235h3.033a2.625 2.625 0 012.625 2.625V21a2.625 2.625 0 01-2.625 2.625H5.75A2.625 2.625 0 013.125 21V8.75A2.625 2.625 0 015.75 6.125h3.031l1.49-2.235zm1.197 1.36l-1.49 2.235a.875.875 0 01-.729.39H5.75a.875.875 0 00-.875.875V21a.875.875 0 00.875.875h17.5a.875.875 0 00.875-.875V8.75a.875.875 0 00-.875-.875h-3.5a.875.875 0 01-.729-.39l-1.49-2.235h-6.063z", "clip-rule": "evenodd" }), index.h("path", { fill: "#fff", "fill-rule": "evenodd", d: "M14.5 11.375a3.062 3.062 0 100 6.125 3.062 3.062 0 000-6.125zm-4.813 3.063a4.812 4.812 0 119.625 0 4.812 4.812 0 01-9.625 0z", "clip-rule": "evenodd" })), index.h("slot", { name: "vviinn-image-upload-button-text" }, index.h("span", null, i18next.instance.t("imageUploadButtonText"))))), index.h("vviinn-privacy-badge", { class: { hidden: this.haveErrors() }, privacyBadgeText: i18next.instance.t("privacyBadgeText") })), index.h("div", { id: "onboarding-block", class: "start-page_block" }, index.h("div", { class: "onboarding-wrapper" }, index.h("vviinn-onboarding", null), index.h("vviinn-example-images", { part: "example-images", exampleImagesTitle: i18next.instance.t("exampleImagesTitle"), onVviinnImageUpload: () => this.handleImageSelection("example"), onVviinnNoResult: () => this.resetScroll("onboarding-block", "smooth"), basicEventData: this.getBasicEventData() })))), index.h("vviinn-slide", { class: { "results-page": true, active: this.slidePosition == 1 } }, index.h("div", { class: "image-wrapper" }, index.h("vviinn-image-view", { basicEventData: this.getBasicEventData() }), index.h("div", { class: "filters-wrapper" }, index.h("div", { class: "filters" }, imageSearch_store.imageSearchState.filters.map((filter) => (index.h("search-filters", { filter: filter, basicEventData: this.getBasicEventData() })))))), index.h("div", { id: "results-block", class: "products-wrapper" }, index.h("div", { class: {
267
334
  "nothing-found": true,
268
335
  hidden: imageSearch_store.imageSearchState.results.length > 0,
269
336
  } }, index.h("vviinn-empty-results", null), index.h("vviinn-onboarding", null)), index.h("div", { class: {
@@ -20,7 +20,7 @@ const patchBrowser = () => {
20
20
  };
21
21
 
22
22
  patchBrowser().then(options => {
23
- return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["cropper-handler.cjs",[[1,"cropper-handler",{"handler":[16],"disabled":[4]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-carousel_3.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32]},[[0,"vviinnProductLoad","handleProductLoading"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32]}],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"imageLoaded":[32]}]]],["highlight-box_22.cjs",[[1,"vviinn-image-view",{"basicEventData":[16]}],[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16]}],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge"],[1,"vviinn-teaser"],[1,"image-cropper",{"disabled":[4],"basicEventData":[16],"handleMove":[32]}],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[1,"highlight-box"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"slider":[32]}],[1,"vviinn-onboarding-card-1"],[1,"vviinn-onboarding-card-2"],[1,"vviinn-onboarding-card-3"],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32]},[[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"]}]]]], options);
23
+ return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["cropper-handler.cjs",[[1,"cropper-handler",{"handler":[16],"disabled":[4]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-carousel_3.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32]},[[0,"vviinnProductLoad","handleProductLoading"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[16],"widgetVersion":[1,"widget-version"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32]}],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"imageLoaded":[32]}]]],["highlight-box_22.cjs",[[1,"vviinn-image-view",{"basicEventData":[16]}],[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16],"exampleImagesTitle":[1,"example-images-title"]}],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-teaser"],[1,"image-cropper",{"disabled":[4],"basicEventData":[16],"handleMove":[32]}],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[1,"highlight-box"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"slider":[32]}],[1,"vviinn-onboarding-card-1",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-2",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-3",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32]},[[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"apiPath":[1,"api-path"]}]]]], options);
24
24
  });
25
25
 
26
26
  exports.setNonce = index.setNonce;
@@ -1,7 +1,8 @@
1
1
  import { Host, h } from "@stencil/core";
2
+ import i18next from "i18next";
2
3
  export class VviinnEmptyResults {
3
4
  render() {
4
- return (h(Host, null, h("vviinn-error", null, h("svg", { slot: "icon", class: "icon", width: "32", height: "32", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M16 2a14 14 0 1 0 0 28 14 14 0 0 0 0-28Zm0 26a12 12 0 1 1 0-24 12 12 0 0 1 0 24Z", fill: "#525252" }), h("path", { d: "M17 8h-2v11h2V8Zm-1 14a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z", fill: "#525252" })), h("h4", { slot: "title" }, "Leider nichts gefunden"), h("span", { slot: "text" }, "Leider konnten wir keine passenden Produkte finden. Bitte versuche es mit einem anderen Bildausschnitt noch einmal."))));
5
+ return (h(Host, null, h("vviinn-error", null, h("svg", { slot: "icon", class: "icon", width: "32", height: "32", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M16 2a14 14 0 1 0 0 28 14 14 0 0 0 0-28Zm0 26a12 12 0 1 1 0-24 12 12 0 0 1 0 24Z", fill: "#525252" }), h("path", { d: "M17 8h-2v11h2V8Zm-1 14a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z", fill: "#525252" })), h("h4", { slot: "title" }, i18next.t("emptyResultsBlock.title")), h("span", { slot: "text" }, i18next.t("emptyResultsBlock.text")))));
5
6
  }
6
7
  static get is() { return "vviinn-empty-results"; }
7
8
  static get encapsulation() { return "shadow"; }
@@ -3,6 +3,7 @@ import { slotChangeListener } from "../customized-slots";
3
3
  export class VviinnExampleImages {
4
4
  constructor() {
5
5
  this.basicEventData = undefined;
6
+ this.exampleImagesTitle = undefined;
6
7
  }
7
8
  componentWillLoad() {
8
9
  slotChangeListener(this, this.el);
@@ -13,7 +14,7 @@ export class VviinnExampleImages {
13
14
  firstExampleImage.focus();
14
15
  }
15
16
  render() {
16
- return (h(Host, { onFocus: () => this.delegateFocus() }, h("slot", { name: "vviinn-example-images-title" }, h("h3", null, "Mit den Beispielbildern die Suche direkt ausprobieren")), h("div", { class: "images", ref: (el) => (this.imagesBlock = el) }, h("slot", { name: "vviinn-example-images-1" }, h("vviinn-example-image", { width: 480, height: 640, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDEtTC5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-2" }, h("vviinn-example-image", { width: 280, height: 480, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDItTS5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-3" }, h("vviinn-example-image", { width: 280, height: 480, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDMtTS5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-4" }, h("vviinn-example-image", { width: 480, height: 640, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDQtTC5qcGc=", basicEventData: this.basicEventData })))));
17
+ return (h(Host, { onFocus: () => this.delegateFocus() }, h("slot", { name: "vviinn-example-images-title" }, h("h3", null, this.exampleImagesTitle)), h("div", { class: "images", ref: (el) => (this.imagesBlock = el) }, h("slot", { name: "vviinn-example-images-1" }, h("vviinn-example-image", { width: 480, height: 640, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDEtTC5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-2" }, h("vviinn-example-image", { width: 280, height: 480, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDItTS5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-3" }, h("vviinn-example-image", { width: 280, height: 480, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDMtTS5qcGc=", basicEventData: this.basicEventData })), h("slot", { name: "vviinn-example-images-4" }, h("vviinn-example-image", { width: 480, height: 640, src: "https://cdn.vviinn.com/0/fit/480/0/ce/0/Z3M6Ly9haWFhcy1pbWdwcm94eS9leGFtcGxlcy9pbWctaW5zcGlyYXRpb24tMDQtTC5qcGc=", basicEventData: this.basicEventData })))));
17
18
  }
18
19
  static get is() { return "vviinn-example-images"; }
19
20
  static get encapsulation() { return "shadow"; }
@@ -48,6 +49,23 @@ export class VviinnExampleImages {
48
49
  "tags": [],
49
50
  "text": ""
50
51
  }
52
+ },
53
+ "exampleImagesTitle": {
54
+ "type": "string",
55
+ "mutable": false,
56
+ "complexType": {
57
+ "original": "string",
58
+ "resolved": "string",
59
+ "references": {}
60
+ },
61
+ "required": false,
62
+ "optional": false,
63
+ "docs": {
64
+ "tags": [],
65
+ "text": ""
66
+ },
67
+ "attribute": "example-images-title",
68
+ "reflect": false
51
69
  }
52
70
  };
53
71
  }
@@ -26,19 +26,32 @@
26
26
  }
27
27
 
28
28
  .head {
29
+ display: flex;
29
30
  align-items: center;
30
31
  border-bottom: 1px solid #f4f4f4;
31
- display: flex;
32
32
  padding: 16px;
33
33
  }
34
34
 
35
35
  .title {
36
+ display: flex;
37
+ align-items: center;
38
+ transform: translateX(-6px);
36
39
  font-weight: 600;
37
40
  font-size: 18px;
38
41
  line-height: 24px;
39
42
  margin: 0 auto;
40
43
  }
41
44
 
45
+ .title-image {
46
+ border-radius: 50%;
47
+ border: 1px solid rgb(244, 244, 244);
48
+ -o-object-fit: cover;
49
+ object-fit: cover;
50
+ -o-object-position: center;
51
+ object-position: center;
52
+ margin-right: 8px;
53
+ }
54
+
42
55
  button {
43
56
  -webkit-appearance: none;
44
57
  -moz-appearance: none;
@@ -47,7 +60,12 @@ button {
47
60
  border: none;
48
61
  cursor: pointer;
49
62
  display: grid;
50
- padding: unset;
63
+ padding: 4px;
64
+ color: #c6c6c6;
65
+ }
66
+
67
+ button:hover {
68
+ color: #000;
51
69
  }
52
70
 
53
71
  @keyframes fade-in {
@@ -1,6 +1,11 @@
1
1
  import { Host, h, } from "@stencil/core";
2
+ import i18next from "i18next";
2
3
  import { slotChangeListener } from "../customized-slots";
3
4
  import { campaignTypeNames } from "../../campaign/Campaign";
5
+ import { imageSearchState } from "../../store/imageSearch.store";
6
+ import * as O from "fp-ts/lib/Option";
7
+ import { pipe } from "fp-ts/lib/function";
8
+ import { sequenceToOption } from "../../utils/option/option";
4
9
  export class VviinnModal {
5
10
  constructor() {
6
11
  this.active = false;
@@ -30,8 +35,14 @@ export class VviinnModal {
30
35
  return;
31
36
  this.slider = true;
32
37
  }
38
+ renderImage() {
39
+ return pipe(sequenceToOption(imageSearchState.imageUrl, imageSearchState.image), O.map(([url]) => {
40
+ const image = (h("img", { width: "32", height: "32", src: url, class: "title-image" }));
41
+ return image;
42
+ }), O.getOrElse(() => null));
43
+ }
33
44
  render() {
34
- return (h(Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, h("div", { class: "head" }, !this.hideBackButton && (h("button", { part: "secondary-action", onClick: () => this.resetState() }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M20.25 12H3.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "#161616", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { class: "title", part: "title" }, h("slot", { name: "vviinn-image-search-modal-title" }, "Bildsuche")), h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z", fill: "#333333" })))), h("div", { class: "body" }, h("slot", null))));
45
+ return (h(Host, { exportparts: "secondary-action, title, close-button", class: { closed: !this.active }, onAnimationEnd: (ev) => this.handleAnimationEnd(ev) }, h("div", { class: "head" }, !this.hideBackButton && (h("button", { part: "secondary-action", onClick: () => this.resetState() }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M20.25 12H3.75", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { d: "M10.5 5.25L3.75 12L10.5 18.75", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { class: "title", part: "title" }, this.renderImage(), h("slot", { name: "vviinn-image-search-modal-title" }, i18next.t("imageSearchModalTitle"))), h("button", { onClick: () => this.close(), class: "close-button", part: "close-button" }, h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z", fill: "currentColor" })))), h("div", { class: "body" }, h("slot", null))));
35
46
  }
36
47
  static get is() { return "vviinn-modal"; }
37
48
  static get encapsulation() { return "shadow"; }