@crystaldesign/diva-web-planner-react 25.11.0-rc.0 → 25.11.0-rc.10

package/build/esm/index-220b8bb8.js

@@ -0,0 +1,123 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
+import { observer } from 'mobx-react-lite';
+import { useTranslation, useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
+import { useState, useEffect } from 'react';
+import classnames from 'classnames';
+import CountUp from 'react-countup';
+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/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+
+var wrapper = "wrapper-1wXYE";
+var priceWrapper = "priceWrapper-oLrQ1";
+var price = "price-aaYz6";
+var rabattVisible = "rabattVisible-npE0I";
+var brutto = "brutto-T4loO";
+var title = "title-1Yq19";
+var mobile = "mobile-Oy5-9";
+var percentage = "percentage--8-xl";
+var css_248z = ".wrapper-1wXYE {\n  position: sticky;\n  width: calc(100% - 24px);\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  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  text-align: center;\n}\n\n.mobile-Oy5-9 .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";
+styleInject(css_248z);
+
+var SummaryHeader = function SummaryHeader(props) {
+  var _newCurSetPrice$toStr, _newCurSetPrice$toStr2, _newCurSetPrice$toStr3, _newCurSetPrice$toStr4;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  var showRabatt = viewHandler.productState.formatedBruttoPrice !== undefined && !viewHandler.getViewConfig().hideRabattPrice;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    newBruttoPrice = _useState2[0],
+    setNewBruttoPrice = _useState2[1];
+  var _useState3 = useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    oldBruttoPrice = _useState4[0],
+    setOldBruttoPrice = _useState4[1];
+  var _useState5 = useState(0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    newCurSetPrice = _useState6[0],
+    setNewCurSetPrice = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    oldCurSetPrice = _useState8[0],
+    setOldCurSetPrice = _useState8[1];
+  var _useState9 = useState(0),
+    _useState10 = _slicedToArray(_useState9, 2),
+    newRabatt = _useState10[0],
+    setNewRabatt = _useState10[1];
+  var _useState11 = useState(0),
+    _useState12 = _slicedToArray(_useState11, 2),
+    oldRabatt = _useState12[0],
+    setOldRabatt = _useState12[1];
+  useEffect(function () {
+    var _viewHandler$productS, _viewHandler$productS2;
+    setNewBruttoPrice((_viewHandler$productS = viewHandler.productState.formatedBruttoPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0);
+    setNewCurSetPrice((_viewHandler$productS2 = viewHandler.productState.formatedCurSetPrice) !== null && _viewHandler$productS2 !== void 0 ? _viewHandler$productS2 : 0);
+    setNewRabatt(Math.round(viewHandler.productState.formatedCurSetPrice * 100 / viewHandler.productState.formatedBruttoPrice) - 100);
+  }, [viewHandler.productState.formatedBruttoPrice, viewHandler.productState.formatedCurSetPrice]);
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wrapper, viewHandler.getIsInMobileView() ? mobile : undefined, showRabatt ? rabattVisible : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      className: title,
+      children: t('configurator.summary.header.title')
+    }), !hidePrices && /*#__PURE__*/jsxs("div", {
+      className: priceWrapper,
+      children: [/*#__PURE__*/jsx("div", {
+        className: brutto,
+        children: /*#__PURE__*/jsx(CountUp, {
+          end: newBruttoPrice,
+          duration: 2,
+          decimals: (_newCurSetPrice$toStr = (_newCurSetPrice$toStr2 = newCurSetPrice.toString().split('.')[1]) === null || _newCurSetPrice$toStr2 === void 0 ? void 0 : _newCurSetPrice$toStr2.length) !== null && _newCurSetPrice$toStr !== void 0 ? _newCurSetPrice$toStr : 0,
+          start: oldBruttoPrice,
+          formattingFn: function formattingFn(n) {
+            return DivaUtils.formatPrice(n, viewHandler.productState.getPriceFormatForCounter(newBruttoPrice));
+          }
+        })
+      }), /*#__PURE__*/jsx("div", {
+        className: price,
+        children: /*#__PURE__*/jsx(CountUp, {
+          end: newCurSetPrice,
+          duration: 2,
+          decimals: (_newCurSetPrice$toStr3 = (_newCurSetPrice$toStr4 = newCurSetPrice.toString().split('.')[1]) === null || _newCurSetPrice$toStr4 === void 0 ? void 0 : _newCurSetPrice$toStr4.length) !== null && _newCurSetPrice$toStr3 !== void 0 ? _newCurSetPrice$toStr3 : 0,
+          start: oldCurSetPrice,
+          formattingFn: function formattingFn(n) {
+            return DivaUtils.formatPrice(n, viewHandler.productState.getPriceFormatForCounter(newCurSetPrice));
+          }
+        })
+      }), showRabatt && /*#__PURE__*/jsx("div", {
+        className: percentage,
+        children: /*#__PURE__*/jsx(CountUp, {
+          end: newRabatt,
+          start: oldRabatt,
+          duration: 2,
+          formattingFn: function formattingFn(n) {
+            return n + '%';
+          },
+          onEnd: function onEnd() {
+            setOldBruttoPrice(newBruttoPrice);
+            setOldCurSetPrice(newCurSetPrice);
+            setOldRabatt(newRabatt);
+          }
+        })
+      })]
+    })]
+  });
+};
+var SummaryHeader$1 = observer(SummaryHeader);
+
+export { SummaryHeader$1 as default };

