@crystaldesign/diva-web-planner-react 26.5.0-beta.5 → 26.5.0-beta.51

package/build/esm/{index-2491a713.js → index-c3840350.js}

@@ -1,16 +1,16 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler, a as useAnalyzerComponents, M as MissingAnalyzerComponent } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler, a as useAnalyzerComponents, M as MissingAnalyzerComponent } from './index-87690a5b.js';
 import { observer } from 'mobx-react-lite';
 import { useEffect, createElement } from 'react';
-import Product from './index-8e598ac6.js';
-import Sidebar from './index-9ec2575d.js';
+import Product from './index-969ccaa2.js';
+import Sidebar from './index-3895196f.js';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import 'react-dynamic-multi-render';
 import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';
@@ -24,104 +24,104 @@ import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-switch';
 import 'react-countup';
-import './index-9a03a1a0.js';
-import './index-60e59034.js';
+import './index-a299646e.js';
+import './index-eec1a6f8.js';
 import '@crystaldesign/content-item';
-import './index-b83c1bd7.js';
-import './index-606e8f78.js';
-import './index-7741200b.js';
+import './index-292f2883.js';
+import './index-7c34d797.js';
+import './index-80c49623.js';
 import 'sift';
-import './index-3e626fdf.js';
-import './index-ffa0132c.js';
-import './index-04d84870.js';
-import './index-4e2933c8.js';
-import './index.module-79870477.js';
-import './index-745302ee.js';
-import './index-2fe552b2.js';
+import './index-2a630a5f.js';
+import './index-76a9958a.js';
+import './index-9caac398.js';
+import './index-cfb0bc69.js';
+import './index.module-84be22a3.js';
+import './index-53540b2b.js';
+import './index-9294fdd8.js';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';
-import './index-2655f141.js';
+import './index-956a1303.js';
 import 'react-dropdown';
-import './index-5386b456.js';
-import './index-3284d8b1.js';
-import './index-167c00d4.js';
-import './index-23e05462.js';
+import './index-735d5dd5.js';
+import './index-ef5e9f57.js';
+import './index-8df53bb0.js';
+import './index-2a2844a2.js';
 import '@crystaldesign/content-box';
-import './index-1f5d7d2b.js';
-import './index-7b941005.js';
-import './index-1361ec87.js';
-import './index-feb7dd9e.js';
+import './index-bc361961.js';
+import './index-6a81080c.js';
+import './index-c64850f6.js';
+import './index-ccdaebad.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './UnlockCard-efefccbf.js';
-import './index-211217c7.js';
-import './index-915c4156.js';
-import './index-fc3830f4.js';
-import './index-0e47c63c.js';
-import './index-a81cae1f.js';
-import './index-ed6de348.js';
+import './UnlockCard-0e5de921.js';
+import './index-80cf23e6.js';
+import './index-7371cc32.js';
+import './index-036ea415.js';
+import './index-d38cb2e4.js';
+import './index-10a0aaa6.js';
+import './index-a2c9a2b2.js';
 import 'react-laag';
-import './index.module-6743da68.js';
-import './index-f14387bb.js';
-import './index-7c02270c.js';
-import './index-529c67c3.js';
-import './index-7fe066bc.js';
-import './index-7b44db4f.js';
-import './index.module-16a900be.js';
-import './index-fb4ea3c3.js';
-import './index-2f1ec53e.js';
-import './index-886b031a.js';
-import './index-296237c8.js';
-import './index-fd3b6011.js';
-import './index-de4f2487.js';
-import './index-ddaf035f.js';
-import './index-91996159.js';
-import './index-b0b4ab84.js';
-import './index-e87d9974.js';
-import './index-a9a26070.js';
-import './index-17a0d152.js';
-import './index-a55aef7c.js';
+import './index.module-6edd1343.js';
+import './index-d6b4117f.js';
+import './index-2113347c.js';
+import './index-bcdc4e78.js';
+import './index-bf1bb816.js';
+import './index-f0fe1313.js';
+import './index.module-4d0cce0b.js';
+import './index-c9ff51e5.js';
+import './index-ee191171.js';
+import './index-5859a688.js';
+import './index-e5181f71.js';
+import './index-99d4bea2.js';
+import './index-9fd12b17.js';
+import './index-0a21882a.js';
+import './index-c4f1f611.js';
+import './index-3b2ddda4.js';
+import './index-62051fb4.js';
+import './index-bd6471df.js';
+import './index-f405957c.js';
+import './index-5d9be97d.js';
 import 'rc-slider';
