@crystaldesign/diva-web-planner-react 26.7.0-rc.2 → 26.7.0-rc.20

package/build/esm/index-74a92979.js

@@ -0,0 +1,138 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-f7d83058.js';
+import { useState } from 'react';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import SettingsItemsWrapper from './index-d4bb2ded.js';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
+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';
+import 'react-switch';
+import 'react-countup';
+import './index-92873e79.js';
+import 'sift';
+import './index-61cfd9e9.js';
+import './index-2bf25633.js';
+import './index-9974cec8.js';
+import './index-e3739463.js';
+import './index.module-bd750f4f.js';
+import './index-93174c43.js';
+import './index-e9973e4c.js';
+import '@mui/icons-material/Block';
+import '@mui/icons-material/Warning';
+import './index-804bd835.js';
+import 'react-dropdown';
+import './index-121983d5.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-bf7deef5.js';
+import './index-9b842bd6.js';
+import './index-20eaa8b7.js';
+import '@crystaldesign/content-box';
+import './index-b98a7ba8.js';
+import './index-838a5824.js';
+import './index-6febf5e1.js';
+import './index-c4ffed21.js';
+import 'swiper/react';
+import 'swiper/modules';
+import './UnlockCard-1dc4872e.js';
+import './index-bd37e38b.js';
+import './index-8fb091dd.js';
+import './index-e14a5b22.js';
+import './index-b02ee363.js';
+import './index-05f82cc9.js';
+import './index-569d1c93.js';
+import 'react-laag';
+import './index.module-cc33d972.js';
+import './index-690f5e32.js';
+import './index-885a243e.js';
+import './index-e4adda60.js';
+import './index-85ab04ec.js';
+import './index-9e66205c.js';
+import './index.module-84c54615.js';
+import './index-2e4dac31.js';
+import './index-84bdef8c.js';
+import './index-ea695579.js';
+import './index-18b6eba6.js';
+import './index-da494df2.js';
+import './index-0d41a98d.js';
+import './index-cedff709.js';
+import './index-6405b5c5.js';
+import './index-13853afe.js';
+import './index-15e0c2f7.js';
+import './index-5be1707f.js';
+import './index-99ea1fb3.js';
+import './index-50ab592c.js';
+import 'rc-slider';
+import './index-32eba5ec.js';
+import './index-71281776.js';
+import './index-11516ada.js';
+import './index-86980bd4.js';
+import './index-654d85b9.js';
+import 'react-confetti-explosion';
+import './index-d5364439.js';
+import './index-b264355c.js';
+import './index-2031e2c6.js';
+import 'react-qr-code';
+import './index-e4b872ca.js';
+import './useCustomDimensions-a9403160.js';
+import './index-1ff570c5.js';
+import './ussIsSticky-0d293a04.js';
+import './index-58ff3534.js';
+import './index-70c7d84a.js';
+import './index-98cf9d4e.js';
+import './index.module-2f8ca2c7.js';
+import './index-35d31711.js';
+import './index-3503a8a8.js';
+import './index-c0cf121e.js';
+import './index-771d19cd.js';
+import './index-bbd0041b.js';
+import './index-3b895e46.js';
+
+var productSettingsWrapper = "product-settings-wrapper-KOweX";
+var scrollWrapper = "scroll-wrapper-DI3EF";
+var closed = "closed-CfRyN";
+var button = "button-ITCqz";
+var move = "move-28sqU";
+var css_248z = ".product-settings-wrapper-KOweX {\n  position: absolute;\n  top: 16px;\n  right: 0px;\n  margin-top: 0px;\n  max-height: 100%;\n  z-index: 290;\n  display: flex;\n}\n\n.scroll-wrapper-DI3EF {\n  overflow: auto;\n  height: auto;\n  background: var(--settingsBackgroundColor);\n  padding: 0 16px;\n  border-radius: var(--globalBorderRadius);\n  width: 270px;\n  transition: width 350ms ease;\n}\n\n.closed-CfRyN .scroll-wrapper-DI3EF {\n  padding: 0;\n  padding: initial;\n}\n\n.button-ITCqz {\n  position: absolute;\n  left: -32px;\n  width: 32px;\n  height: 38px;\n  border-radius: 5px 0 0 5px;\n  transform: rotate(180deg);\n  border-radius: 0 var(--globalBorderRadius) var(--globalBorderRadius) 0;\n  background: var(--secondaryColor) center center / 16px no-repeat url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3Csvg version%3D%221.1%22 id%3D%22Ebene_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 viewBox%3D%220 0 8 13.5%22 style%3D%22enable-background%3Anew 0 0 8 13.5%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg%3E%09%3Cpath class%3D%22st0%22 d%3D%22M6.5%2C11.7c-0.1%2C0-0.2%2C0-0.3-0.1l-5-4.3C1.1%2C7.2%2C1%2C7.1%2C1%2C7c0-0.1%2C0.1-0.3%2C0.2-0.4l5-4.7c0.2-0.2%2C0.5-0.2%2C0.7%2C0%09%09c0.2%2C0.2%2C0.2%2C0.5%2C0%2C0.7L2.3%2C6.9l4.6%2C3.9C7%2C11%2C7.1%2C11.4%2C6.9%2C11.6C6.8%2C11.7%2C6.7%2C11.7%2C6.5%2C11.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.closed-CfRyN .button-ITCqz {\n  position: relative;\n  left: auto;\n  left: initial;\n  border-radius: var(--globalBorderRadius) 0 0 var(--globalBorderRadius);\n  transform: rotate(0deg);\n  background: var(--secondaryColor) center center / 25px no-repeat url(\"data:image/svg+xml,%3Csvg fill%3D%22%23fff%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22  viewBox%3D%220 0 50 50%22 width%3D%2250px%22 height%3D%2250px%22%3E%3Cpath d%3D%22M 22.199219 2 A 1.0001 1.0001 0 0 0 21.214844 2.8339844 L 20.205078 8.796875 C 19.01608 9.1476749 17.903339 9.6072866 16.835938 10.173828 L 11.875 6.6816406 A 1.0001 1.0001 0 0 0 10.59375 6.7929688 L 6.6933594 10.693359 A 1.0001 1.0001 0 0 0 6.5820312 11.974609 L 10.076172 16.939453 C 9.5032306 17.983292 9.0447681 19.109183 8.6992188 20.298828 L 2.8457031 21.212891 A 1.0001 1.0001 0 0 0 2 22.199219 L 2 27.699219 A 1.0001 1.0001 0 0 0 2.8339844 28.685547 L 8.7949219 29.693359 C 9.1451119 30.880887 9.6045402 31.990547 10.169922 33.056641 L 6.6875 37.917969 A 1.0001 1.0001 0 0 0 6.7929688 39.207031 L 10.693359 43.107422 A 1.0001 1.0001 0 0 0 11.974609 43.21875 L 16.939453 39.724609 C 17.985462 40.298683 19.114316 40.757752 20.306641 41.103516 L 21.314453 47.066406 A 1.0001 1.0001 0 0 0 22.300781 47.900391 L 27.800781 47.900391 A 1.0001 1.0001 0 0 0 28.783203 47.082031 L 29.884766 41.107422 C 31.077734 40.756262 32.193186 40.294742 33.263672 39.726562 L 38.224609 43.21875 A 1.0001 1.0001 0 0 0 39.507812 43.107422 L 43.40625 39.207031 A 1.0001 1.0001 0 0 0 43.509766 37.914062 L 39.931641 32.957031 C 40.500209 31.91951 40.957756 30.82106 41.300781 29.693359 L 47.169922 28.685547 A 1.0001 1.0001 0 0 0 48 27.699219 L 48 22.199219 A 1.0001 1.0001 0 0 0 47.166016 21.214844 L 41.199219 20.203125 C 40.855563 19.074235 40.397841 17.973827 39.828125 16.935547 L 43.318359 11.974609 A 1.0001 1.0001 0 0 0 43.207031 10.693359 L 39.306641 6.7929688 A 1.0001 1.0001 0 0 0 38.013672 6.6894531 L 33.052734 10.273438 C 32.009656 9.7017023 30.885686 9.2413677 29.697266 8.8964844 L 28.685547 2.8359375 A 1.0001 1.0001 0 0 0 27.699219 2 L 22.199219 2 z M 23.044922 4 L 26.853516 4 L 27.814453 9.7636719 A 1.0001 1.0001 0 0 0 28.556641 10.570312 C 30.07104 10.948913 31.478126 11.514935 32.675781 12.251953 A 1.0001 1.0001 0 0 0 33.785156 12.210938 L 38.494141 8.8085938 L 41.197266 11.511719 L 37.882812 16.224609 A 1.0001 1.0001 0 0 0 37.847656 17.324219 C 38.584675 18.521874 39.154586 19.937607 39.533203 21.357422 A 1.0001 1.0001 0 0 0 40.333984 22.085938 L 46 23.044922 L 46 26.857422 L 40.429688 27.814453 A 1.0001 1.0001 0 0 0 39.632812 28.542969 C 39.254196 29.962783 38.686237 31.378517 37.949219 32.576172 A 1.0001 1.0001 0 0 0 37.990234 33.685547 L 41.390625 38.394531 L 38.6875 41.097656 L 33.974609 37.78125 A 1.0001 1.0001 0 0 0 32.904297 37.732422 C 31.566632 38.496802 30.2627 39.053466 28.757812 39.429688 A 1.0001 1.0001 0 0 0 28.017578 40.21875 L 26.966797 45.900391 L 23.144531 45.900391 L 22.185547 40.232422 A 1.0001 1.0001 0 0 0 21.443359 39.429688 C 19.92896 39.051088 18.521874 38.485065 17.324219 37.748047 A 1.0001 1.0001 0 0 0 16.224609 37.78125 L 11.511719 41.097656 L 8.8066406 38.392578 L 12.113281 33.783203 A 1.0001 1.0001 0 0 0 12.167969 32.703125 C 11.403582 31.365465 10.846925 30.061529 10.470703 28.556641 A 1.0001 1.0001 0 0 0 9.6660156 27.814453 L 4 26.855469 L 4 23.056641 L 9.5546875 22.1875 A 1.0001 1.0001 0 0 0 10.371094 21.443359 C 10.749694 19.92896 11.313763 18.521874 12.050781 17.324219 A 1.0001 1.0001 0 0 0 12.017578 16.224609 L 8.7011719 11.511719 L 11.412109 8.8027344 L 16.125 12.117188 A 1.0001 1.0001 0 0 0 17.195312 12.167969 C 18.532978 11.403589 19.836909 10.846925 21.341797 10.470703 A 1.0001 1.0001 0 0 0 22.085938 9.6660156 L 23.044922 4 z M 25 17 C 20.570085 17 17 20.570085 17 25 C 17 29.429915 20.570085 33 25 33 C 29.429915 33 33 29.429915 33 25 C 33 20.570085 29.429915 17 25 17 z M 25 19 C 28.370085 19 31 21.629915 31 25 C 31 28.370085 28.370085 31 25 31 C 21.629915 31 19 28.370085 19 25 C 19 21.629915 21.629915 19 25 19 z%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.move-28sqU {\n  width: 0px;\n  overflow: hidden;\n}\n";
+styleInject(css_248z);
+
+var ProductSettings = function ProductSettings(props) {
+  var viewHandler = useViewHandler();
+  var _useState = useState(viewHandler.getIsInMobileView()),
+    _useState2 = _slicedToArray(_useState, 2),
+    isHidden = _useState2[0],
+    setIsHidden = _useState2[1];
+  if (!viewHandler.uiState.ItemsPaletteInProductVisible) return /*#__PURE__*/jsx(Fragment, {});
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(productSettingsWrapper, isHidden ? closed : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      className: classnames(button),
+      onClick: function onClick() {
+        return setIsHidden(!isHidden);
+      }
+    }), /*#__PURE__*/jsx("div", {
+      className: classnames(scrollWrapper, isHidden ? move : undefined),
+      children: /*#__PURE__*/jsx(SettingsItemsWrapper, {
+        itemPalettesArr: viewHandler.settingsState.itemPaletteInProduct.map(function (item) {
+          return item.palette;
+        })
+      })
+    })]
+  });
+};
+var ProductSettings$1 = observer(ProductSettings);
+
+export { ProductSettings$1 as default };