package/build/esm/{index-783d3135.js → index-25597eea.js}

@@ -1,12 +1,12 @@
 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-27b81e8a.js';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
 import { useRef, useState, useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
 import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
 import RealTimeRenderer from '@crystaldesign/real-time-viewer';
-import NavBar from './index-11e2b1e4.js';
+import NavBar from './index-18a70837.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-0630cf50.js → index-25d6d9a3.js}

@@ -1,4 +1,4 @@
-import { s as styleInject } from './index-27b81e8a.js';
+import { s as styleInject } from './index-f8e7506c.js';
 import { useTranslation, useDivaCore, getLogger } from '@crystaldesign/diva-core';
 import 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/build/esm/{index-2cae34e1.js → index-27cd7666.js}

@@ -1,8 +1,8 @@
-import { s as styleInject, u as useViewHandler } from './index-27b81e8a.js';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
 import 'react';
-import { w as wcBoxPlannerAddElement, a as wcBoxPlannerAddElementLeft, b as wcBoxPlannerAddElementTop, c as wcBoxPlannerAddElementRight, h as wc2DRotClock, i as wc2DRotCounterClock, d as wcPlanner3DRot, e as wcPlanner3DMove, f as wcPlannerDistanceToGround, g as wcPlannerArrowDistanceToGround } from './index.module-b5c8243e.js';
-import { w as wcUi2DOutlineDraggable, a as wcUi2DOutlineDraggableActive, b as wcUi2DOutlineSelectable, c as wc3DOutlineSvg, d as wc3DOutlinePolygon, e as wc3DOutlinePolygonContours, f as wc3DOutlinePolygonContoursSel } from './index.module-4df6176f.js';
-import PlannerUI from './index-c26e9cd0.js';
+import { w as wcBoxPlannerAddElement, a as wcBoxPlannerAddElementLeft, b as wcBoxPlannerAddElementTop, c as wcBoxPlannerAddElementRight, h as wc2DRotClock, i as wc2DRotCounterClock, d as wcPlanner3DRot, e as wcPlanner3DMove, f as wcPlannerDistanceToGround, g as wcPlannerArrowDistanceToGround } from './index.module-8e258d2e.js';
+import { w as wcUi2DOutlineDraggable, a as wcUi2DOutlineDraggableActive, b as wcUi2DOutlineSelectable, c as wc3DOutlineSvg, d as wc3DOutlinePolygon, e as wc3DOutlinePolygonContours, f as wc3DOutlinePolygonContoursSel } from './index.module-b04c6b15.js';
+import PlannerUI from './index-72348eb3.js';
 import classnames from 'classnames';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -22,23 +22,23 @@ import '@crystaldesign/web-planner-logic';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
-import './index-e7d050c9.js';
-import './index-6c6ee08f.js';
-import './index-74639272.js';
-import './index-ea1ddcf3.js';
-import './index-fa2b5077.js';
-import './index-be8553a7.js';
-import './index-071dfef3.js';
-import './index-1df920a6.js';
-import './index-436eb1b1.js';
-import './index-8ba5b066.js';
-import './index-8a640fd0.js';
-import './index-7b2250de.js';
-import './index-439a5b40.js';
+import './index-71f64617.js';
+import './index-7f5e2c53.js';
+import './index-588103ec.js';
+import './index-f92a1647.js';
+import './index-fc950ef5.js';
+import './index-1e5b93e0.js';
+import './index-382bfeaa.js';
+import './index-9ae39c77.js';
+import './index-94a069c6.js';
+import './index-bc088a7d.js';
+import './index-453a0043.js';
+import './index-5dacc78e.js';
+import './index-9bf90daf.js';
 import 'react-draggable';
-import './index-dfa01034.js';
-import './index-8ff2230f.js';
-import './index-1ddd7ac8.js';
+import './index-486d5a7a.js';
+import './index-dfb61a5f.js';
+import './index-fe3f305a.js';
 
 var wcPlannerButton = "wcPlannerButton-hPp4U";
 var tablet = "tablet-4JSOS";

package/build/esm/{index-bfae7746.js → index-284df1b1.js}

@@ -1,17 +1,17 @@
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-27b81e8a.js';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
 import classnames from 'classnames';
 import { useEffect } from 'react';
-import Inputbox from './index-f8cc8290.js';
-import Product from './index-b2e46893.js';
-import Settings from './index-36789f6c.js';
-import TabGroup from './index-146111fe.js';
-import NavigationButtons from './index-fd9bae9b.js';
+import Inputbox from './index-9d94aa93.js';
+import Product from './index-659d444c.js';
+import Settings from './index-5cb3da0d.js';
+import TabGroup from './index-02de866b.js';
+import NavigationButtons from './index-87e7c033.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import BasketActionStandard from './index-1e413432.js';
+import BasketAction from './index-2fb65d89.js';
 import { observer } from 'mobx-react-lite';
-import BasketMobile from './index-9258248f.js';
-import ProgressBar from './index-f32a3f5c.js';
+import BasketMobile from './index-0ad66dd4.js';
+import ProgressBar from './index-2b771a82.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
@@ -28,88 +28,88 @@ import '@crystaldesign/web-planner-logic';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
-import './index-14ab2d52.js';
-import './index-860f7a45.js';
-import './index-37e77cc2.js';
-import './index-46afd1d7.js';
+import './index-2ad33e47.js';
+import './index-3155efb3.js';
+import './index-e643d4a6.js';
+import './index-ef8a45ca.js';
 import 'sift';
-import './index-5dd906a1.js';
-import './index-35d28204.js';
-import './index-f53e2a5d.js';
-import './index-76c62221.js';
-import './index.module-09444f53.js';
-import './index-cfb1a242.js';
+import './index-7b295442.js';
+import './index-65ddd0e8.js';
+import './index-b131ce7c.js';
+import './index-bf293841.js';
+import './index.module-5a994da8.js';
+import './index-90117bb5.js';
 import 'react-switch';
-import './index-8701e57c.js';
-import './index-4cc3d4b8.js';
+import './index-c77d49be.js';
+import './index-166f913b.js';
 import 'react-countup';
-import './index-159ae569.js';
+import './index-3e624f86.js';
 import 'react-dropdown';
-import './index-8104c9a2.js';
-import './index-a0481bbe.js';
-import './index-9c57c5a3.js';
-import './index-12f0d4c7.js';
+import './index-bd74e64e.js';
+import './index-9c896a5e.js';
+import './index-e3604809.js';
+import './index-4957b429.js';
 import '@crystaldesign/content-box';
-import './index-6ba0be86.js';
-import './index-fe868e0b.js';
-import './index-923e1df0.js';
-import './index-1c8a9a1c.js';
-import './index-9006f2d5.js';
-import './index-53b57469.js';
-import './index-9308c419.js';
-import './index-d9999f88.js';
-import './index-d9332172.js';
+import './index-08658390.js';
+import './index-9232ec36.js';
+import './index-f9a00666.js';
+import './index-ba6a3242.js';
+import './index-c00bcf2c.js';
+import './index-741bea61.js';
+import './index-c50fef1e.js';
+import './index-a95ee354.js';
+import './index-7fd72a0f.js';
 import 'react-laag';
-import './index.module-692506ac.js';
-import './index-d608b8e9.js';
-import './index-3a4bbe45.js';
-import './index-d72005c0.js';
-import './index-5d6d23c3.js';
-import './index-afafffbc.js';
-import './index-f20137ff.js';
-import './index.module-3773458a.js';
-import './index-c909c178.js';
-import './index-fea7d555.js';
-import './index-dff175dc.js';
-import './index-ec208ef4.js';
-import './index-f4f6f69c.js';
-import './index-be24b5d3.js';
-import './index-00e2693c.js';
-import './index-85175cbf.js';
-import './index-03cdb2a4.js';
-import './index-b06bb52a.js';
-import './index-4f446e79.js';
-import './index-37aed965.js';
+import './index.module-c50356da.js';
+import './index-ee169a07.js';
+import './index-9fa54830.js';
+import './index-9ed3a08c.js';
+import './index-a5f62283.js';
+import './index-2ed96cc4.js';
+import './index-3a041a9c.js';
+import './index.module-8c30d909.js';
+import './index-a59cea3e.js';
+import './index-326b5233.js';
+import './index-73c2d586.js';
+import './index-c2c20eee.js';
+import './index-1311e6ba.js';
+import './index-8d183900.js';
+import './index-e52bd668.js';
+import './index-c6ec92f9.js';
+import './index-d53f6bcf.js';
+import './index-db8dc973.js';
+import './index-939b3e4d.js';
+import './index-5ea1015a.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './index-bb16e2dd.js';
+import './index-92bc4bb1.js';
 import 'rc-slider';
-import './index-8e79c0b6.js';
-import './index-775b3202.js';
-import './index-5765f999.js';
-import './index-ec9c0c37.js';
+import './index-0afe1da5.js';
+import './index-be60bbe9.js';
+import './index-e1be8915.js';
+import './index-d13e67da.js';
 import 'react-confetti-explosion';
-import './index-e8da0eaa.js';
-import './index-e26eda26.js';
-import './index-2abea2d1.js';
+import './index-2917ed6a.js';
+import './index-dfa71fd2.js';
+import './index-7d65bdac.js';
 import 'react-qr-code';
-import './index-56dedad0.js';
-import './useCustomDimensions-ad6958b9.js';
-import './index-b5f1069b.js';
-import './ussIsSticky-51f9410b.js';
-import './index-e0c16944.js';
-import './index.module-4ccc0d2c.js';
-import './index-98ba7391.js';
-import './index-036258c9.js';
-import './index-6fe1238a.js';
-import './index-4a78587c.js';
+import './index-7cce9576.js';
+import './useCustomDimensions-50bba2e3.js';
+import './index-220b8bb8.js';
+import './ussIsSticky-eec07d22.js';
+import './index-d2cdcd6d.js';
+import './index.module-2e1d8012.js';
+import './index-34354e8a.js';
+import './index-5488fa6a.js';
+import './index-7000dc7d.js';
+import './index-8c0ac7f3.js';
 import 'vaul';
-import './index-5ce52ab5.js';
-import './index-54b4ec7f.js';
-import './index-8a8c1cb7.js';
-import './index-826f1849.js';
-import './index-2b3817d8.js';
-import './index.module-bd0d7fdb.js';
+import './index-cc7d86da.js';
+import './index-d70f2018.js';
+import './index-74e2ddc8.js';
+import './index-5d632067.js';
+import './index-b0cbb4ce.js';
+import './index.module-6e8df069.js';
 
 var wcConfigurator = "wcConfigurator-YOuy8";
 var landscape = "landscape-EyFBs";
@@ -162,7 +162,7 @@ var Standard = function Standard(_ref) {
           }), /*#__PURE__*/jsx(NavigationButtons, {
             className: wcConfiguratorSettingsActions,
             showCheckoutButtons: true
-          }), /*#__PURE__*/jsx(BasketActionStandard, {
+          }), /*#__PURE__*/jsx(BasketAction, {
             containerClassName: wcConfiguratorAction,
             showCheckoutButtons: false
           })]