-import './index-fa06f897.js';
-import './index-00a745dc.js';
-import './index-92b4ba6c.js';
-import './index-57409256.js';
-import './index-98f03fea.js';
+import './index-22d0e084.js';
+import './index-c21e16b7.js';
+import './index-ceb6f2e6.js';
+import './index-3cd6b301.js';
+import './index-beaa268e.js';
 import 'react-confetti-explosion';
-import './index-c77dfedc.js';
-import './index-4b7357d5.js';
-import './index-fabe67b6.js';
+import './index-9625dd72.js';
+import './index-ea77111b.js';
+import './index-e18dc0ba.js';
 import 'react-qr-code';
-import './index-d27a4968.js';
-import './useCustomDimensions-79bea366.js';
-import './index-e69210d3.js';
-import './ussIsSticky-c40d1d3b.js';
-import './index-9a972c55.js';
-import './index-3f3646bd.js';
-import './index-3e00a147.js';
-import './index.module-dcbfa4a7.js';
-import './index-96f20095.js';
-import './index-43f9adf8.js';
-import './index-24cc916b.js';
-import './index-8c036c70.js';
-import './index-f20614f7.js';
-import './index-30ef43d4.js';
-import './index-8de4246c.js';
-import './index-6f1075f1.js';
-import './index-b23b8890.js';
-import './index-d83c3992.js';
-import './index.module-5b205f7f.js';
-import './index-46b3460b.js';
-import './index-4cc10ba1.js';
-import './index-753e578b.js';
-import './index-4fb0315e.js';
-import './index-b4a09cd0.js';
-import './index-64cce079.js';
-import './index-3c7bdac2.js';
-import './index-795c0fbe.js';
-import './index-2f662326.js';
-import './index-801d8ee2.js';
-import './index-df8d5298.js';
+import './index-77316c45.js';
+import './useCustomDimensions-b81dea5f.js';
+import './index-c57a329b.js';
+import './ussIsSticky-9a789d46.js';
+import './index-13953401.js';
+import './index-56f985be.js';
+import './index-b7a3f3a5.js';
+import './index.module-dee7d954.js';
+import './index-d2d015e2.js';
+import './index-183061d9.js';
+import './index-15392d3b.js';
+import './index-1f64159d.js';
+import './index-ad94b0db.js';
+import './index-5e31da98.js';
+import './index-f3bd61b0.js';
+import './index-95163002.js';
+import './index-44b403f5.js';
+import './index-548831ce.js';
+import './index.module-d0221b96.js';
+import './index-8297b5a7.js';
+import './index-249b0ad2.js';
+import './index-a2197de6.js';
+import './index-f2788552.js';
+import './index-04649c6f.js';
+import './index-ed319bd8.js';
+import './index-82466b67.js';
+import './index-b36ce14b.js';
+import './index-482acfd3.js';
+import './index-219ec315.js';
+import './index-372dc453.js';
 
 var list = "list-N44Jp";
 var css_248z = ".whole-wrapper-5OM64 {\n  position: absolute;\n  margin-left: 50px;\n  height: 92%;\n  background-color: var(--settingsBackgroundColor);\n  padding-left: 5px;\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  box-shadow: inset 0px 4px 40px 1px rgba(0, 0, 0, 0.1);\n  border-right: 2px solid;\n  -webkit-user-select: text;\n     -moz-user-select: text;\n          user-select: text;\n}\n.not-expanded-A0UYP {\n  width: calc(25.5%) !important;\n}\n.not-expanded-A0UYP {\n  background-color: white;\n}\n.list-N44Jp {\n  width: calc(63% - 50px) !important;\n}\n.list-N44Jp {\n  z-index: 590;\n  background-color: rgba(250, 250, 250, 0.5);\n  margin-left: 50px;\n  /*width: calc(69% - 50px); pfister*/\n}\n";

package/build/esm/{index-438111e9.js → index-c4272c2c.js}

@@ -1,15 +1,15 @@
-import { s as styleInject } from './index-4dc2ffe8.js';
+import { s as styleInject } from './index-87690a5b.js';
 import 'react';
 import classnames from 'classnames';
 import { useTranslation } from '@crystaldesign/diva-core';
-import { g as getKey } from './index-7741200b.js';
+import { g as getKey } from './index-80c49623.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
 import 'mobx-react-lite';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';