package/build/esm/index-771d19cd.js

@@ -0,0 +1,186 @@
+import { s as styleInject, u as useViewHandler, _ as _onClickCheckout } from './index-f7d83058.js';
+import { observer } from 'mobx-react-lite';
+import { useMemo } from 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/objectWithoutProperties';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var container = "container-jVXha";
+var headline = "headline-wXulF";
+var subheadline = "subheadline-dAJ7Z";
+var dealerCard = "dealerCard-WsUAS";
+var dealerImage = "dealerImage-Wd3ix";
+var dealerContent = "dealerContent-Se-R3";
+var dealerName = "dealerName-z85PP";
+var dealerDescription = "dealerDescription-wPDsN";
+var infoBlock = "infoBlock-i-S-s";
+var contactList = "contactList-vdVHd";
+var contactItem = "contactItem-g32vy";
+var contactIcon = "contactIcon-gLhAV";
+var ctaButton = "ctaButton-0BeyQ";
+var ctaSubtext = "ctaSubtext-ScjcP";
+var css_248z = ".container-jVXha {\n  padding: 16px 0;\n  border-top: 1px solid #e8e3da;\n  border-top: 1px solid var(--galleryItemBorderColor, #e8e3da);\n}\n\n.headline-wXulF {\n  font-size: 18px;\n  font-weight: 300;\n  line-height: 1.3;\n  color: var(--diva-theme-palette-text-primary);\n  margin: 0 0 8px;\n}\n\n.subheadline-dAJ7Z {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.5;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 16px;\n}\n\n.dealerCard-WsUAS {\n  overflow: hidden;\n  border-radius: var(--buttons-border-radius);\n  border: 1px solid #e8e3da;\n  border: 1px solid var(--galleryItemBorderColor, #e8e3da);\n  background: var(--settingsBackgroundColor);\n  margin-bottom: 16px;\n}\n\n.dealerImage-Wd3ix {\n  overflow: hidden;\n  aspect-ratio: 16 / 8;\n}\n\n.dealerImage-Wd3ix img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n  -o-object-position: top center;\n     object-position: top center;\n}\n\n.dealerContent-Se-R3 {\n  padding: 8px 16px;\n}\n\n.dealerName-z85PP {\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-primary);\n  margin: 0 0 4px;\n}\n\n.dealerDescription-wPDsN {\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 12px;\n}\n\n.infoBlock-i-S-s {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.5;\n  color: var(--diva-theme-palette-text-secondary);\n  margin-bottom: 12px;\n  white-space: pre-line;\n}\n\n.contactList-vdVHd {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  border-top: 1px solid #e8e3da;\n  border-top: 1px solid var(--galleryItemBorderColor, #e8e3da);\n  padding-top: 12px;\n}\n\n.contactItem-g32vy {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-secondary);\n}\n\n.contactItem-g32vy a {\n  color: var(--diva-theme-palette-text-secondary);\n  text-decoration: none;\n}\n\n.contactItem-g32vy a:hover {\n  color: var(--diva-theme-palette-primary-main);\n}\n\n.contactIcon-gLhAV {\n  flex-shrink: 0;\n  width: 16px;\n  height: 16px;\n  margin-top: 2px;\n  opacity: 0.6;\n}\n\n.ctaButton-0BeyQ {\n  width: calc(100% - 48px);\n  padding: 14px 24px;\n  font-size: 14px;\n  font-weight: 500;\n  color: #fff;\n  color: var(--diva-theme-palette-primary-contrast-text, #fff);\n  background: var(--diva-theme-palette-primary-main);\n  border: none;\n  border-radius: var(--buttons-border-radius);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  transition:\n    background 0.2s,\n    box-shadow 0.2s;\n}\n\n.ctaButton-0BeyQ:hover {\n  background: var(--diva-theme-palette-primary-dark);\n}\n\n.ctaSubtext-ScjcP {\n  font-size: 12px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-secondary);\n  text-align: center;\n  margin: 8px 0 0;\n}\n";
+styleInject(css_248z);
+
+var AppointmentPreview = function AppointmentPreview() {
+  var _contactData$contactP, _contactData$contactP2;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var organization = viewHandler.uiState.organization;
+  var contactData = useMemo(function () {
+    var data = organization === null || organization === void 0 ? void 0 : organization.additionalContactData;
+    if (!data) return undefined;
+    var arr = Array.isArray(data) ? data : [data];
+    return arr[0];
+  }, [organization === null || organization === void 0 ? void 0 : organization.additionalContactData]);
+  var appointmentButton = useMemo(function () {
+    var config = viewHandler.uiState.checkoutConfig;
+    if (!(config !== null && config !== void 0 && config.buttons)) return undefined;
+    return config.buttons.find(function (b) {
+      return b.type === 'APPOINTMENT';
+    });
+  }, [viewHandler.uiState.checkoutConfig]);
+  var handleCtaClick = function handleCtaClick() {
+    if (appointmentButton) {
+      var _appointmentButton$in;
+      _onClickCheckout(appointmentButton, viewHandler, (_appointmentButton$in = appointmentButton.index) !== null && _appointmentButton$in !== void 0 ? _appointmentButton$in : 0, t, undefined, undefined);
+    }
+  };
+  if (!contactData) return null;
+  var hasContactInfo = contactData.street || contactData.zipCode || contactData.city || contactData.phone || contactData.email;
+  if (!hasContactInfo && !contactData.description && !contactData.info && !contactData.contactPersonName && !contactData.contactPersonImage) return null;
+  return /*#__PURE__*/jsxs("div", {
+    className: container,
+    children: [/*#__PURE__*/jsx("h3", {
+      className: headline,
+      children: t('checkout.appointment.preview.headline', 'Persönliche Beratung vereinbaren')
+    }), /*#__PURE__*/jsx("p", {
+      className: subheadline,
+      children: t('checkout.appointment.preview.subheadline')
+    }), /*#__PURE__*/jsxs("div", {
+      className: dealerCard,
+      children: [((_contactData$contactP = contactData.contactPersonImage) === null || _contactData$contactP === void 0 ? void 0 : _contactData$contactP.url) && /*#__PURE__*/jsx("div", {
+        className: dealerImage,
+        children: /*#__PURE__*/jsx("img", {
+          src: contactData.contactPersonImage.url,
+          alt: (_contactData$contactP2 = contactData.contactPersonName) !== null && _contactData$contactP2 !== void 0 ? _contactData$contactP2 : ''
+        })
+      }), /*#__PURE__*/jsxs("div", {
+        className: dealerContent,
+        children: [(contactData.contactPersonName || contactData.description) && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx("h4", {
+            className: dealerName,
+            children: contactData.contactPersonName
+          }), contactData.description && /*#__PURE__*/jsx("p", {
+            className: dealerDescription,
+            children: contactData.description
+          })]
+        }), contactData.info && /*#__PURE__*/jsx("div", {
+          className: infoBlock,
+          children: contactData.info
+        }), /*#__PURE__*/jsxs("div", {
+          className: contactList,
+          children: [(contactData.street || contactData.zipCode || contactData.city) && /*#__PURE__*/jsxs("a", {
+            className: contactItem,
+            href: "https://www.google.com/maps/search/?api=1&query=".concat(encodeURIComponent([contactData.street, contactData.zipCode, contactData.city].filter(Boolean).join(', '))),
+            target: "_blank",
+            rel: "noopener noreferrer",
+            children: [/*#__PURE__*/jsxs("svg", {
+              className: contactIcon,
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              children: [/*#__PURE__*/jsx("path", {
+                d: "M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"
+              }), /*#__PURE__*/jsx("circle", {
+                cx: "12",
+                cy: "10",
+                r: "3"
+              })]
+            }), /*#__PURE__*/jsxs("div", {
+              children: [contactData.street && /*#__PURE__*/jsx("div", {
+                children: contactData.street
+              }), (contactData.zipCode || contactData.city) && /*#__PURE__*/jsx("div", {
+                children: [contactData.zipCode, contactData.city].filter(Boolean).join(' ')
+              })]
+            })]
+          }), contactData.phone && /*#__PURE__*/jsxs("div", {
+            className: contactItem,
+            children: [/*#__PURE__*/jsx("svg", {
+              className: contactIcon,
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              children: /*#__PURE__*/jsx("path", {
+                d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"
+              })
+            }), /*#__PURE__*/jsx("a", {
+              href: "tel:".concat(contactData.phone.replace(/\s/g, '')),
+              children: contactData.phone
+            })]
+          }), contactData.email && /*#__PURE__*/jsxs("div", {
+            className: contactItem,
+            children: [/*#__PURE__*/jsxs("svg", {
+              className: contactIcon,
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              children: [/*#__PURE__*/jsx("path", {
+                d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"
+              }), /*#__PURE__*/jsx("path", {
+                d: "M22 6l-10 7L2 6"
+              })]
+            }), /*#__PURE__*/jsx("a", {
+              href: "mailto:".concat(contactData.email),
+              children: contactData.email
+            })]
+          })]
+        })]
+      })]
+    }), appointmentButton && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsxs("button", {
+        type: "button",
+        className: ctaButton,
+        onClick: handleCtaClick,
+        children: [t('checkout.appointment.preview.cta', 'Persönliche Beratung vereinbaren'), /*#__PURE__*/jsx("svg", {
+          width: "16",
+          height: "16",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          children: /*#__PURE__*/jsx("path", {
+            d: "M5 12h14M12 5l7 7-7 7"
+          })
+        })]
+      }), /*#__PURE__*/jsx("p", {
+        className: ctaSubtext,
+        children: t('checkout.appointment.preview.ctaSubtext')
+      })]
+    })]
+  });
+};
+var AppointmentPreview$1 = observer(AppointmentPreview);
+
+export { AppointmentPreview$1 as default };