package/build/esm/index-28bf3d2f.js

@@ -0,0 +1,104 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useState, useEffect } from 'react';
+import { useDivaCore, useTranslation, DivaUtils } from '@crystaldesign/diva-core';
+import CountUp from 'react-countup';
+import { jsxs, jsx, Fragment } 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/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+
+var sumWrapper = "sum-wrapper-gnJDJ";
+var isMobile = "is-mobile-MyAw2";
+var priceWrapper = "price-wrapper-OEjmk";
+var price = "price-JPhUm";
+var betterPrice = "better-price-q5J8D";
+var canceled = "canceled-sYf8-";
+var hidden = "hidden-et6vJ";
+var css_248z = ".sum-wrapper-gnJDJ {\n  height: 40px;\n  line-height: 30px;\n  display: flex;\n  justify-content: space-between;\n  font-weight: 700;\n  font-size: 16px;\n  flex-grow: 1;\n}\n\n.is-mobile-MyAw2.sum-wrapper-gnJDJ {\n  line-height: 38px;\n  font-size: 18px;\n  justify-content: flex-end;\n  flex-wrap: nowrap;\n  gap: 12px;\n}\n\n.price-wrapper-OEjmk {\n  display: flex;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n}\n\n.price-JPhUm {\n  position: relative;\n  color: #262626;\n  text-wrap: nowrap;\n}\n\n.is-mobile-MyAw2 .price-JPhUm {\n  font-size: 15px;\n}\n\n.better-price-q5J8D {\n  color: #b1223f;\n  margin-right: 12px;\n}\n\n.price-JPhUm.canceled-sYf8- {\n  color: #bfbfbf;\n  opacity: 1;\n  transition:\n    opacity 0.3s ease-in-out,\n    max-width 0.3s ease-in-out;\n  max-width: 110px;\n}\n.price-JPhUm.canceled-sYf8-.hidden-et6vJ {\n  opacity: 0;\n  max-width: 0px;\n}\n\n.price-JPhUm.canceled-sYf8-:before {\n  position: absolute;\n  content: '';\n  left: 0;\n  top: 42%;\n  right: 0;\n  border-top: 2px solid;\n  border-color: #b1223f;\n  transform: rotate(-7deg);\n}\n\n.is-mobile-MyAw2 .price-JPhUm.canceled-sYf8-:before {\n  top: 45%;\n}\n";
+styleInject(css_248z);
+
+var PriceSumm = function PriceSumm(props) {
+  var _newCurSetPrice$toStr, _newCurSetPrice$toStr2, _newCurSetPrice$toStr3, _newCurSetPrice$toStr4;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    oldBruttoPrice = _useState2[0],
+    setOldBruttoPrice = _useState2[1];
+  var _useState3 = useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    oldCurSetPrice = _useState4[0],
+    setOldCurSetPrice = _useState4[1];
+  var _useState5 = useState(0),
+    _useState6 = _slicedToArray(_useState5, 2),
+    newBruttoPrice = _useState6[0],
+    setNewBruttoPrice = _useState6[1];
+  var _useState7 = useState(0),
+    _useState8 = _slicedToArray(_useState7, 2),
+    newCurSetPrice = _useState8[0],
+    setNewCurSetPrice = _useState8[1];
+  useEffect(function () {
+    var _viewHandler$productS, _viewHandler$productS2;
+    setNewBruttoPrice((_viewHandler$productS = viewHandler.productState.formatedBruttoPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0);
+    setNewCurSetPrice((_viewHandler$productS2 = viewHandler.productState.formatedCurSetPrice) !== null && _viewHandler$productS2 !== void 0 ? _viewHandler$productS2 : 0);
+  }, [viewHandler.productState.formatedBruttoPrice, viewHandler.productState.formatedCurSetPrice]);
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(sumWrapper, viewHandler.getIsInMobileView() ? isMobile : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      children: t('configurator.Sum', 'Summe')
+    }), /*#__PURE__*/jsx("div", {
+      className: priceWrapper,
+      children: !hidePrices && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(price, viewHandler.productState.formatedBruttoPrice ? betterPrice : undefined),
+          children: /*#__PURE__*/jsx(CountUp, {
+            end: newCurSetPrice,
+            duration: 0.5,
+            start: oldCurSetPrice,
+            decimals: (_newCurSetPrice$toStr = (_newCurSetPrice$toStr2 = newCurSetPrice.toString().split('.')[1]) === null || _newCurSetPrice$toStr2 === void 0 ? void 0 : _newCurSetPrice$toStr2.length) !== null && _newCurSetPrice$toStr !== void 0 ? _newCurSetPrice$toStr : 0,
+            formattingFn: function formattingFn(n) {
+              return DivaUtils.formatPrice(n, viewHandler.productState.getPriceFormatForCounter(newCurSetPrice));
+            },
+            onEnd: function onEnd() {
+              setOldCurSetPrice(newCurSetPrice);
+            }
+          })
+        }), /*#__PURE__*/jsxs("div", {
+          className: classnames(price, canceled, !viewHandler.productState.formatedBruttoPrice ? hidden : undefined),
+          children: [' ', /*#__PURE__*/jsx(CountUp, {
+            end: newBruttoPrice,
+            duration: 0.5,
+            decimals: (_newCurSetPrice$toStr3 = (_newCurSetPrice$toStr4 = newCurSetPrice.toString().split('.')[1]) === null || _newCurSetPrice$toStr4 === void 0 ? void 0 : _newCurSetPrice$toStr4.length) !== null && _newCurSetPrice$toStr3 !== void 0 ? _newCurSetPrice$toStr3 : 0,
+            start: oldBruttoPrice,
+            formattingFn: function formattingFn(n) {
+              return DivaUtils.formatPrice(n, viewHandler.productState.getPriceFormatForCounter(newBruttoPrice));
+            },
+            onEnd: function onEnd() {
+              setOldBruttoPrice(newBruttoPrice);
+            }
+          })]
+        })]
+      })
+    })]
+  });
+};
+var PriceSumm$1 = observer(PriceSumm);
+
+export { PriceSumm$1 as default };