@@ -23,80 +23,80 @@ import 'flat';
 import 'react-switch';
 import 'react-countup';
 import 'sift';
-import './index-3e626fdf.js';
-import './index-ffa0132c.js';
-import './index-04d84870.js';
-import './index-4e2933c8.js';
-import './index.module-79870477.js';
-import './index-745302ee.js';
-import './index-2fe552b2.js';
+import './index-2a630a5f.js';
+import './index-76a9958a.js';
+import './index-9caac398.js';
+import './index-cfb0bc69.js';
+import './index.module-84be22a3.js';
+import './index-53540b2b.js';
+import './index-9294fdd8.js';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';
-import './index-2655f141.js';
+import './index-956a1303.js';
 import 'react-dropdown';
-import './index-5386b456.js';
+import './index-735d5dd5.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-3284d8b1.js';
-import './index-167c00d4.js';
-import './index-23e05462.js';
+import './index-ef5e9f57.js';
+import './index-8df53bb0.js';
+import './index-2a2844a2.js';
 import '@crystaldesign/content-box';
-import './index-1f5d7d2b.js';
-import './index-7b941005.js';
-import './index-1361ec87.js';
-import './index-feb7dd9e.js';
+import './index-bc361961.js';
+import './index-6a81080c.js';
+import './index-c64850f6.js';
+import './index-ccdaebad.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './UnlockCard-efefccbf.js';
-import './index-211217c7.js';
-import './index-915c4156.js';
-import './index-fc3830f4.js';
-import './index-0e47c63c.js';
-import './index-a81cae1f.js';
-import './index-ed6de348.js';
+import './UnlockCard-0e5de921.js';
+import './index-80cf23e6.js';
+import './index-7371cc32.js';
+import './index-036ea415.js';
+import './index-d38cb2e4.js';
+import './index-10a0aaa6.js';
+import './index-a2c9a2b2.js';
 import 'react-laag';
-import './index.module-6743da68.js';
-import './index-f14387bb.js';
-import './index-7c02270c.js';
-import './index-529c67c3.js';
-import './index-7fe066bc.js';
-import './index-7b44db4f.js';
-import './index.module-16a900be.js';
-import './index-fb4ea3c3.js';
-import './index-2f1ec53e.js';
-import './index-886b031a.js';
-import './index-296237c8.js';
-import './index-fd3b6011.js';
-import './index-de4f2487.js';
-import './index-ddaf035f.js';
-import './index-91996159.js';
-import './index-b0b4ab84.js';
-import './index-e87d9974.js';
-import './index-a9a26070.js';
-import './index-17a0d152.js';
-import './index-a55aef7c.js';
+import './index.module-6edd1343.js';
+import './index-d6b4117f.js';
+import './index-2113347c.js';
+import './index-bcdc4e78.js';
+import './index-bf1bb816.js';
+import './index-f0fe1313.js';
+import './index.module-4d0cce0b.js';
+import './index-c9ff51e5.js';
+import './index-ee191171.js';
+import './index-5859a688.js';
+import './index-e5181f71.js';
+import './index-99d4bea2.js';
+import './index-9fd12b17.js';
+import './index-0a21882a.js';
+import './index-c4f1f611.js';
+import './index-3b2ddda4.js';
+import './index-62051fb4.js';
+import './index-bd6471df.js';
+import './index-f405957c.js';
+import './index-5d9be97d.js';
 import 'rc-slider';
-import './index-fa06f897.js';
-import './index-00a745dc.js';
-import './index-92b4ba6c.js';
-import './index-57409256.js';
-import './index-98f03fea.js';
+import './index-22d0e084.js';
+import './index-c21e16b7.js';
+import './index-ceb6f2e6.js';
+import './index-3cd6b301.js';
+import './index-beaa268e.js';
 import 'react-confetti-explosion';
-import './index-c77dfedc.js';
-import './index-4b7357d5.js';
-import './index-fabe67b6.js';
+import './index-9625dd72.js';
+import './index-ea77111b.js';
+import './index-e18dc0ba.js';
 import 'react-qr-code';
