vviinn-widgets 2.74.0 → 2.74.2

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

@@ -20,7 +20,7 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy(JSON.parse("[[\"vviinn-button.cjs\",[[1,\"vviinn-button\",{\"addStyle\":[4,\"add-style\"]}]]],[\"vviinn-preloader.cjs\",[[1,\"vviinn-preloader\"]]],[\"vviinn-error.cjs\",[[1,\"vviinn-error\"]]],[\"vviinn-carousel_8.cjs\",[[1,\"vviinn-vpr-widget\",{\"token\":[1],\"productId\":[1,\"product-id\"],\"mode\":[1],\"campaigns\":[1],\"excluded\":[1],\"campaignType\":[1,\"campaign-type\"],\"locale\":[1],\"color\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"showExtendedFilters\":[4,\"show-extended-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"blockTitle\":[1,\"block-title\"],\"showScroll\":[4,\"show-scroll\"],\"apiPath\":[1,\"api-path\"],\"useCarousel\":[4,\"use-carousel\"],\"showingInButton\":[4,\"showing-in-button\"],\"buttonElementId\":[1,\"button-element-id\"],\"closed\":[4],\"opened\":[4],\"recommendations\":[32],\"dynamicFilters\":[32],\"sourceProduct\":[32],\"trackingDeactivated\":[32],\"hasErrorOnLoad\":[32],\"updatingAllCards\":[32],\"updatedCardsAmount\":[32],\"setModeDiscountsArray\":[32]},[[0,\"vviinnProductLoad\",\"trackProductLoad\"],[0,\"vviinnProductView\",\"trackProductView\"],[0,\"vviinnProductClick\",\"trackProductClick\"],[0,\"vviinnAuxClick\",\"trackAuxClick\"],[0,\"vviinnAddToBasket\",\"trackAddToBasket\"],[0,\"vviinnUpdatingAllCardsFinished\",\"updatingAllCardsFinishedListener\"],[0,\"vviinnFiltersChanged\",\"filtersChanged\"]]],[0,\"vviinn-carousel\",{\"mode\":[1],\"imageWidth\":[2,\"image-width\"],\"showScroll\":[4,\"show-scroll\"],\"campaignTypeId\":[1,\"campaign-type-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"recommendations\":[1040],\"widgetVersion\":[1,\"widget-version\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"updatingAllCards\":[4,\"updating-all-cards\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"replaceSlotsContent\":[16],\"setModeDiscountsArray\":[16],\"imageRatio\":[2,\"image-ratio\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"locale\":[1],\"moveDirection\":[32],\"contentGroups\":[32],\"activeContentGroup\":[32],\"isRTL\":[32],\"crossSellingRecommendations\":[32],\"setModeDiscount\":[32],\"currentDiscountIndex\":[32],\"setModeAppliedDiscounts\":[32]},[[0,\"vviinnCrossSellingClick\",\"crossSellingClickListener\"],[0,\"vviinnAddToBasket\",\"trackAddToBasket\"]]],[1,\"vviinn-extended-filters\",{\"filters\":[1040],\"filtersString\":[1,\"filters-string\"],\"locale\":[1],\"requestFilters\":[32],\"showMore\":[32],\"selectedMoreOptions\":[32]}],[1,\"vviinn-filters\",{\"filters\":[1040],\"filtersString\":[1,\"filters-string\"],\"selectedFilter\":[32],\"requestFilters\":[32]}],[1,\"vviinn-price-range\",{\"histogram\":[16],\"addStyle\":[4,\"add-style\"],\"priceChangeHandler\":[16],\"minIndex\":[32],\"maxIndex\":[32],\"scalingFactor\":[32]}],[1,\"vviinn-product-card\",{\"brand\":[1],\"currency\":[1],\"image\":[1],\"imageRatio\":[2,\"image-ratio\"],\"imageWidth\":[2,\"image-width\"],\"locale\":[1],\"price\":[2],\"pricePrefix\":[1,\"price-prefix\"],\"productTitle\":[1,\"product-title\"],\"productType\":[1,\"product-type\"],\"salePrice\":[2,\"sale-price\"],\"responsive\":[4],\"dimmedBackground\":[4,\"dimmed-background\"],\"mode\":[1],\"basketButtonShow\":[4,\"basket-button-show\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"energyEfficiencyClass\":[1,\"energy-efficiency-class\"],\"productId\":[1,\"product-id\"],\"campaignTypeId\":[1,\"campaign-type-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"deeplink\":[1],\"index\":[2],\"updatingAllCards\":[4,\"updating-all-cards\"],\"defaultAnimationInterval\":[2,\"default-animation-interval\"],\"minEnergyEfficiencyClass\":[1,\"min-energy-efficiency-class\"],\"maxEnergyEfficiencyClass\":[1,\"max-energy-efficiency-class\"],\"appliedDiscountPercentage\":[2,\"applied-discount-percentage\"],\"currentDiscountPercentage\":[2,\"current-discount-percentage\"],\"isSourceProduct\":[4,\"is-source-product\"],\"isTransitioning\":[32],\"basketButonPressed\":[32]},[[0,\"vviinnCrossSellingClick\",\"crossSellingClickListener\"]]],[1,\"vviinn-energy-label\",{\"energyEfficiencyClass\":[1,\"energy-efficiency-class\"],\"minEnergyEfficiencyClass\":[1,\"min-energy-efficiency-class\"],\"maxEnergyEfficiencyClass\":[1,\"max-energy-efficiency-class\"],\"productType\":[1,\"product-type\"]}],[1,\"vviinn-skeleton\",{\"height\":[2],\"halfWidth\":[4,\"half-width\"]}]]],[\"search-filters_18.cjs\",[[1,\"vviinn-results\",{\"token\":[1],\"searchId\":[1,\"search-id\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"currencySign\":[1,\"currency-sign\"],\"locale\":[8],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"textSearchQuery\":[1,\"text-search-query\"],\"filterColumn\":[1,\"filter-column\"],\"filterValue\":[1,\"filter-value\"],\"resultsCount\":[2,\"results-count\"],\"showingInWidget\":[4,\"showing-in-widget\"],\"uiSessionId\":[1025,\"ui-session-id\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"apiPath\":[1,\"api-path\"],\"showAspectRatioError\":[4,\"show-aspect-ratio-error\"],\"trackingDeactivated\":[1028,\"tracking-deactivated\"],\"resetState\":[16],\"recommendations\":[32],\"innerTextSearchQuery\":[32]},[[0,\"vviinnProductLoad\",\"trackProductLoad\"],[0,\"vviinnProductView\",\"trackProductView\"],[0,\"vviinnProductClick\",\"trackProductClick\"],[0,\"vviinnAuxClick\",\"trackAuxClick\"]]],[1,\"vviinn-image-view\",{\"basicEventData\":[16],\"setShowAspectRatioError\":[16],\"showAspectRatioError\":[4,\"show-aspect-ratio-error\"],\"cropper\":[32],\"hidePreloader\":[32]},[[0,\"vviinnSelectObject\",\"selectDetectedObject\"]]],[1,\"vviinn-overlayed-modal\",{\"active\":[4],\"resetState\":[16],\"buttonElementId\":[1,\"button-element-id\"],\"hideBackButton\":[4,\"hide-back-button\"],\"widgetVersion\":[1,\"widget-version\"],\"isFirstScreen\":[4,\"is-first-screen\"]}],[1,\"vviinn-text-search\",{\"token\":[1],\"locale\":[1],\"mode\":[1],\"apiPath\":[1,\"api-path\"],\"showInWidget\":[4,\"show-in-widget\"],\"searchQuery\":[1025,\"search-query\"]},[[0,\"vviinnImageUploadFinished\",\"imageUploadFinished\"]]],[1,\"vviinn-server-error\",{\"handler\":[16]}],[1,\"vviinn-wrong-format\",{\"handler\":[16]}],[1,\"search-filters\",{\"filter\":[16],\"textSearchFiltersGroup\":[16],\"basicEventData\":[16],\"selectedFilter\":[32],\"hideFilters\":[32]}],[1,\"vviinn-example-image\",{\"exampleImageSource\":[1,\"example-image-source\"],\"width\":[2],\"height\":[2],\"basicEventData\":[16],\"srcObject\":[16],\"cameraButtonClicked\":[4,\"camera-button-clicked\"],\"selected\":[32],\"videoInitialized\":[32],\"zoomCapabilities\":[32]}],[1,\"vviinn-privacy-badge\",{\"privacyBadgeText\":[1,\"privacy-badge-text\"]}],[1,\"vviinn-slide\"],[1,\"vviinn-slider\",{\"showBullets\":[4,\"show-bullets\"],\"position\":[514],\"showArrows\":[4,\"show-arrows\"],\"elementsCount\":[32],\"internalPosition\":[32],\"swipeStartPosition\":[32],\"isRTL\":[32]}],[1,\"vviinn-teaser\"],[1,\"vviinn-empty-results\",{\"handler\":[16]}],[1,\"vviinn-image-selector\",{\"basicEventData\":[16],\"startUpload\":[4,\"start-upload\"],\"loading\":[4],\"accept\":[1],\"resetVpsButton\":[16],\"token\":[1],\"apiPath\":[1,\"api-path\"],\"showInTextSearch\":[4,\"show-in-text-search\"]}],[1,\"vviinn-wrong-aspect-ratio\",{\"handler\":[16]}],[1,\"vviinn-detected-object\",{\"detectedObject\":[16],\"basicEventData\":[16],\"position\":[32]}],[1,\"vviinn-modal\",{\"active\":[1540],\"resetState\":[16],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"hideBackButton\":[4,\"hide-back-button\"],\"isFirstScreen\":[4,\"is-first-screen\"],\"slider\":[32]}],[1,\"vviinn-overlay\"]]],[\"vviinn-vps-widget.cjs\",[[1,\"vviinn-vps-widget\",{\"token\":[1],\"active\":[1028],\"currencySign\":[1,\"currency-sign\"],\"locale\":[1],\"campaignId\":[1,\"campaign-id\"],\"excluded\":[1],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"exampleImageSource\":[1,\"example-image-source\"],\"textSearchShow\":[4,\"text-search-show\"],\"apiPath\":[1,\"api-path\"],\"showingInButton\":[4,\"showing-in-button\"],\"buttonElementId\":[1,\"button-element-id\"],\"buttonPressed\":[4,\"button-pressed\"],\"mode\":[1],\"resetVpsButton\":[16],\"slidePosition\":[32],\"width\":[32],\"wrongImageFormat\":[32],\"trackingDeactivated\":[32],\"stream\":[32],\"cameraInitializing\":[32],\"cameraEnabled\":[32],\"cameraButtonClicked\":[32],\"uploadSource\":[32],\"showAspectRatioError\":[32],\"products\":[32],\"searchQuery\":[32]},[[0,\"vviinnTextSearchFinished\",\"textSearchFinishedHandler\"],[0,\"vviinnResultLoad\",\"resultLoadHandler\"],[0,\"vviinnResultView\",\"resultViewHandler\"],[0,\"vviinnCameraEnabled\",\"trackCameraEnabled\"],[0,\"vviinnImageCrop\",\"trachSearchAreaChanges\"],[0,\"vviinnSelectObject\",\"trackDetectedObject\"],[0,\"vviinnSelectFilter\",\"trackFilter\"],[0,\"vviinnTextSearchFilterSelected\",\"trackTextSearchFilterSelected\"]]]]],[\"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],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"exampleImageSource\":[1,\"example-image-source\"],\"textSearchShow\":[4,\"text-search-show\"],\"apiPath\":[1,\"api-path\"],\"buttonPressed\":[32]},[[0,\"vviinnWidgetClose\",\"handleModalClosed\"]]]]],[\"vviinn-recommendations-sidebar.cjs\",[[1,\"vviinn-recommendations-sidebar\",{\"sidebarTitle\":[1,\"sidebar-title\"],\"token\":[1],\"productId\":[1,\"product-id\"],\"position\":[1],\"sourceImage\":[1,\"source-image\"],\"widgetScrollbar\":[4,\"widget-scrollbar\"],\"mode\":[1],\"campaigns\":[1],\"campaignType\":[1,\"campaign-type\"],\"color\":[1],\"locale\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"excluded\":[1],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"buttonChildren\":[16],\"apiPath\":[1,\"api-path\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"showingInButton\":[4,\"showing-in-button\"],\"state\":[32]},[[0,\"vviinnUpdatingAllCardsStarted\",\"updatingAllCardsStarted\"],[0,\"vviinnUpdatingAllCardsFinished\",\"updatingAllCardsFinished\"],[16,\"click\",\"bodyClickListener\"]]]]],[\"vviinn-vpr-button.cjs\",[[1,\"vviinn-vpr-button\",{\"token\":[1],\"productId\":[1,\"product-id\"],\"mode\":[1],\"campaigns\":[1],\"excluded\":[1],\"campaignType\":[1,\"campaign-type\"],\"locale\":[1],\"color\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"sidebarTitle\":[1,\"sidebar-title\"],\"modalScrollbar\":[4,\"modal-scrollbar\"],\"position\":[1],\"sourceImage\":[1,\"source-image\"],\"addStyle\":[4,\"add-style\"],\"apiPath\":[1,\"api-path\"]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"vviinn-button.cjs\",[[1,\"vviinn-button\",{\"addStyle\":[4,\"add-style\"]}]]],[\"vviinn-preloader.cjs\",[[1,\"vviinn-preloader\"]]],[\"vviinn-error.cjs\",[[1,\"vviinn-error\"]]],[\"vviinn-carousel_8.cjs\",[[1,\"vviinn-vpr-widget\",{\"token\":[1],\"productId\":[1,\"product-id\"],\"mode\":[1],\"campaigns\":[1],\"excluded\":[1],\"campaignType\":[1,\"campaign-type\"],\"locale\":[1],\"color\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"showExtendedFilters\":[4,\"show-extended-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"blockTitle\":[1,\"block-title\"],\"showScroll\":[4,\"show-scroll\"],\"apiPath\":[1,\"api-path\"],\"useCarousel\":[4,\"use-carousel\"],\"showingInButton\":[4,\"showing-in-button\"],\"buttonElementId\":[1,\"button-element-id\"],\"closed\":[4],\"opened\":[4],\"recommendations\":[32],\"dynamicFilters\":[32],\"sourceProduct\":[32],\"trackingDeactivated\":[32],\"hasErrorOnLoad\":[32],\"updatingAllCards\":[32],\"updatedCardsAmount\":[32],\"setModeDiscountsArray\":[32]},[[0,\"vviinnProductLoad\",\"trackProductLoad\"],[0,\"vviinnProductView\",\"trackProductView\"],[0,\"vviinnProductClick\",\"trackProductClick\"],[0,\"vviinnAuxClick\",\"trackAuxClick\"],[0,\"vviinnAddToBasket\",\"trackAddToBasket\"],[0,\"vviinnUpdatingAllCardsFinished\",\"updatingAllCardsFinishedListener\"],[0,\"vviinnFiltersChanged\",\"filtersChanged\"]]],[0,\"vviinn-carousel\",{\"mode\":[1],\"imageWidth\":[2,\"image-width\"],\"showScroll\":[4,\"show-scroll\"],\"campaignTypeId\":[1,\"campaign-type-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"recommendations\":[1040],\"widgetVersion\":[1,\"widget-version\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"updatingAllCards\":[4,\"updating-all-cards\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"replaceSlotsContent\":[16],\"setModeDiscountsArray\":[16],\"imageRatio\":[2,\"image-ratio\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"locale\":[1],\"moveDirection\":[32],\"contentGroups\":[32],\"activeContentGroup\":[32],\"isRTL\":[32],\"crossSellingRecommendations\":[32],\"setModeDiscount\":[32],\"currentDiscountIndex\":[32],\"setModeAppliedDiscounts\":[32]},[[0,\"vviinnCrossSellingClick\",\"crossSellingClickListener\"],[0,\"vviinnAddToBasket\",\"trackAddToBasket\"]]],[1,\"vviinn-extended-filters\",{\"filters\":[1040],\"filtersString\":[1,\"filters-string\"],\"locale\":[1],\"requestFilters\":[32],\"showMore\":[32],\"selectedMoreOptions\":[32]}],[1,\"vviinn-filters\",{\"filters\":[1040],\"filtersString\":[1,\"filters-string\"],\"selectedFilter\":[32],\"requestFilters\":[32]}],[1,\"vviinn-price-range\",{\"histogram\":[16],\"addStyle\":[4,\"add-style\"],\"priceChangeHandler\":[16],\"selectedInterval\":[16],\"minIndex\":[32],\"maxIndex\":[32],\"scalingFactor\":[32]}],[1,\"vviinn-product-card\",{\"brand\":[1],\"currency\":[1],\"image\":[1],\"imageRatio\":[2,\"image-ratio\"],\"imageWidth\":[2,\"image-width\"],\"locale\":[1],\"price\":[2],\"pricePrefix\":[1,\"price-prefix\"],\"productTitle\":[1,\"product-title\"],\"productType\":[1,\"product-type\"],\"salePrice\":[2,\"sale-price\"],\"responsive\":[4],\"dimmedBackground\":[4,\"dimmed-background\"],\"mode\":[1],\"basketButtonShow\":[4,\"basket-button-show\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"energyEfficiencyClass\":[1,\"energy-efficiency-class\"],\"productId\":[1,\"product-id\"],\"campaignTypeId\":[1,\"campaign-type-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"deeplink\":[1],\"index\":[2],\"updatingAllCards\":[4,\"updating-all-cards\"],\"defaultAnimationInterval\":[2,\"default-animation-interval\"],\"minEnergyEfficiencyClass\":[1,\"min-energy-efficiency-class\"],\"maxEnergyEfficiencyClass\":[1,\"max-energy-efficiency-class\"],\"appliedDiscountPercentage\":[2,\"applied-discount-percentage\"],\"currentDiscountPercentage\":[2,\"current-discount-percentage\"],\"isSourceProduct\":[4,\"is-source-product\"],\"isTransitioning\":[32],\"basketButonPressed\":[32]},[[0,\"vviinnCrossSellingClick\",\"crossSellingClickListener\"]]],[1,\"vviinn-energy-label\",{\"energyEfficiencyClass\":[1,\"energy-efficiency-class\"],\"minEnergyEfficiencyClass\":[1,\"min-energy-efficiency-class\"],\"maxEnergyEfficiencyClass\":[1,\"max-energy-efficiency-class\"],\"productType\":[1,\"product-type\"]}],[1,\"vviinn-skeleton\",{\"height\":[2],\"halfWidth\":[4,\"half-width\"]}]]],[\"search-filters_18.cjs\",[[1,\"vviinn-results\",{\"token\":[1],\"searchId\":[1,\"search-id\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"currencySign\":[1,\"currency-sign\"],\"locale\":[8],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"textSearchQuery\":[1,\"text-search-query\"],\"filterColumn\":[1,\"filter-column\"],\"filterValue\":[1,\"filter-value\"],\"resultsCount\":[2,\"results-count\"],\"showingInWidget\":[4,\"showing-in-widget\"],\"uiSessionId\":[1025,\"ui-session-id\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetElementId\":[1,\"widget-element-id\"],\"apiPath\":[1,\"api-path\"],\"showAspectRatioError\":[4,\"show-aspect-ratio-error\"],\"trackingDeactivated\":[1028,\"tracking-deactivated\"],\"resetState\":[16],\"recommendations\":[32],\"innerTextSearchQuery\":[32]},[[0,\"vviinnProductLoad\",\"trackProductLoad\"],[0,\"vviinnProductView\",\"trackProductView\"],[0,\"vviinnProductClick\",\"trackProductClick\"],[0,\"vviinnAuxClick\",\"trackAuxClick\"]]],[1,\"vviinn-image-view\",{\"basicEventData\":[16],\"setShowAspectRatioError\":[16],\"showAspectRatioError\":[4,\"show-aspect-ratio-error\"],\"cropper\":[32],\"hidePreloader\":[32]},[[0,\"vviinnSelectObject\",\"selectDetectedObject\"]]],[1,\"vviinn-overlayed-modal\",{\"active\":[4],\"resetState\":[16],\"buttonElementId\":[1,\"button-element-id\"],\"hideBackButton\":[4,\"hide-back-button\"],\"widgetVersion\":[1,\"widget-version\"],\"isFirstScreen\":[4,\"is-first-screen\"]}],[1,\"vviinn-text-search\",{\"token\":[1],\"locale\":[1],\"mode\":[1],\"apiPath\":[1,\"api-path\"],\"showInWidget\":[4,\"show-in-widget\"],\"searchQuery\":[1025,\"search-query\"]},[[0,\"vviinnImageUploadFinished\",\"imageUploadFinished\"]]],[1,\"vviinn-server-error\",{\"handler\":[16]}],[1,\"vviinn-wrong-format\",{\"handler\":[16]}],[1,\"search-filters\",{\"filter\":[16],\"textSearchFiltersGroup\":[16],\"basicEventData\":[16],\"selectedFilter\":[32],\"hideFilters\":[32]}],[1,\"vviinn-example-image\",{\"exampleImageSource\":[1,\"example-image-source\"],\"width\":[2],\"height\":[2],\"basicEventData\":[16],\"srcObject\":[16],\"cameraButtonClicked\":[4,\"camera-button-clicked\"],\"selected\":[32],\"videoInitialized\":[32],\"zoomCapabilities\":[32]}],[1,\"vviinn-privacy-badge\",{\"privacyBadgeText\":[1,\"privacy-badge-text\"]}],[1,\"vviinn-slide\"],[1,\"vviinn-slider\",{\"showBullets\":[4,\"show-bullets\"],\"position\":[514],\"showArrows\":[4,\"show-arrows\"],\"elementsCount\":[32],\"internalPosition\":[32],\"swipeStartPosition\":[32],\"isRTL\":[32]}],[1,\"vviinn-teaser\"],[1,\"vviinn-empty-results\",{\"handler\":[16]}],[1,\"vviinn-image-selector\",{\"basicEventData\":[16],\"startUpload\":[4,\"start-upload\"],\"loading\":[4],\"accept\":[1],\"resetVpsButton\":[16],\"token\":[1],\"apiPath\":[1,\"api-path\"],\"showInTextSearch\":[4,\"show-in-text-search\"]}],[1,\"vviinn-wrong-aspect-ratio\",{\"handler\":[16]}],[1,\"vviinn-detected-object\",{\"detectedObject\":[16],\"basicEventData\":[16],\"position\":[32]}],[1,\"vviinn-modal\",{\"active\":[1540],\"resetState\":[16],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"hideBackButton\":[4,\"hide-back-button\"],\"isFirstScreen\":[4,\"is-first-screen\"],\"slider\":[32]}],[1,\"vviinn-overlay\"]]],[\"vviinn-vps-widget.cjs\",[[1,\"vviinn-vps-widget\",{\"token\":[1],\"active\":[1028],\"currencySign\":[1,\"currency-sign\"],\"locale\":[1],\"campaignId\":[1,\"campaign-id\"],\"excluded\":[1],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"exampleImageSource\":[1,\"example-image-source\"],\"textSearchShow\":[4,\"text-search-show\"],\"apiPath\":[1,\"api-path\"],\"showingInButton\":[4,\"showing-in-button\"],\"buttonElementId\":[1,\"button-element-id\"],\"buttonPressed\":[4,\"button-pressed\"],\"mode\":[1],\"resetVpsButton\":[16],\"slidePosition\":[32],\"width\":[32],\"wrongImageFormat\":[32],\"trackingDeactivated\":[32],\"stream\":[32],\"cameraInitializing\":[32],\"cameraEnabled\":[32],\"cameraButtonClicked\":[32],\"uploadSource\":[32],\"showAspectRatioError\":[32],\"products\":[32],\"searchQuery\":[32]},[[0,\"vviinnTextSearchFinished\",\"textSearchFinishedHandler\"],[0,\"vviinnResultLoad\",\"resultLoadHandler\"],[0,\"vviinnResultView\",\"resultViewHandler\"],[0,\"vviinnCameraEnabled\",\"trackCameraEnabled\"],[0,\"vviinnImageCrop\",\"trachSearchAreaChanges\"],[0,\"vviinnSelectObject\",\"trackDetectedObject\"],[0,\"vviinnSelectFilter\",\"trackFilter\"],[0,\"vviinnTextSearchFilterSelected\",\"trackTextSearchFilterSelected\"]]]]],[\"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],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"imageResolutionWidth\":[2,\"image-resolution-width\"],\"exampleImageSource\":[1,\"example-image-source\"],\"textSearchShow\":[4,\"text-search-show\"],\"apiPath\":[1,\"api-path\"],\"buttonPressed\":[32]},[[0,\"vviinnWidgetClose\",\"handleModalClosed\"]]]]],[\"vviinn-recommendations-sidebar.cjs\",[[1,\"vviinn-recommendations-sidebar\",{\"sidebarTitle\":[1,\"sidebar-title\"],\"token\":[1],\"productId\":[1,\"product-id\"],\"position\":[1],\"sourceImage\":[1,\"source-image\"],\"widgetScrollbar\":[4,\"widget-scrollbar\"],\"mode\":[1],\"campaigns\":[1],\"campaignType\":[1,\"campaign-type\"],\"color\":[1],\"locale\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"excluded\":[1],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"buttonChildren\":[16],\"apiPath\":[1,\"api-path\"],\"buttonElementId\":[1,\"button-element-id\"],\"widgetVersion\":[1,\"widget-version\"],\"showingInButton\":[4,\"showing-in-button\"],\"state\":[32]},[[0,\"vviinnUpdatingAllCardsStarted\",\"updatingAllCardsStarted\"],[0,\"vviinnUpdatingAllCardsFinished\",\"updatingAllCardsFinished\"],[16,\"click\",\"bodyClickListener\"]]]]],[\"vviinn-vpr-button.cjs\",[[1,\"vviinn-vpr-button\",{\"token\":[1],\"productId\":[1,\"product-id\"],\"mode\":[1],\"campaigns\":[1],\"excluded\":[1],\"campaignType\":[1,\"campaign-type\"],\"locale\":[1],\"color\":[1],\"imageWidth\":[2,\"image-width\"],\"imageRatio\":[2,\"image-ratio\"],\"cssUrl\":[1,\"css-url\"],\"currencySign\":[1,\"currency-sign\"],\"pricePrefix\":[1,\"price-prefix\"],\"noResultText\":[1,\"no-result-text\"],\"noResultShow\":[4,\"no-result-show\"],\"gridArrowsDynamic\":[4,\"grid-arrows-dynamic\"],\"productDetailsNewTab\":[4,\"product-details-new-tab\"],\"productDetailsRedirect\":[4,\"product-details-redirect\"],\"addToBasketShow\":[4,\"add-to-basket-show\"],\"showFilters\":[4,\"show-filters\"],\"setModeDiscounts\":[1,\"set-mode-discounts\"],\"updateButtonLocation\":[1,\"update-button-location\"],\"sidebarTitle\":[1,\"sidebar-title\"],\"modalScrollbar\":[4,\"modal-scrollbar\"],\"position\":[1],\"sourceImage\":[1,\"source-image\"],\"addStyle\":[4,\"add-style\"],\"apiPath\":[1,\"api-path\"]}]]]]"), options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/vviinn-filters/stories/args.js

@@ -2,7 +2,4 @@ export const argTypes = {
   filters: {
     control: false,
   },
-  filtersString: {
-    control: false,
-  },
 };

package/dist/collection/components/vviinn-filters/stories/constants.js

@@ -1,53 +1,71 @@
 export const filters = [
   {
-    column: "brand",
-    label: "Brand",
-    values: [
-      {
-        value: "MAGMA",
-        label: "MAGMA",
-        selected: false,
-      },
-      {
-        value: "WENKO",
-        label: "WENKO",
-        selected: false,
-      },
-    ],
-  },
-  {
-    column: "color",
+    column: "color_confirmed",
     label: "Color",
+    isPrimary: true,
     values: [
       {
-        value: "",
-        label: "",
-        selected: false,
-      },
-      {
-        value: "",
-        label: "",
+        value: {
+          value: "beige > #C7B3A8",
+          name: "beige",
+          hexCode: "#C7B3A8",
+          rgb: {
+            red: 199,
+            green: 179,
+            blue: 168,
+          },
+          family: "beige",
+        },
+        label: "Beige",
+        active: true,
         selected: false,
       },
       {
-        value: "",
-        label: "",
+        value: {
+          value: "blue > #339BCD",
+          name: "blue",
+          hexCode: "#339BCD",
+          rgb: {
+            red: 51,
+            green: 155,
+            blue: 205,
+          },
+          family: "blue",
+        },
+        label: "Blue",
+        active: true,
         selected: false,
       },
-    ],
-  },
-  {
-    column: "google_product_category",
-    label: "Category",
-    values: [
       {
-        value: "SGVpbSAm",
-        label: "Kopfkissen",
+        value: {
+          value: "blue > #A4CCE5",
+          name: "blue",
+          hexCode: "#A4CCE5",
+          rgb: {
+            red: 164,
+            green: 204,
+            blue: 229,
+          },
+          family: "blue",
+        },
+        label: "Blue",
+        active: true,
         selected: false,
       },
       {
-        value: "TcO2YmVs",
-        label: "Möbel",
+        value: {
+          value: "brown > #483526",
+          name: "brown",
+          hexCode: "#483526",
+          rgb: {
+            red: 72,
+            green: 53,
+            blue: 38,
+          },
+          family: "brown",
+        },
+        label: "Brown",
+        active: true,
         selected: false,
       },
     ],
@@ -55,52 +73,208 @@ export const filters = [
   {
     column: "price",
     label: "Price",
+    isPrimary: true,
     full: {
-      start: 3,
-      end: 25,
+      start: 0,
+      end: 49,
     },
+    selectedValues: [],
     suggestions: [
       {
         value: {
-          frequency: 0.2222222238779068,
+          frequency: 0.2083333283662796,
+          interval: {
+            start: 0,
+            end: 3,
+          },
+        },
+        label: "[0-3)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.1822916716337204,
           interval: {
             start: 3,
+            end: 5,
+          },
+        },
+        label: "[3-5)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.1927083283662796,
+          interval: {
+            start: 5,
+            end: 7,
+          },
+        },
+        label: "[5-7)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.4166666567325592,
+          interval: {
+            start: 7,
+            end: 49,
+          },
+        },
+        label: "[7-49)",
+        active: true,
+      },
+    ],
+    histogram: [
+      {
+        value: {
+          frequency: 0.1347150206565857,
+          interval: {
+            start: 0,
+            end: 1,
+          },
+        },
+        label: "[0-1)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.07253886014223099,
+          interval: {
+            start: 1,
+            end: 2,
+          },
+        },
+        label: "[1-2)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0,
+          interval: {
+            start: 2,
+            end: 3,
+          },
+        },
+        label: "[2-3)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.062176164239645004,
+          interval: {
+            start: 3,
+            end: 4,
+          },
+        },
+        label: "[3-4)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.11917098611593246,
+          interval: {
+            start: 4,
+            end: 5,
+          },
+        },
+        label: "[4-5)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.0984455943107605,
+          interval: {
+            start: 5,
+            end: 6,
+          },
+        },
+        label: "[5-6)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.09326425194740295,
+          interval: {
+            start: 6,
+            end: 7,
+          },
+        },
+        label: "[6-7)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.33678755164146423,
+          interval: {
+            start: 7,
+            end: 8,
+          },
+        },
+        label: "[7-8)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.02590673603117466,
+          interval: {
+            start: 8,
             end: 9,
           },
         },