package/build/esm/{index-e8da0eaa.js → index-2917ed6a.js}

@@ -1,10 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler } from './index-27b81e8a.js';
+import { s as styleInject, u as useViewHandler } from './index-f8e7506c.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
-import ArQrCodeIcon from './index-e26eda26.js';
-import { u as useCustomDimensions } from './useCustomDimensions-ad6958b9.js';
+import ArQrCodeIcon from './index-dfa71fd2.js';
+import { u as useCustomDimensions } from './useCustomDimensions-50bba2e3.js';
 import { useTranslation } from '@crystaldesign/diva-core';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -22,9 +22,9 @@ import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-laag';
-import './index-2abea2d1.js';
+import './index-7d65bdac.js';
 import 'react-qr-code';
-import './index-56dedad0.js';
+import './index-7cce9576.js';
 
 var wrapper = "wrapper-IoYoU";
 var subWrapper = "subWrapper-Gf23J";
@@ -75,7 +75,7 @@ var ArticleOverview = function ArticleOverview() {
           }), /*#__PURE__*/jsx("path", {
             d: "m17.5 15.5 2-2"
           })]
-        }), "Gesamtma\xDFe"]
+        }), t('configurator.summary.total_dimensions')]
       })
     }), /*#__PURE__*/jsxs("div", {
       className: subWrapper,
@@ -132,7 +132,7 @@ var ArticleOverview = function ArticleOverview() {
                 d: "M21.6498 19.0769C22.2068 19.0769 22.6444 19.2112 22.9627 19.4797C23.2809 19.7482 23.44 20.1088 23.44 20.5613C23.44 21.0436 23.2809 21.4141 22.9627 21.6727C22.6444 21.9263 22.2093 22.0531 21.6573 22.0531L21.5529 22.1128H20.4937V24H19.4792V19.0769H21.6498ZM21.5305 21.3296C21.8189 21.3296 22.0327 21.2724 22.172 21.158C22.3162 21.0387 22.3883 20.8572 22.3883 20.6135C22.3883 20.3698 22.3162 20.1908 22.172 20.0764C22.0327 19.9571 21.8189 19.8974 21.5305 19.8974H20.4937V21.3296H21.5305ZM22.1347 21.5459L23.731 24H22.5748L21.2545 21.8443L22.1347 21.5459Z",
                 fill: "var(--diva-theme-palette-primary-main)"
               })]
-            }), "Zuhause ausprobieren"]
+            }), t('configurator.ar_try_at_home')]
           }));
         }
       })]