-import './index-d27a4968.js';
-import './useCustomDimensions-79bea366.js';
-import './index-e69210d3.js';
-import './ussIsSticky-c40d1d3b.js';
-import './index-9a972c55.js';
-import './index-3f3646bd.js';
-import './index-3e00a147.js';
-import './index.module-dcbfa4a7.js';
-import './index-96f20095.js';
-import './index-43f9adf8.js';
-import './index-24cc916b.js';
-import './index-8c036c70.js';
+import './index-77316c45.js';
+import './useCustomDimensions-b81dea5f.js';
+import './index-c57a329b.js';
+import './ussIsSticky-9a789d46.js';
+import './index-13953401.js';
+import './index-56f985be.js';
+import './index-b7a3f3a5.js';
+import './index.module-dee7d954.js';
+import './index-d2d015e2.js';
+import './index-183061d9.js';
+import './index-15392d3b.js';
+import './index-1f64159d.js';
 
 var container = "container-UuJhj";
 var title = "title-f6urG";

package/build/esm/{index-91996159.js → index-c4f1f611.js}

@@ -1,17 +1,17 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, G as GenericToolTip, P as PricePreview } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler, G as GenericToolTip, P as PricePreview } from './index-87690a5b.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useState } from 'react';
-import MetaData from './index-de4f2487.js';
-import InfoIcon from './index-745302ee.js';
+import MetaData from './index-9fd12b17.js';
+import InfoIcon from './index-53540b2b.js';
 import { useHover, useLayer } from 'react-laag';
 import { useDivaCore } from '@crystaldesign/diva-core';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';

package/build/esm/{index-e69210d3.js → index-c57a329b.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, b as PriceCounter } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler, b as PriceCounter } from './index-87690a5b.js';
 import { observer } from 'mobx-react-lite';
 import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
 import { useState, useEffect } from 'react';
@@ -7,8 +7,8 @@ import classnames from 'classnames';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';
@@ -31,11 +31,11 @@ var title = "title-1Yq19";
 var mobile = "mobile-Oy5-9";
 var small = "small-2vDXh";
 var percentage = "percentage--8-xl";