-        label: "[3-9)",
-        selected: false,
+        label: "[8-9)",
+        active: true,
       },
       {
         value: {
-          frequency: 0.2698412835597992,
+          frequency: 0.031088082119822502,
           interval: {
-            start: 9,
-            end: 11,
+            start: 19,
+            end: 20,
           },
         },
-        label: "[9-11)",
-        selected: false,
+        label: "[19-20)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0,
+          interval: {
+            start: 20,
+            end: 21,
+          },
+        },
+        label: "[20-21)",
+        active: true,
+      },
+      {
+        value: {
+          frequency: 0.020725388079881668,
+          interval: {
+            start: 48,
+            end: 49,
+          },
+        },
+        label: "[48-49)",
+        active: true,
       },
     ],
   },
   {
     column: "product_type",
     label: "Category",
+    isPrimary: true,
     values: [
       {
-        value: "LaXNzZW4",
-        label: "Gefüllte Kissen",
-        selected: false,
-      },
-      {
-        value: "LaXNzZW4g",
-        label: "Kissenhüllen",
+        value: "Y2VsZWJyYXRlPlRlc3QgQnVja2V0",
+        label: "Test Bucket",
+        active: true,
         selected: false,
       },
       {
-        value: "RpbGllbj",
-        label: "Badematten",
+        value: "Y2VsZWJyYXRlPkhvY2h6ZWl0c2VpbmxhZHVuZ2Vu",
+        label: "Hochzeitseinladungen",
+        active: true,
         selected: false,
       },
     ],

package/dist/collection/components/vviinn-filters/vviinn-extended-filters.js

@@ -5,6 +5,10 @@ import i18next from "i18next";
 import { resources } from "../../locale";
 import { SlotSkeleton, slotChangeListener } from "../customized-slots";
 /**
+ * @slot vviinn-extended-filters-title - Text on widget's header.
+ * @slot vviinn-extended-filters-apply - Title of Apply Button.
+ * @slot vviinn-extended-filters-reset - Title of Reset Button.
+ *
  * @part filters - Wrapper itself.
  */
 export class VviinnExtendedFilters {
@@ -115,12 +119,13 @@ export class VviinnExtendedFilters {
       } }, h(NewCloseIcon, null))), h("ul", { class: "filters-modal-list" }, this.filters
       .filter((filter) => filter.column !== "color")
       .map((mainFilter) => {
+      var _a, _b;
       const column = mainFilter.column;
       const filterOptions = getFilterOptions(mainFilter);
       return (h("li", null, h("button", { onClick: () => this.handleMoreOptionsMainClick(mainFilter.column), class: "filters-modal-main-button" }, mainFilter.label, filterOptions.length > 0
         ? ` (${filterOptions.length})`
         : ""), column === "price" &&
-        this.selectedMoreOptions.includes(mainFilter.column) ? (h("vviinn-price-range", { histogram: filterOptions, priceChangeHandler: this.priceChangeHandler })) : (h("ul", { class: `filters-modal-sub-list ${column === "color_confirmed"
+        this.selectedMoreOptions.includes(mainFilter.column) ? (h("vviinn-price-range", { histogram: filterOptions, priceChangeHandler: this.priceChangeHandler, selectedInterval: ((_b = (_a = this.requestFilters.find((f) => f.column === "price")) === null || _a === void 0 ? void 0 : _a.values[0]) !== null && _b !== void 0 ? _b : {}) })) : (h("ul", { class: `filters-modal-sub-list ${column === "color_confirmed"
           ? "filters-modal-sub-list-inline"
           : ""} ${this.selectedMoreOptions.includes(mainFilter.column)
           ? "open"
@@ -177,7 +182,10 @@ export class VviinnExtendedFilters {
         "required": false,
         "optional": false,
         "docs": {
-          "tags": [],
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
           "text": ""
         },
         "attribute": "filters-string",

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

@@ -19,7 +19,6 @@
   --gray-100: #161616;
   --gray-10: #f4f4f4;
   --gray-70: #525252;
-
   --radius-radius-md: 8px;
   --button-color-button-primary: #000;
   --text-color-text-inverse: #fff;
@@ -28,11 +27,10 @@
   --text-color-text-disabled: rgba(22, 22, 22, 0.25);
   --surface-color-surface-accent: #e0e0e0;
   --border-color-border-02: #c6c6c6;
-
   --surface-color-surface-active: #161616;
   --surface-color-surface-inactive: #e0e0e0;
-
   --stroke-color-stroke-01: #f4f4f4;
+  --chip-color-badge-primary: #161616;
 
   /* New Styles */
   --font-family-base: Inter, system-ui, sans-serif;

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

@@ -15,6 +15,9 @@ export class VviinnFilters {
     };
     this.handleSetFilters = ({ detail, }) => {
       this.filters = detail;
+      if (!detail.some(({ column }) => { var _a; return column === ((_a = this.selectedFilter) === null || _a === void 0 ? void 0 : _a.column); })) {
+        this.selectedFilter = undefined;
+      }
     };
     this.handleFiltersChanged = ({ detail, }) => {
       const { filters, el: senderElement } = detail;
@@ -77,7 +80,7 @@ export class VviinnFilters {
     document.removeEventListener("vviinnFiltersChanged", this.handleFiltersChanged);
   }
   render() {
-    var _a;
+    var _a, _b, _c;
     const { column } = (_a = this.selectedFilter) !== null && _a !== void 0 ? _a : {};
     const selectedFilterOptions = getFilterOptions(this.selectedFilter);
     const filters = this.filters.filter((filter) => filter.isPrimary && filter.column !== "color");
@@ -85,7 +88,7 @@ export class VviinnFilters {
       return h(Host, null);
     return (h(Host, { part: "filters" }, h("div", { class: "main-filters-wrapper" }, h("ul", { class: "main-filters-list" }, filters.map((filter) => {
       return (h("li", null, h("button", { class: `filters-main-button ${this.showActiveOnMainButton(filter)}`, onClick: () => this.handleMainFilterSelection(filter) }, filter.label)));
-    }))), this.selectedFilter !== undefined && (h("div", { class: "filters-footer" }, column === "price" ? (h("vviinn-price-range", { histogram: selectedFilterOptions, priceChangeHandler: this.priceChangeHandler })) : (h("ul", { class: "sub-filters-wrapper" }, selectedFilterOptions &&
+    }))), this.selectedFilter !== undefined && (h("div", { class: "filters-footer" }, column === "price" ? (h("vviinn-price-range", { histogram: selectedFilterOptions, priceChangeHandler: this.priceChangeHandler, selectedInterval: ((_c = (_b = this.requestFilters.find((f) => f.column === "price")) === null || _b === void 0 ? void 0 : _b.values[0]) !== null && _c !== void 0 ? _c : {}) })) : (h("ul", { class: "sub-filters-wrapper" }, selectedFilterOptions &&
       selectedFilterOptions.map(({ value, label, active }) => {
         const hexCode = value.hexCode;
         return (h("li", null, h("button", { onClick: () => this.handleSubFilterSelection(value, this.selectedFilter), class: `filters-sub-button ${hexCode ? "filters-sub-button-color" : ""} ${this.showActiveOnSubButton(this.requestFilters, value)}`, style: { backgroundColor: hexCode }, disabled: !active }, h("span", null, label))));
@@ -137,7 +140,10 @@ export class VviinnFilters {
         "required": false,
         "optional": false,
         "docs": {
-          "tags": [],
+          "tags": [{
+              "name": "internal",
+              "text": undefined
+            }],
           "text": ""
         },
         "attribute": "filters-string",

package/dist/collection/components/vviinn-image-view/vviinn-detected-object/vviinn-detected-object.css

@@ -19,7 +19,6 @@
   --gray-100: #161616;
   --gray-10: #f4f4f4;
   --gray-70: #525252;
-
   --radius-radius-md: 8px;
   --button-color-button-primary: #000;
   --text-color-text-inverse: #fff;
@@ -28,11 +27,10 @@
   --text-color-text-disabled: rgba(22, 22, 22, 0.25);
   --surface-color-surface-accent: #e0e0e0;
   --border-color-border-02: #c6c6c6;
-
   --surface-color-surface-active: #161616;
   --surface-color-surface-inactive: #e0e0e0;
-
   --stroke-color-stroke-01: #f4f4f4;
+  --chip-color-badge-primary: #161616;
 
   /* New Styles */
   --font-family-base: Inter, system-ui, sans-serif;

package/dist/collection/components/vviinn-price-range/vviinn-price-range.css

@@ -19,7 +19,6 @@
   --gray-100: #161616;
   --gray-10: #f4f4f4;
   --gray-70: #525252;
-
   --radius-radius-md: 8px;
   --button-color-button-primary: #000;
   --text-color-text-inverse: #fff;
@@ -28,11 +27,10 @@
   --text-color-text-disabled: rgba(22, 22, 22, 0.25);
   --surface-color-surface-accent: #e0e0e0;
   --border-color-border-02: #c6c6c6;
-
   --surface-color-surface-active: #161616;
   --surface-color-surface-inactive: #e0e0e0;
-
   --stroke-color-stroke-01: #f4f4f4;
+  --chip-color-badge-primary: #161616;
 
   /* New Styles */
   --font-family-base: Inter, system-ui, sans-serif;
@@ -237,6 +235,7 @@
 
 :host {
   display: block;
+  max-width: 400px;
 }
 
 .histogram {
@@ -320,3 +319,27 @@
   height: 0;
   z-index: 1;
 }
+
+.label-wrapper {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 6px;
+}
+
+.label-wrapper .label {
+  display: flex;
+  padding: var(--spacing-25) var(--spacing-100);
+  justify-content: center;
+  align-items: center;
+  border-radius: var(--border-radius-100);
+  background: var(--chip-color-badge-primary);
+
+  color: var(--color-text-inverse);
+  text-align: center;
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-label);
+  font-style: normal;
+  font-weight: var(--font-weight-500);
+  line-height: var(--line-height-label);
+  letter-spacing: var(--letter-spacing-label, 0px);
+}