@crystaldesign/diva-web-planner-react 25.11.0-rc.3 → 25.11.0-rc.5

package/build/esm/{index-ebb5b8fd.js → index-c3de35f9.js}

@@ -1,27 +1,27 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import React, { useState, useRef, useEffect, useMemo, Suspense } from 'react';
 import { observer } from 'mobx-react-lite';
 import sift from 'sift';
-import TextBox from './index-79e7ff04.js';
-import ItemVariant from './index-df7ca349.js';
-import SettingsPaletteGroup from './index-4bada776.js';
-import ToggleOption from './index-e2b074b0.js';
-import GroupDropdown from './index-9e59be7a.js';
-import PromotedProducts from './index-7944e3ff.js';
-import ToggleName from './index-9d794ee3.js';
-import itemPaletteTypeComponentMap from './index-f3f0e50e.js';
+import TextBox from './index-c0652c3a.js';
+import ItemVariant from './index-702983dc.js';
+import SettingsPaletteGroup from './index-627a98b8.js';
+import ToggleOption from './index-85b2e531.js';
+import GroupDropdown from './index-41a7cb94.js';
+import PromotedProducts from './index-1aae37b2.js';
+import ToggleName from './index-6519cefe.js';
+import itemPaletteTypeComponentMap from './index-44f0313c.js';
 import classnames from 'classnames';
-import StepInfo from './index-c9cb4505.js';
-import SettingsHeader from './index-f9f817ce.js';
-import ReplaceSwitch from './index-276aa18a.js';
+import StepInfo from './index-cb0721c4.js';
+import SettingsHeader from './index-6ad56458.js';
+import ReplaceSwitch from './index-d1dbda39.js';
 import { Swiper, SwiperSlide } from 'swiper/react';
 import { Navigation } from 'swiper/modules';
-import Slider from './index-014d9204.js';
-import MultiToggle from './index-363952a9.js';
+import Slider from './index-01e5b6dc.js';
+import MultiToggle from './index-ebc4f14d.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import SummaryOverview from './index-a95f1f1d.js';
+import SummaryOverview from './index-9a934ee3.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 var collapsableInner = "collapsable-inner-YPvJa";
@@ -256,13 +256,13 @@ var useGridVariables = function useGridVariables(item) {
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ShelfPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-031f800a.js');
+  return import('./index-b3bd5416.js');
 });
 var DoorPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-e7d537db.js');
+  return import('./index-316bcbca.js');
 });
 var ProductList = /*#__PURE__*/React.lazy(function () {
-  return import('./index-31bb45de.js');
+  return import('./index-cf1bf097.js');
 });
 var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
   var _item$groups$;

package/build/esm/{index-6a2bb743.js → index-c4226262.js}

@@ -1,15 +1,15 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { u as useViewHandler } from './index-7aa98516.js';
+import { u as useViewHandler } from './index-2ec2d4f1.js';
 import { useState, useEffect, Suspense } from 'react';
-import { n as notExpanded } from './index.module-3cb0d7fa.js';
-import { s as scrollable, h as header, t as toggleWrapper, o as optionWrapper } from './index.module-589bb331.js';
-import { d as decision, D as DecisionVisualization } from './DecisionVizualizer-73f39470.js';
+import { n as notExpanded } from './index.module-96dc2cd7.js';
+import { s as scrollable, h as header, t as toggleWrapper, o as optionWrapper } from './index.module-036b4c8b.js';
+import { d as decision, D as DecisionVisualization } from './DecisionVizualizer-7024e666.js';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
-import Toggle from './index-b33a0b2b.js';
-import AsyncRender from './index-7d29732e.js';
+import Toggle from './index-a00f1c41.js';
+import AsyncRender from './index-a6c14f63.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@crystaldesign/diva-core';
@@ -27,7 +27,7 @@ import 'flat';
 import 'react-json-view-lite';
 import 'react-draggable';
 import 'react-switch';
-import './index-2e674350.js';
+import './index-e24081ff.js';
 import 'react-collapsible';
 
 var _excluded = ["onMouseDown"];

package/build/esm/{index-6227f21f.js → index-c90bc10e.js}

@@ -1,8 +1,8 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject } from './index-7aa98516.js';
+import { s as styleInject } from './index-2ec2d4f1.js';
 import { useState, useEffect } from 'react';
-import Toggle from './index-b33a0b2b.js';
+import Toggle from './index-a00f1c41.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 
 var wrapper = "wrapper-i5mp2";