package/build/esm/index-7885d391.js

@@ -0,0 +1,160 @@
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-f7d83058.js';
+import { useState, useEffect } from 'react';
+import Collapsible from 'react-collapsible';
+import SubTabGroupHeader from './index-fd624ef4.js';
+import { observer } from 'mobx-react-lite';
+import SettingsItemsWrapper from './index-d4bb2ded.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+import './index-92873e79.js';
+import 'sift';
+import './index-61cfd9e9.js';
+import './index-2bf25633.js';
+import './index-9974cec8.js';
+import './index-e3739463.js';
+import './index.module-bd750f4f.js';
+import './index-93174c43.js';
+import './index-e9973e4c.js';
+import '@mui/icons-material/Block';
+import '@mui/icons-material/Warning';
+import './index-804bd835.js';
+import 'react-dropdown';
+import './index-121983d5.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-bf7deef5.js';
+import './index-9b842bd6.js';
+import './index-20eaa8b7.js';
+import '@crystaldesign/content-box';
+import './index-b98a7ba8.js';
+import './index-838a5824.js';
+import './index-6febf5e1.js';
+import './index-c4ffed21.js';
+import 'swiper/react';
+import 'swiper/modules';
+import './UnlockCard-1dc4872e.js';
+import './index-bd37e38b.js';
+import './index-8fb091dd.js';
+import './index-e14a5b22.js';
+import './index-b02ee363.js';
+import './index-05f82cc9.js';
+import './index-569d1c93.js';
+import 'react-laag';
+import './index.module-cc33d972.js';
+import './index-690f5e32.js';
+import './index-885a243e.js';
+import './index-e4adda60.js';
+import './index-85ab04ec.js';
+import './index-9e66205c.js';
+import './index.module-84c54615.js';
+import './index-2e4dac31.js';
+import './index-84bdef8c.js';
+import './index-ea695579.js';
+import './index-18b6eba6.js';
+import './index-da494df2.js';
+import './index-0d41a98d.js';
+import './index-cedff709.js';
+import './index-6405b5c5.js';
+import './index-13853afe.js';
+import './index-15e0c2f7.js';
+import './index-5be1707f.js';
+import './index-99ea1fb3.js';
+import './index-50ab592c.js';
+import 'rc-slider';
+import './index-32eba5ec.js';
+import './index-71281776.js';
+import './index-11516ada.js';
+import './index-86980bd4.js';
+import './index-654d85b9.js';
+import 'react-confetti-explosion';
+import './index-d5364439.js';
+import './index-b264355c.js';
+import './index-2031e2c6.js';
+import 'react-qr-code';
+import './index-e4b872ca.js';
+import './useCustomDimensions-a9403160.js';
+import './index-1ff570c5.js';
+import './ussIsSticky-0d293a04.js';
+import './index-58ff3534.js';
+import './index-70c7d84a.js';
+import './index-98cf9d4e.js';
+import './index.module-2f8ca2c7.js';
+import './index-35d31711.js';
+import './index-3503a8a8.js';
+import './index-c0cf121e.js';
+import './index-771d19cd.js';
+import './index-bbd0041b.js';
+import './index-3b895e46.js';
+
+var collapsableOuter = "collapsable-outer-udXIP";
+var css_248z = ".collapsable-outer-udXIP {\n  overflow: visible !important;\n}\n.collapsable-outer-udXIP {\n  height: auto;\n  transition: none 0s ease 0s;\n}\n";
+styleInject(css_248z);
+
+var SubTabgroup = function SubTabgroup(_ref) {
+  var _viewHandler$getViewC, _viewHandler$getViewC2;
+  var itemPalettesOfArticle = _ref.itemPalettesOfArticle,
+    zIndexBase = _ref.zIndexBase;
+  var viewHandler = useViewHandler();
+  var _useState = useState(!!((_viewHandler$getViewC = viewHandler.getViewConfig()) !== null && _viewHandler$getViewC !== void 0 && _viewHandler$getViewC.selectAccessoiresWithToggle)),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var basketIds = Object.keys(itemPalettesOfArticle);
+  var _useState3 = useState('ALL'),
+    _useState4 = _slicedToArray(_useState3, 2),
+    curTab = _useState4[0],
+    setCurTab = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    tabs = _useState6[0],
+    setTabs = _useState6[1];
+  var _useState7 = useState(itemPalettesOfArticle[basketIds[0]]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    itemPalettes = _useState8[0],
+    setItemPalettes = _useState8[1];
+  useEffect(function () {
+    var _itemPalettesOfArticl;
+    var actPalettes = (_itemPalettesOfArticl = itemPalettesOfArticle[curTab == 'ALL' ? basketIds[0] : curTab]) !== null && _itemPalettesOfArticl !== void 0 ? _itemPalettesOfArticl : {};
+    Object.values(actPalettes).map(function (p) {
+      return p.configAllMode = curTab == 'ALL' ? basketIds : undefined;
+    });
+    setItemPalettes(actPalettes);
+    setTabs(['ALL'].concat(_toConsumableArray(basketIds.length > 1 ? basketIds : [])));
+    if (!tabs.includes(curTab)) setCurTab(tabs[0]);
+  }, [itemPalettesOfArticle, curTab]);
+  return /*#__PURE__*/jsx(Collapsible, {
+    trigger: (_viewHandler$getViewC2 = viewHandler.getViewConfig()) !== null && _viewHandler$getViewC2 !== void 0 && _viewHandler$getViewC2.selectAccessoiresWithToggle ? /*#__PURE__*/jsx(Fragment, {}) : /*#__PURE__*/jsx(SubTabGroupHeader, {
+      tabs: tabs,
+      openState: [isOpen, setIsOpen],
+      curState: [curTab, setCurTab]
+    }),
+    contentOuterClassName: isOpen ? collapsableOuter : undefined,
+    easing: "ease",
+    open: isOpen,
+    triggerDisabled: isOpen,
+    children: /*#__PURE__*/jsx(SettingsItemsWrapper, {
+      itemPalettesArr: Object.values(itemPalettes),
+      zIndexBase: zIndexBase
+    })
+  });
+};
+var SubTabGroup = observer(SubTabgroup);
+
+export { SubTabGroup as default };

package/build/esm/index-78bbea01.js

@@ -0,0 +1,33 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-f7d83058.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@crystaldesign/diva-core';
+import 'mobx-react-lite';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/objectWithoutProperties';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+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 ItemVariant = function ItemVariant(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "TabGroup/TabGroupHorizontal/item"
+  }));
+};
+
+export { ItemVariant as default };