-var css_248z = ".wrapper-1wXYE {\n  position: sticky;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  margin-bottom: 8px;\n  white-space: nowrap;\n}\n\n.priceWrapper-oLrQ1 {\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n  width: 100%;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n}\n\n.price-aaYz6 {\n  font-size: 18px;\n  line-height: 18px;\n  font-size: 24px;\n  line-height: 24px;\n  color: rgba(17, 24, 39, 1);\n  font-weight: 700;\n}\n.rabattVisible-npE0I .price-aaYz6 {\n  color: rgb(220, 38, 38);\n}\n\n.brutto-T4loO {\n  font-size: 18px;\n  line-height: 24px;\n  font-weight: 300;\n  color: rgba(107, 114, 128, 1);\n  -webkit-text-decoration-line: line-through;\n          text-decoration-line: line-through;\n  display: none;\n}\n.rabattVisible-npE0I .brutto-T4loO {\n  display: block;\n}\n\n.title-1Yq19 {\n  width: auto;\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 24px;\n  color: var(--secondaryColor);\n  margin-top: 10px;\n  float: left;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n  text-align: center;\n}\n\n.mobile-Oy5-9 .title-1Yq19,\n.small-2vDXh .title-1Yq19 {\n  font-size: 16px;\n  line-height: 20px;\n}\n\n.percentage--8-xl {\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 16px;\n  color: #fff;\n  padding: 4px 8px;\n  border-radius: 40px;\n  background-color: rgb(220, 38, 38);\n}\n";
+var css_248z = ".wrapper-1wXYE {\n  position: sticky;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  margin-bottom: 8px;\n  white-space: nowrap;\n}\n\n.priceWrapper-oLrQ1 {\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n  width: 100%;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n}\n\n.price-aaYz6 {\n  font-size: 18px;\n  line-height: 18px;\n  font-size: 24px;\n  line-height: 24px;\n  color: rgba(17, 24, 39, 1);\n  font-weight: 700;\n}\n.rabattVisible-npE0I .price-aaYz6 {\n  color: rgb(220, 38, 38);\n}\n\n.brutto-T4loO {\n  font-size: 18px;\n  line-height: 24px;\n  font-weight: 300;\n  color: rgba(107, 114, 128, 1);\n  -webkit-text-decoration-line: line-through;\n          text-decoration-line: line-through;\n  display: none;\n}\n.rabattVisible-npE0I .brutto-T4loO {\n  display: block;\n}\n\n.title-1Yq19 {\n  width: auto;\n  font-weight: 500;\n  font-size: 22px;\n  line-height: 24px;\n  color: var(--secondaryColor);\n  margin-top: 18px;\n  float: left;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n}\n\n.mobile-Oy5-9 .title-1Yq19,\n.small-2vDXh .title-1Yq19 {\n  font-size: 20px;\n  line-height: 22px;\n}\n\n.percentage--8-xl {\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 16px;\n  color: #fff;\n  padding: 4px 8px;\n  border-radius: 40px;\n  background-color: rgb(220, 38, 38);\n}\n";
 styleInject(css_248z);
 
 var SummaryHeader = function SummaryHeader(props) {
-  var _viewHandler$settings, _viewHandler$settings2, _viewHandler$productS, _viewHandler$productS2;
+  var _viewHandler$settings, _viewHandler$settings2, _viewHandler$getViewC, _viewHandler$productS, _viewHandler$productS2;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var viewHandler = useViewHandler();
@@ -54,7 +54,7 @@ var SummaryHeader = function SummaryHeader(props) {
     className: classnames(wrapper, viewHandler.getIsInMobileView() ? mobile : undefined, showRabatt ? rabattVisible : undefined, ((_viewHandler$settings = (_viewHandler$settings2 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings2 === void 0 ? void 0 : _viewHandler$settings2.getBoundingClientRect().width) !== null && _viewHandler$settings !== void 0 ? _viewHandler$settings : 400) < 400 ? small : undefined),
     children: [/*#__PURE__*/jsx("div", {
       className: title,
-      children: t('configurator.summary.header.title')
+      children: t((_viewHandler$getViewC = viewHandler.getViewConfig().summaryHeaderTitle) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : 'configurator.summary.header.title')
     }), !hidePrices && /*#__PURE__*/jsxs("div", {
       className: priceWrapper,
       children: [/*#__PURE__*/jsx("div", {

package/build/esm/{index-1361ec87.js → index-c64850f6.js}

@@ -1,14 +1,15 @@
-import { s as styleInject, u as useViewHandler, S as SettingsHeader } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler, S as SettingsHeader } from './index-87690a5b.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import { useCallback, useEffect } from 'react';
+import { useRef, useCallback, useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
 import { ContentBoxComponent } from '@crystaldesign/content-box';
+import classnames from 'classnames';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';
@@ -16,7 +17,6 @@ import '@babel/runtime/helpers/toConsumableArray';
 import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
-import 'classnames';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
@@ -24,8 +24,9 @@ import 'react-switch';
 import 'react-countup';
 
 var productsGrid = "products-grid-b9XWQ";
+var productsGridDisabled = "products-grid-disabled-1BegM";
 var skeleton = "skeleton-XdjqR";
-var css_248z = ".products-grid-b9XWQ {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));\n  grid-auto-rows: min-content;\n  grid-gap: 10px;\n  height: 100%;\n  padding-top: 16px;\n}\n\n.skeleton-XdjqR {\n  width: 100%;\n  aspect-ratio: 1 / 1;\n  color: var(--primaryColor);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 22px;\n  box-shadow: rgba(0, 0, 0,0.1) 0px 0px 16px 0px;\n}\n";
+var css_248z = ".products-grid-b9XWQ {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));\n  grid-auto-rows: min-content;\n  grid-gap: 10px;\n  height: 100%;\n  padding-top: 16px;\n  padding-bottom: 16px;\n}\n\n.products-grid-disabled-1BegM {\n  pointer-events: none;\n}\n\n.mobile .products-grid-b9XWQ {\n  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));\n}\n\n.skeleton-XdjqR {\n  width: 100%;\n  aspect-ratio: 1 / 1;\n  color: var(--primaryColor);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 22px;\n  box-shadow: rgba(0, 0, 0,0.1) 0px 0px 16px 0px;\n}\n";
 styleInject(css_248z);
 
 var PromotedProducts = function PromotedProducts(_ref) {
@@ -38,7 +39,12 @@ var PromotedProducts = function PromotedProducts(_ref) {
   var viewHandler = useViewHandler();
   var settingsState = viewHandler.settingsState;
   var productsConfig = viewHandler.getViewConfig().productsConfig;
+  var isOpeningProductRef = useRef(false);
+  var didStartLoadingRef = useRef(false);
   var onAddProduct = useCallback(function (productId) {
+    if (viewHandler.uiState.isLogicLoading || settingsState.promotedOptimisticProductId != null || isOpeningProductRef.current) return;
+    isOpeningProductRef.current = true;
+    didStartLoadingRef.current = false;
     settingsState.setPromotedOptimisticProductId(productId);
     openComponent({
       type: 'DIVA_WEBPLANNER',
@@ -50,17 +56,21 @@ var PromotedProducts = function PromotedProducts(_ref) {
         keepCache: '1'
       }
     });
-  }, [openComponent, settingsState]);
+  }, [openComponent, settingsState, viewHandler.uiState]);
   var configProductId = (_viewHandler$configSt = viewHandler.configState.productId) !== null && _viewHandler$configSt !== void 0 ? _viewHandler$configSt : !viewHandler.configState.divaNr && viewHandler.divaWebPlanner.getStartProductId();
-
-  // Keep the selection ring on the clicked tile while the planner reloads; `configState.productId` can
-  // clear or lag during `initialize`, which caused flicker without this.
   var selectedProduct = (_settingsState$promot = settingsState.promotedOptimisticProductId) !== null && _settingsState$promot !== void 0 ? _settingsState$promot : configProductId;
   useEffect(function () {
-    if (settingsState.promotedOptimisticProductId != null && configProductId === settingsState.promotedOptimisticProductId) {
+    if (!isOpeningProductRef.current) return;
+    if (viewHandler.uiState.isLogicLoading) {
+      didStartLoadingRef.current = true;
+      return;
+    }
+    if (didStartLoadingRef.current) {
+      isOpeningProductRef.current = false;
+      didStartLoadingRef.current = false;
       settingsState.setPromotedOptimisticProductId(null);
     }
-  }, [settingsState.promotedOptimisticProductId, configProductId, settingsState]);
+  }, [settingsState, viewHandler.uiState.isLogicLoading]);
   useEffect(function () {
     settingsState.setPromotedOptimisticProductId(null);
   }, [organization._id, settingsState]);
@@ -72,13 +82,15 @@ var PromotedProducts = function PromotedProducts(_ref) {
   }, [organization._id, viewHandler.uiState.isLogicLoading, catalogCodex]);
   var groups = settingsState.promotedGroups;
   var skeletons = productsConfig !== null && productsConfig !== void 0 && productsConfig.maxCount && productsConfig.showSkeletions ? getSkeletons(productsConfig.maxCount, groups.length) : [];
+  var areProductsDisabled = viewHandler.uiState.isLogicLoading || settingsState.promotedOptimisticProductId != null || isOpeningProductRef.current;
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(SettingsHeader, {
       isInScroller: false,
       isSettingsHeader: true,
       item: item
     }), /*#__PURE__*/jsxs("div", {
-      className: productsGrid,
+      className: classnames(productsGrid, areProductsDisabled ? productsGridDisabled : undefined),
+      "aria-disabled": areProductsDisabled,
       children: [groups.map(function (group, i) {
         return /*#__PURE__*/jsx(ContentBoxComponent, {
           settings: {

package/build/esm/{index-41fbf3af.js → index-c6fb5ed9.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-4dc2ffe8.js';
+import { u as useViewHandler } from './index-87690a5b.js';
 import { useState, useRef } from 'react';
 import classnames from 'classnames';
 import { Vector2 } from '@crystaldesign/web-planner-logic';
@@ -9,8 +9,8 @@ import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
 import '@crystaldesign/diva-core';
 import 'mobx-react-lite';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';

package/build/esm/{index-6857774f.js → index-c750b215.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';
@@ -7,8 +7,8 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';

package/build/esm/{index-5e8706e9.js → index-c8bf9e7b.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
 import { observer } from 'mobx-react-lite';
 import { useState, useEffect } from 'react';
 import classnames from 'classnames';
@@ -7,8 +7,8 @@ import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
 import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';

package/build/esm/{index-1aa170f7.js → index-c948eca9.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
 import 'react';
 import { Rnd } from 'react-rnd';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -7,8 +7,8 @@ import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
 import '@crystaldesign/diva-core';
 import 'mobx-react-lite';
-import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
 import '@babel/runtime/regenerator';
 import '@babel/runtime/helpers/classCallCheck';
 import '@babel/runtime/helpers/createClass';

package/build/esm/{index-fb4ea3c3.js → index-c9ff51e5.js}

@@ -1,10 +1,10 @@
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-4dc2ffe8.js';
+import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
 import { observer } from 'mobx-react-lite';
 import { useRef, useState, useEffect } from 'react';
-import StepInfo from './index-2f1ec53e.js';
+import StepInfo from './index-ee191171.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';