package/build/esm/{index-c9cb4505.js → index-cb0721c4.js}

@@ -1,4 +1,4 @@
-import { s as styleInject } from './index-7aa98516.js';
+import { s as styleInject } from './index-2ec2d4f1.js';
 import classnames from 'classnames';
 import 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';

package/build/esm/{index-f96fb036.js → index-ccd96f2e.js}

@@ -1,7 +1,7 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
-import RoomSerious from './index-f9b7f22b.js';
+import RoomSerious from './index-07b76a2a.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-e9c0a9df.js → index-cd7bb551.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';

package/build/esm/{index-e3d36350.js → index-cd98ade9.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-7aa98516.js';
+import './index-2ec2d4f1.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-2b5baa08.js → index-cecb6031.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
 import { DivaUtils } from '@crystaldesign/diva-core';

package/build/esm/{index-31bb45de.js → index-cf1bf097.js}

@@ -1,13 +1,13 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { useDivaCore, useTranslation } from '@crystaldesign/diva-core';
 import { useState, useCallback } from 'react';
 import { observer } from 'mobx-react-lite';
 import { ProductDetailPageComponent } from '@crystaldesign/product-detail-page';
 import ProductsComponent, { useProductState } from '@crystaldesign/products-component';
-import SettingsHeader from './index-f9f817ce.js';
+import SettingsHeader from './index-6ad56458.js';
 import classnames from 'classnames';
-import Search from './index-68c02cea.js';
+import Search from './index-b7929013.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-49daecc8.js → index-cf4c4052.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-7aa98516.js';
+import './index-2ec2d4f1.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-812ef74e.js → index-d123ea38.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-39f46122.js → index-d1c2481e.js}

@@ -1,10 +1,10 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { useEffect } from 'react';
-import Inputbox from './index-e15530c2.js';
-import { cssVariables } from './index-518d531f.js';
-import Product from './index-7804d1f4.js';
-import Settings from './index-44bc1ce0.js';
-import TabGroup from './index-4387d99d.js';
+import Inputbox from './index-6f4689ca.js';
+import { cssVariables } from './index-5f03afdf.js';
+import Product from './index-b470a993.js';
+import Settings from './index-914072c3.js';
+import TabGroup from './index-16e814ba.js';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -25,105 +25,105 @@ import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-9ebbfde9.js';
-import './index-b33a0b2b.js';
+import './index-b0fc5e30.js';
+import './index-a00f1c41.js';
 import 'react-switch';
 import 'react-dropdown';
-import './index-ae945bdb.js';
-import './index-90032065.js';
-import './index-740bfb22.js';
-import './index-59b3c7ca.js';
-import './index-e80e96d5.js';
-import './index.module-c6279e5b.js';
-import './index-3476761b.js';
-import './index-7437c6a5.js';
-import './index-38f685d5.js';
-import './index-659d546c.js';
-import './index-a54113a0.js';
-import './index-d714210c.js';
-import './index-51413b0d.js';
-import './index-0ea1d1a5.js';
+import './index-679cc037.js';
+import './index-6cbffb7a.js';
+import './index-fb67ff11.js';
+import './index-75e537c4.js';
+import './index-436c9d14.js';
+import './index.module-6448bf3f.js';
+import './index-5d664073.js';
+import './index-e28ec6ab.js';
+import './index-d8d2a224.js';
+import './index-d5fd5b28.js';
+import './index-8f576407.js';
+import './index-0103533d.js';
+import './index-a98a4dcf.js';
+import './index-a6562308.js';
 import 'react-laag';
-import './index-c7704dd3.js';
+import './index-5bbfea07.js';
 import 'react-qr-code';
-import './index-fda2e50b.js';
-import './index-ea5c7b12.js';
-import './index-96438aa2.js';
-import './index-0cbf3615.js';
+import './index-5f7cc44a.js';
+import './index-4f8dd0b7.js';
+import './index-0718b700.js';
+import './index-e59d5c8c.js';
 import '@crystaldesign/content-item';
-import './index-e0377f34.js';
-import './index-f9f817ce.js';
-import './index-36f4ea5f.js';
-import './index-ebb5b8fd.js';
+import './index-1c6fc586.js';
+import './index-6ad56458.js';
+import './index-b0c5f29c.js';
+import './index-c3de35f9.js';
 import 'sift';
-import './index-79e7ff04.js';
-import './index-df7ca349.js';
-import './index-4bada776.js';
-import './index-e2b074b0.js';
-import './index.module-1e702b69.js';
-import './index-0ebd9a89.js';
-import './index-2cdf1bbb.js';
+import './index-c0652c3a.js';
+import './index-702983dc.js';
+import './index-627a98b8.js';
+import './index-85b2e531.js';
+import './index.module-6fc7818a.js';
+import './index-7a61d442.js';
+import './index-eb2d8217.js';
 import 'react-countup';
-import './index-9e59be7a.js';
-import './index-058d7e0a.js';
-import './index-4b340fa7.js';
-import './index-1b622452.js';
-import './index-aebe1eae.js';
+import './index-41a7cb94.js';
+import './index-17e6b6a3.js';
+import './index-0e9621ed.js';
+import './index-af359747.js';
+import './index-d59c5a96.js';
 import '@crystaldesign/content-box';
-import './index-20fc3882.js';
-import './index-c0a64ec9.js';
-import './index-7944e3ff.js';
-import './index-9d794ee3.js';
-import './index-f3f0e50e.js';
-import './index-ee22a00c.js';
-import './index-50a3c52d.js';
-import './index-79cc2844.js';
-import './index-45a22ff8.js';
-import './index.module-06c014ac.js';
-import './index-49daecc8.js';
-import './index-97a02286.js';
-import './index-7ddce99f.js';
-import './index-75651796.js';
-import './index-e3d36350.js';
-import './index-f987a27c.js';
-import './index.module-fadc01c8.js';
-import './index-47fe448f.js';
-import './index-c9cb4505.js';
-import './index-73692ee4.js';
-import './index-eeb793f2.js';
-import './index-453b9c1c.js';
-import './index-0e8099ac.js';
-import './index-183f5870.js';
-import './index-45b166ae.js';
-import './index-65967b41.js';
-import './index-76280de2.js';
-import './index-02d004cc.js';
-import './index-276aa18a.js';
+import './index-9efa23e8.js';
+import './index-bae4b5d5.js';
+import './index-1aae37b2.js';
+import './index-6519cefe.js';
+import './index-44f0313c.js';
+import './index-52198f5f.js';
+import './index-96b76a7a.js';
+import './index-2cc25246.js';
+import './index-7772152f.js';
+import './index.module-6edeb505.js';
+import './index-cf4c4052.js';
+import './index-0c0bdaca.js';
+import './index-b5015aa6.js';
+import './index-27a97ca3.js';
+import './index-cd98ade9.js';
+import './index-746d4c63.js';
+import './index.module-c94a1300.js';
+import './index-80114dab.js';
+import './index-cb0721c4.js';
+import './index-7463b994.js';
+import './index-aeb6cd93.js';
+import './index-52ff8ae7.js';
+import './index-983be2f6.js';
+import './index-69847ccd.js';
+import './index-e5e47ea0.js';
+import './index-b48ac7c8.js';
+import './index-46eeecfd.js';
+import './index-b6249e43.js';
+import './index-d1dbda39.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './index-014d9204.js';
+import './index-01e5b6dc.js';
 import 'rc-slider';
-import './index-363952a9.js';
-import './index-13842e99.js';
-import './index-a95f1f1d.js';
-import './index-59198d99.js';
+import './index-ebc4f14d.js';
+import './index-216a9514.js';
+import './index-9a934ee3.js';
+import './index-0b4d19f3.js';
 import 'react-confetti-explosion';
-import './index-e7b2c5c6.js';
-import './useCustomDimensions-aa547567.js';
-import './index-8b2e86e3.js';
-import './ussIsSticky-16f467e0.js';
-import './index-81ddeb75.js';
-import './index.module-8bce2698.js';
-import './index-56416460.js';
-import './index-5809aa86.js';
-import './index-0412fa23.js';
-import './index-ad6e7e2c.js';
+import './index-35316af7.js';
+import './useCustomDimensions-0bc5cce2.js';
+import './index-366b2d44.js';
+import './ussIsSticky-98e0c05c.js';
+import './index-bf5829cc.js';
+import './index.module-d965ca3c.js';
+import './index-c239929a.js';
+import './index-7014b9cc.js';
+import './index-9a0ae813.js';
+import './index-5999f707.js';
 import 'vaul';
-import './index-43806e57.js';
-import './index-76027d8d.js';
-import './index-08ed18a8.js';
-import './index-a6ac4027.js';
-import './index-25b0c713.js';
+import './index-d66b953d.js';
+import './index-a2a9fb72.js';
+import './index-383835a5.js';
+import './index-fb4effdc.js';
+import './index-11df0b53.js';
 
 var wcConfigurator = "wcConfigurator-VvOGT";
 var wcConfiguratorSteps = "wc-configurator-steps-CYXm7";

package/build/esm/{index-276aa18a.js → index-d1dbda39.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-f52b4e82.js → index-d1f8dca3.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-7aa98516.js';
+import './index-2ec2d4f1.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-f9dd823b.js → index-d32366e0.js}

@@ -1,4 +1,4 @@
-import { a as usePlannerUIHandler } from './index-7aa98516.js';
+import { a as usePlannerUIHandler } from './index-2ec2d4f1.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';

package/build/esm/{index-21cf2f99.js → index-d3d58386.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-aebe1eae.js → index-d59c5a96.js}

@@ -1,8 +1,8 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import 'react';
 import { ContentBoxComponent } from '@crystaldesign/content-box';
 import { observer } from 'mobx-react-lite';
-import FilterItem from './index-20fc3882.js';
+import FilterItem from './index-9efa23e8.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-1b2b1419.js → index-d5e1b5d4.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-7aa98516.js';
+import { u as useViewHandler } from './index-2ec2d4f1.js';
 import { useState, useRef } from 'react';
 import classnames from 'classnames';
 import { Vector2 } from '@crystaldesign/web-planner-logic';

package/build/esm/{index-659d546c.js → index-d5fd5b28.js}

@@ -1,4 +1,4 @@
-import './index-7aa98516.js';
+import './index-2ec2d4f1.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-43806e57.js → index-d66b953d.js}

@@ -1,8 +1,8 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-7aa98516.js';
+import { u as useViewHandler } from './index-2ec2d4f1.js';
 import { useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
-import ItemVariant from './index-76027d8d.js';
+import ItemVariant from './index-a2a9fb72.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-105c946d.js → index-d6cbaf7b.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';

package/build/esm/{index-38f685d5.js → index-d8d2a224.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-7aa98516.js';
+import { s as styleInject, u as useViewHandler } from './index-2ec2d4f1.js';
 import classnames from 'classnames';
 import { useState, useEffect } from 'react';
 import { useTranslation } from '@crystaldesign/diva-core';

package/build/esm/{index-7498af93.js → index-d91091ac.js}

@@ -1,11 +1,12 @@
-import { s as styleInject, u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon } from './index-7aa98516.js';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon } from './index-2ec2d4f1.js';
 import { observer } from 'mobx-react-lite';
-import 'react';
+import { useState, useEffect } from 'react';
 import classnames from 'classnames';
 import { useDivaCore, useTranslation, DivaUtils } from '@crystaldesign/diva-core';
-import { c as checkoutButton } from './index.module-3cfca067.js';
+import { c as checkoutButton } from './index.module-2047e38b.js';
+import CountUp from 'react-countup';
 import { jsxs, jsx, 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';
@@ -25,11 +26,14 @@ var wcConfiguratorAction = "wcConfigurator-action-1kRvz";
 var wcConfiguratorActionButton = "wcConfigurator-action-Button-uCk2M";
 var wcCheckoutButtonPrice = "wcCheckoutButtonPrice-S5Uqm";
 var wcCheckoutButtonText = "wcCheckoutButtonText-AKaeu";
-var css_248z = ".wcConfigurator-action-1kRvz {\n  background: rgba(242.2, 242.2, 242.2, 0.9);\n  transition: width 0.2s ease-in-out;\n  display: flex;\n}\n\n.wcConfigurator-action-Button-uCk2M {\n  background-color: var(--primaryColor);\n  background-color: var(--saveButton, var(--primaryColor));\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--saveButton, var(--primaryColor)) solid;\n  border-radius: var(--globalBorderRadius);\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  line-height: 20.8px;\n  font-weight: var(--fontWeight1);\n  height: calc(100% - 2px);\n  font-size: 14px;\n  color: white;\n  flex-grow: 1;\n  -webkit-text-stroke: 0px;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n}\n\n.wcConfigurator-settings-actions-isOnFirstStepDisabled-4PqCh .wcConfigurator-action-Button-uCk2M {\n  pointer-events: none;\n  background-color: #c25353;\n  border-color: #c25353;\n}\n\n.wcConfigurator-action-Button-uCk2M:hover {\n  background-color: var(--diva-theme-palette-primary-dark);\n  border-color: var(--diva-theme-palette-primary-dark);\n  cursor: pointer;\n  transition:\n    box-shadow 0.3s ease,\n    background-color 0.3s ease,\n    border-color 0.3s ease;\n\n  box-shadow: 0px 1px 4px #707070;\n}\n\n.wcCheckoutButtonPrice-S5Uqm {\n  float: right;\n  margin-right: 10%;\n}\n.wcCheckoutButtonIcon-6TJQ5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2222%22 viewBox%3D%220 0 24 22%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 1H3.70647C4.17122 1 4.57471 1.32018 4.68031 1.77277L5.66667 6M5.66667 6L7.81969 15.2272C7.92529 15.6798 8.32878 16 8.79353 16H19.7192C20.1781 16 20.5781 15.6877 20.6894 15.2425L22.6894 7.24253C22.8472 6.61139 22.3698 6 21.7192 6H5.66667Z%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2210%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2218%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  width: 50%;\n  height: 50%;\n  transform: translate(-50%, -50%);\n  left: 50%;\n  top: 50%;\n  position: absolute;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz {\n  /*auser In die Zusammenfassung wird ausgeblendet*/\n  display: none;\n}\n.landscape-1LGy8 .wcConfigurator-Settings-hidden-kvVds.wcConfigurator-settings-actions-isOnLastStep-BV9rP .wcConfigurator-action-1kRvz {\n  display: none;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz .wcConfigurator-action-Button-uCk2M {\n  line-height: var(--configuratorActionHeight);\n}\n.wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu,\n.portrait-ySRAg .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.wcCheckoutButtonText-AKaeu {\n  float: left;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n}\n";
+var bruttoPrice = "brutto-price-yaDwF";
+var canceled = "canceled-J6Faa";
+var hidden = "hidden-sa4Pc";
+var css_248z = ".wcConfigurator-action-1kRvz {\n  background: rgba(242.2, 242.2, 242.2, 0.9);\n  transition: width 0.2s ease-in-out;\n  display: flex;\n}\n\n.wcConfigurator-action-Button-uCk2M {\n  background-color: var(--primaryColor);\n  background-color: var(--saveButton, var(--primaryColor));\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--saveButton, var(--primaryColor)) solid;\n  border-radius: var(--globalBorderRadius);\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  line-height: 20.8px;\n  font-weight: var(--fontWeight1);\n  height: calc(100% - 2px);\n  font-size: 14px;\n  color: white;\n  flex-grow: 1;\n  -webkit-text-stroke: 0px;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n}\n\n.wcConfigurator-settings-actions-isOnFirstStepDisabled-4PqCh .wcConfigurator-action-Button-uCk2M {\n  pointer-events: none;\n  background-color: #c25353;\n  border-color: #c25353;\n}\n\n.wcConfigurator-action-Button-uCk2M:hover {\n  background-color: var(--diva-theme-palette-primary-dark);\n  border-color: var(--diva-theme-palette-primary-dark);\n  cursor: pointer;\n  transition:\n    box-shadow 0.3s ease,\n    background-color 0.3s ease,\n    border-color 0.3s ease;\n\n  box-shadow: 0px 1px 4px #707070;\n}\n\n.wcCheckoutButtonPrice-S5Uqm {\n  float: right;\n  margin-right: 10%;\n}\n.wcCheckoutButtonIcon-6TJQ5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2222%22 viewBox%3D%220 0 24 22%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 1H3.70647C4.17122 1 4.57471 1.32018 4.68031 1.77277L5.66667 6M5.66667 6L7.81969 15.2272C7.92529 15.6798 8.32878 16 8.79353 16H19.7192C20.1781 16 20.5781 15.6877 20.6894 15.2425L22.6894 7.24253C22.8472 6.61139 22.3698 6 21.7192 6H5.66667Z%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2210%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2218%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  width: 50%;\n  height: 50%;\n  transform: translate(-50%, -50%);\n  left: 50%;\n  top: 50%;\n  position: absolute;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz {\n  /*auser In die Zusammenfassung wird ausgeblendet*/\n  display: none;\n}\n.landscape-1LGy8 .wcConfigurator-Settings-hidden-kvVds.wcConfigurator-settings-actions-isOnLastStep-BV9rP .wcConfigurator-action-1kRvz {\n  display: none;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz .wcConfigurator-action-Button-uCk2M {\n  line-height: var(--configuratorActionHeight);\n}\n.wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu,\n.portrait-ySRAg .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.wcCheckoutButtonText-AKaeu {\n  float: left;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n}\n\n.brutto-price-yaDwF {\n  float: right;\n  position: relative;\n  margin-right: 20px;\n  font-size: 14px;\n  -webkit-font-smoothing: antialiased;\n  -webkit-text-stroke: 0px;\n  line-height: 36.8px;\n  min-width: 64px;\n  text-align: right;\n  font-weight: 300;\n}\n\n.brutto-price-yaDwF.canceled-J6Faa {\n  color: #eee;\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.brutto-price-yaDwF.canceled-J6Faa.hidden-sa4Pc {\n  opacity: 0;\n  max-width: 0px;\n}\n\n.brutto-price-yaDwF.canceled-J6Faa:before {\n  position: absolute;\n  content: '';\n  left: -6px;\n  top: 44%;\n  right: 0;\n  border-top: 2px solid;\n  border-color: grey;\n  transform: rotate(-7deg);\n}\n\n.is-mobile-Zx3zd .brutto-price-yaDwF.canceled-J6Faa:before {\n  top: 45%;\n}\n";
 styleInject(css_248z);
 
 var BasketActionStandard = function BasketActionStandard(_ref) {
-  var _viewHandler$uiState$;
+  var _viewHandler$uiState$, _newBruttoPrice$toStr, _newBruttoPrice$toStr2, _newCurSetPrice$toStr, _newCurSetPrice$toStr2;
   var _ref$buttonTextClassN = _ref.buttonTextClassName,
     buttonTextClassName = _ref$buttonTextClassN === void 0 ? wcCheckoutButtonText : _ref$buttonTextClassN,
     _ref$buttonPriceClass = _ref.buttonPriceClassName,
@@ -42,6 +46,27 @@ var BasketActionStandard = function BasketActionStandard(_ref) {
     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(wcConfiguratorAction, containerClassName),
     children: [showCheckoutButtons && ((_viewHandler$uiState$ = viewHandler.uiState.checkoutConfig) === null || _viewHandler$uiState$ === void 0 ? void 0 : _viewHandler$uiState$.buttons.map(function (b, index) {
@@ -65,13 +90,40 @@ var BasketActionStandard = function BasketActionStandard(_ref) {
       children: [/*#__PURE__*/jsx("div", {
         className: buttonTextClassName,
         children: t('configurator.ADD_TO_BASKET')
-      }), !hidePrices && viewHandler.tabGroupState.curTabGroupType == 'horizontal' && price !== undefined && /*#__PURE__*/jsx("div", {
-        className: buttonPriceClassName,
-        children: DivaUtils.formatPrice(price)
+      }), !hidePrices && price !== undefined && viewHandler.tabGroupState.curTabGroupType == 'horizontal' && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(bruttoPrice, canceled, !viewHandler.productState.formatedBruttoPrice ? hidden : undefined),
+          children: /*#__PURE__*/jsx(CountUp, {
+            end: newBruttoPrice,
+            duration: 0.5,
+            start: oldBruttoPrice,
+            decimals: (_newBruttoPrice$toStr = (_newBruttoPrice$toStr2 = newBruttoPrice.toString().split('.')[1]) === null || _newBruttoPrice$toStr2 === void 0 ? void 0 : _newBruttoPrice$toStr2.length) !== null && _newBruttoPrice$toStr !== void 0 ? _newBruttoPrice$toStr : 0,
+            formattingFn: function formattingFn(n) {
+              return DivaUtils.formatPrice(n, viewHandler.productState.priceFormat);
+            },
+            onEnd: function onEnd() {
+              setOldBruttoPrice(newBruttoPrice);
+            }
+          })
+        }), /*#__PURE__*/jsx("div", {
+          className: buttonPriceClassName,
+          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.priceFormat);
+            },
+            onEnd: function onEnd() {
+              setOldCurSetPrice(newCurSetPrice);
+            }
+          })
+        })]
       })]
     })]
   });
 };
-var BasketActionStandard$1 = observer(BasketActionStandard);
+var BasketAction = observer(BasketActionStandard);
 
-export { BasketActionStandard$1 as default };
+export { BasketAction as default };