package/build/esm/index-792e4e98.js

@@ -0,0 +1,48 @@
+import './index-f7d83058.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/objectWithoutProperties';
+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';
+import 'react-switch';
+import 'react-countup';
+
+var BoxCopy = function BoxCopy(_ref) {
+  var rect = _ref.rect,
+    item = _ref.item,
+    plannerUIProps = _ref.plannerUIProps,
+    invertLeftRight = _ref.invertLeftRight;
+  return /*#__PURE__*/jsx("div", {
+    onClick: function onClick() {
+      var _item$clickFunction;
+      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId), {
+        x: item.type == 'BoxCopyLeft' ? -1 : item.type == 'BoxCopyRight' ? 1 : 0,
+        y: item.type == 'BoxCopyTop' ? 1 : 0,
+        z: 0
+      });
+    },
+    style: {
+      left: rect.left + '%',
+      top: 100 - rect.top + '%'
+    },
+    className: classnames(plannerUIProps.classes.buttonGeneral, plannerUIProps.classes.copy.BoxPlannerCopy.copyGlobal, item.type == 'BoxCopyLeft' ? invertLeftRight ? plannerUIProps.classes.copy.BoxPlannerCopy.copyRight : plannerUIProps.classes.copy.BoxPlannerCopy.copyLeft : undefined, item.type == 'BoxCopyTop' ? plannerUIProps.classes.copy.BoxPlannerCopy.copyTop : undefined, item.type == 'BoxCopyRight' ? invertLeftRight ? plannerUIProps.classes.copy.BoxPlannerCopy.copyLeft : plannerUIProps.classes.copy.BoxPlannerCopy.copyRight : undefined)
+  });
+};
+var BoxCopy$1 = observer(BoxCopy);
+
+export { BoxCopy$1 as default };