@crystaldesign/diva-web-planner-react 25.5.0-beta.35 → 25.5.0-beta.37

package/build/esm/index-ea976f38.js

@@ -0,0 +1,139 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-50519ff7.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useState, useEffect } from 'react';
+import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import ProductHeaderFunction from './index-f52a61ff.js';
+import { ContentBoxComponent } from '@crystaldesign/content-box';
+import ContentItemWrapper from './index-1ad3e828.js';
+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 '@crystaldesign/widget-contact-form';
+import '@crystaldesign/content-item';
+import 'react-draggable';
+
+var wrapper = "wrapper-y4VmL";
+var wcConfiguratorProductHeader = "wcConfiguratorProductHeader-W1oWZ";
+var portrait = "portrait-Otsjq";
+var expanded = "expanded-rNRc-";
+var functionWrapper = "functionWrapper-3sgkI";
+var landscape = "landscape-TuCY-";
+var contentBoxWrapper = "content-box-wrapper-KgSZb";
+var maxExpanded = "max-Expanded-4m94C";
+var textbackground = "textbackground-F3b8W";
+var wcPriceinfo = "wcPriceinfo-Zmaer";
+var wcFormattedprice = "wcFormattedprice-sdLxf";
+var wcFormattedBruttoPrice = "wc-formatted-brutto-price-MDFl1";
+var fullscreen = "fullscreen-94axf";
+var room = "room-NxmMf";
+var css_248z = "/* Productdaten */\n\n.wrapper-y4VmL {\n  display: flex;\n  flex-direction: row;\n  height: 70px;\n  z-index: 112;\n  transition:\n    width 0.2s ease-in-out,\n    opacity 0.5s ease-in-out;\n  opacity: 1;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 50%;\n  justify-self: flex-start;\n  z-index: 300;\n  margin: 16px 0 16px 16px;\n  pointer-events: none;\n}\n.portrait-Otsjq .wcConfiguratorProductHeader-W1oWZ {\n  margin: 12px 0 16px 16px;\n}\n\n.expanded-rNRc- .wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 100%;\n}\n.functionWrapper-3sgkI {\n  flex-basis: 50%;\n}\n\n.functionWrapper-3sgkI {\n  flex-basis: 100%;\n  position: relative;\n  z-index: 112;\n  margin: 16px;\n}\n.portrait-Otsjq .functionWrapper-3sgkI {\n  margin: 6px 12px;\n}\n\n.landscape-TuCY- .functionWrapper-3sgkI {\n  margin: 8px 12px 0px 0px;\n}\n\n.content-box-wrapper-KgSZb {\n  z-index: 112;\n}\n\n.expanded-rNRc-.wrapper-y4VmL {\n  width: calc(55% - 40px - 24px);\n}\n\n.max-Expanded-4m94C.wrapper-y4VmL,\n.settings-Foldedup-HM7JT.wrapper-y4VmL {\n  opacity: 0;\n}\n\n.wrapper-y4VmL h1 {\n  font-weight: 300;\n  font-size: 24px;\n  line-height: 27.2px;\n  text-transform: uppercase;\n  letter-spacing: 0.2px;\n  color: var(--secondaryColor);\n  margin: 0 0 10px;\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  white-space: nowrap;\n\n  border-radius: 100px;\n  width: -moz-fit-content;\n  width: fit-content;\n}\n.textbackground-F3b8W {\n  border-radius: 0px 0px 12px 0px;\n  padding: 0px 12px 6px 16px;\n  position: absolute;\n  width: -moz-fit-content;\n  width: fit-content;\n  white-space: nowrap;\n  left: 0px;\n}\n\n.portrait-Otsjq .textbackground-F3b8W {\n  margin-top: 5px;\n\n  background-color: transparent;\n}\n\n.expanded-rNRc-.wrapper-y4VmL h1 {\n  max-width: 300px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.wcPriceinfo-Zmaer {\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  font-weight: 300;\n  -webkit-text-stroke: 0.4px;\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}\n\n.wcFormattedprice-sdLxf {\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  -webkit-text-stroke: 0.4px;\n  margin: 0px;\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}\n\n.wc-formatted-brutto-price-MDFl1 {\n  position: relative;\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  -webkit-text-stroke: 0.4px;\n  margin: 0px 10px;\n}\n\n.wc-formatted-brutto-price-MDFl1:before {\n  position: absolute;\n  content: '';\n  left: 0;\n  top: 50%;\n  right: 0;\n  border-top: 1px solid;\n  border-color: inherit;\n\n  transform: rotate(5deg);\n}\n\n.landscape-TuCY-.wrapper-y4VmL {\n  margin-left: 2rem;\n  width: calc(100% - 1rem);\n  height: 54.4px;\n}\n\n.fullscreen-94axf.landscape-TuCY-.wrapper-y4VmL {\n  left: 50px;\n  top: 0px;\n  margin-left: 0.5rem;\n  margin-top: 4px;\n  width: calc(100% - 1rem);\n  height: 24.4px;\n}\n\n.landscape-TuCY- h1 {\n  margin: 0px;\n  margin-top: 14.4px;\n  font-size: 22.4px;\n  line-height: 18px;\n  width: 67%;\n}\n.landscape-TuCY- h2 {\n  margin: 0;\n  margin: initial;\n  font-weight: 100;\n  width: 67%;\n  line-height: 0.65;\n  -webkit-text-stroke: 0.3px;\n}\n.landscape-TuCY- .wcPriceinfo-Zmaer {\n  font-size: 15.6px;\n}\n\n.landscape-TuCY- .wcFormattedprice-sdLxf {\n  font-size: 15.6px;\n}\n\n.portrait-Otsjq.wrapper-y4VmL {\n  height: 54.4px;\n  width: calc(100% - 4px);\n}\n\n.portrait-Otsjq h1 {\n  margin: 0px;\n  font-size: 17px;\n  line-height: 20px;\n}\n\n.portrait-Otsjq.room-NxmMf h1,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf h1 {\n  color: var(--secondaryColor);\n  text-shadow: 3px 4px 15px #000000;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n}\n\n.portrait-Otsjq.room-NxmMf .wcPriceinfo-Zmaer,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf .wcPriceinfo-Zmaer,\n.portrait-Otsjq.room-NxmMf .wcFormattedprice-sdLxf,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf .wcFormattedprice-sdLxf {\n  color: white;\n}\n\n.portrait-Otsjq h2 {\n  margin: 0;\n  margin: initial;\n  font-weight: 100;\n  width: 67%;\n  line-height: 0.65;\n}\n";
+styleInject(css_248z);
+
+var ProductHeader = function ProductHeader(_ref) {
+  var hidePrice = _ref.hidePrice,
+    productClass = _ref.productClass;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useDivaCore = useDivaCore(),
+    _useDivaCore$state = _useDivaCore.state,
+    hidePrices = _useDivaCore$state.hidePrices,
+    _useDivaCore$state$di = _useDivaCore$state.dimensions,
+    isMobile = _useDivaCore$state$di.isMobile,
+    isTablet = _useDivaCore$state$di.isTablet;
+  var headerContentBoxProps = viewHandler.getViewConfig().productHeaderContentBox;
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    dimensions = _useState2[0],
+    setDimensions = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    dimOnlyForOneArticle = _useState4[0],
+    setDimOnlyForOneArticle = _useState4[1];
+  var hideWebConfiguratorTitle = viewHandler.getViewConfig().hideWebConfiguratorTitle || viewHandler.getViewConfig().hideWebConfiguratorTitleInMobile && viewHandler.getIsInMobileView();
+  useEffect(function () {
+    var _viewHandler$productS;
+    if (isMobile && !isTablet || !viewHandler.divaWebPlanner.actSet()) return;
+    (_viewHandler$productS = viewHandler.productState.customDimensions) === null || _viewHandler$productS === void 0 || _viewHandler$productS.then(function (res) {
+      setDimensions(res);
+      var dict = res.reduce(function (basketIdsDict, d) {
+        if (!basketIdsDict[d.dimensionId]) {
+          basketIdsDict[d.dimensionId] = [d.dimension];
+        } else if (!basketIdsDict[d.dimensionId].includes(d.dimension)) basketIdsDict[d.dimensionId].push(d.dimension);
+        return basketIdsDict;
+      }, {});
+      setDimOnlyForOneArticle(!Object.values(dict).find(function (v) {
+        return v.length > 1;
+      }));
+    });
+  }, [viewHandler.divaWebPlanner.actSet(), viewHandler.settingsState.configChanged]);
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wrapper, productClass, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? maxExpanded : undefined, viewHandler.productState.plannerRenderingIsStaticBG ? room : undefined, fullscreen),
+    children: [/*#__PURE__*/jsxs("div", {
+      className: wcConfiguratorProductHeader,
+      "data-test-id": "configProductHeader",
+      children: [!hideWebConfiguratorTitle && /*#__PURE__*/jsx("h1", {
+        "data-test-id": "productHeaderTitle",
+        children: viewHandler.productState.webConifguratorTitle
+      }), /*#__PURE__*/jsxs("div", {
+        className: textbackground,
+        children: [!hidePrices && !hidePrice && /*#__PURE__*/jsxs("div", {
+          children: [/*#__PURE__*/jsxs("span", {
+            className: wcPriceinfo,
+            "data-test-id": "productHeaderPriceInfo",
+            children: [' ', t('configurator.PRICE_INFO'), ':']
+          }), /*#__PURE__*/jsxs("span", {
+            className: wcFormattedprice,
+            "data-test-id": "productHeaderFormattedPrice",
+            children: [' ', viewHandler.productState.formatedCurSetPrice]
+          }), viewHandler.productState.formatedBruttoPrice && !viewHandler.getViewConfig().hideRabattPrice && /*#__PURE__*/jsxs("span", {
+            className: wcFormattedBruttoPrice,
+            "data-test-id": "productHeaderFormattedBruttoPrice",
+            children: [' ', viewHandler.productState.formatedBruttoPrice]
+          })]
+        }), !!(dimensions !== null && dimensions !== void 0 && dimensions.length) && dimensions.map(function (dimension) {
+          var _dimension$text, _dimension$dimension;
+          return /*#__PURE__*/jsxs("div", {
+            children: [/*#__PURE__*/jsxs("span", {
+              className: wcPriceinfo,
+              children: [(_dimension$text = dimension.text) !== null && _dimension$text !== void 0 ? _dimension$text : t('configurator.headerdimension.' + dimension.dimensionId), !dimOnlyForOneArticle && ' (' + dimension.posNrs.join(',') + ')', ":", ' ']
+            }), /*#__PURE__*/jsxs("span", {
+              className: wcFormattedprice,
+              children: [(_dimension$dimension = dimension.dimension) !== null && _dimension$dimension !== void 0 ? _dimension$dimension : 0, " ", dimension.unit]
+            })]
+          });
+        })]
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: functionWrapper,
+      children: /*#__PURE__*/jsx(ProductHeaderFunction, {})
+    }), !viewHandler.uiState.isMobileLandscape && viewHandler.productState.currentBanner && /*#__PURE__*/jsx("div", {
+      className: contentBoxWrapper,
+      children: /*#__PURE__*/jsx(ContentItemWrapper, {
+        noWrapper: true,
+        id: viewHandler.productState.currentBanner.contentItemId
+      })
+    }), headerContentBoxProps && !viewHandler.uiState.isMobileLandscape && !viewHandler.productState.currentBanner && /*#__PURE__*/jsx("div", {
+      className: contentBoxWrapper,
+      children: /*#__PURE__*/jsx(ContentBoxComponent, {
+        settings: {
+          contentBoxProps: headerContentBoxProps
+        }
+      })
+    })]
+  });
+};
+var ProductHeader$1 = observer(ProductHeader);
+
+export { ProductHeader$1 as default };

package/build/esm/index-eaac9371.js

@@ -0,0 +1,39 @@
+import { s as styleInject } from './index-50519ff7.js';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import 'mobx-react-lite';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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 '@crystaldesign/widget-contact-form';
+
+var pdfButton = "pdfButton-4l4zL";
+var css_248z = ".pdfButton-4l4zL {\n  border-radius: 50%;\n  border: solid 2px var(--primaryColor);\n  width: 26px;\n  height: 26px;\n  cursor: pointer;\n  margin-left: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.pdfButton-4l4zL img {\n  width: 80%;\n}\n";
+styleInject(css_248z);
+
+var pdfIcon = "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224px%22%20fill%3D%22%23000000%22%3E%3Cpath%20d%3D%22M0%200h24v24H0V0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M20%202H8c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h12c1.1%200%202-.9%202-2V4c0-1.1-.9-2-2-2zm0%2014H8V4h12v12zM4%206H2v14c0%201.1.9%202%202%202h14v-2H4V6zm12%206V9c0-.55-.45-1-1-1h-2v5h2c.55%200%201-.45%201-1zm-2-3h1v3h-1V9zm4%202h1v-1h-1V9h1V8h-2v5h1zm-8%200h1c.55%200%201-.45%201-1V9c0-.55-.45-1-1-1H9v5h1v-2zm0-2h1v1h-1V9z%22%2F%3E%3C%2Fsvg%3E";
+
+var PDFButton = function PDFButton(_ref) {
+  var pdfUrl = _ref.pdfUrl;
+  return /*#__PURE__*/jsx("div", {
+    className: pdfButton,
+    onClick: function onClick() {
+      return window.open(pdfUrl, '_blank');
+    },
+    children: /*#__PURE__*/jsx("img", {
+      src: pdfIcon
+    })
+  });
+};
+
+export { PDFButton as default };

package/build/esm/index-ee78add7.js

@@ -0,0 +1,48 @@
+import { a as usePlannerUIHandler } from './index-50519ff7.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/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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 '@crystaldesign/widget-contact-form';
+
+var AVL = function AVL(_ref) {
+  var rect = _ref.rect,
+    item = _ref.item,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  var plannerUIHandler = usePlannerUIHandler();
+  var iconIsSelected = plannerUIHandler.getDPUIISSelected(item);
+  var rotation = (item.rotOfElement ? item.rotOfElement : 0) + (item.iconRotDeg ? item.iconRotDeg : 0);
+  return /*#__PURE__*/jsx("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    onClick: function onClick() {
+      var _item$clickFunction;
+      plannerUIHandler.setDPUISelectionChanged(item, !iconIsSelected);
+      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId), item.dpId, !iconIsSelected, undefined);
+    },
+    style: {
+      left: rect.left + 'px',
+      top: rect.top + 'px',
+      transform: 'rotate(' + rotation + 'deg)'
+    },
+    className: classnames(plannerUIProps.classes.buttonGeneral, plannerUIProps.classes.dockingPoint.AVL.avl, iconIsSelected ? plannerUIProps.classes.dockingPoint.AVL.avlSel : undefined)
+  });
+};
+var AVL$1 = observer(AVL);
+
+export { AVL$1 as default };

package/build/esm/index-ee84d904.js

@@ -0,0 +1,211 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import './index-50519ff7.js';
+import { useState } from 'react';
+import { QRCodeSVG } from 'qrcode.react';
+import { a as infoText, b as bottomInfoText, h as horizontalLine, g as gridWrapper } from './index.module-f9f27b59.js';
+import { b as button, a as inverted, P as iconTextButton, e as icon, Q as facebook, R as linkedin, p as message, S as twitter } from './index.module-49f5aab7.js';
+import classnames from 'classnames';
+import { getLogger, useTranslation } from '@crystaldesign/diva-core';
+import { UtmSource, UTMUtils, UtmMedium, UtmCampaign } from '@crystaldesign/diva-utils';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import 'mobx-react-lite';
+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 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@crystaldesign/widget-contact-form';
+
+var WhatsappLogo = "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20175.216%20175.552%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22b%22%20x1%3D%2285.915%22%20x2%3D%2286.535%22%20y1%3D%2232.567%22%20y2%3D%22137.092%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%2357d163%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2323b33a%22%2F%3E%3C%2FlinearGradient%3E%3Cfilter%20id%3D%22a%22%20width%3D%221.115%22%20height%3D%221.114%22%20x%3D%22-.057%22%20y%3D%22-.057%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeGaussianBlur%20stdDeviation%3D%223.531%22%2F%3E%3C%2Ffilter%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22%23b3b3b3%22%20d%3D%22m54.532%20138.45%202.235%201.324c9.387%205.571%2020.15%208.518%2031.126%208.523h.023c33.707%200%2061.139-27.426%2061.153-61.135.006-16.335-6.349-31.696-17.895-43.251A60.75%2060.75%200%200%200%2087.94%2025.983c-33.733%200-61.166%2027.423-61.178%2061.13a60.98%2060.98%200%200%200%209.349%2032.535l1.455%202.312-6.179%2022.558zm-40.811%2023.544L24.16%20123.88c-6.438-11.154-9.825-23.808-9.821-36.772.017-40.556%2033.021-73.55%2073.578-73.55%2019.681.01%2038.154%207.669%2052.047%2021.572s21.537%2032.383%2021.53%2052.037c-.018%2040.553-33.027%2073.553-73.578%2073.553h-.032c-12.313-.005-24.412-3.094-35.159-8.954zm0%200%22%20filter%3D%22url%28%23a%29%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m12.966%20161.238%2010.439-38.114a73.42%2073.42%200%200%201-9.821-36.772c.017-40.556%2033.021-73.55%2073.578-73.55%2019.681.01%2038.154%207.669%2052.047%2021.572s21.537%2032.383%2021.53%2052.037c-.018%2040.553-33.027%2073.553-73.578%2073.553h-.032c-12.313-.005-24.412-3.094-35.159-8.954z%22%2F%3E%3Cpath%20fill%3D%22url%28%23linearGradient1780%29%22%20d%3D%22M87.184%2025.227c-33.733%200-61.166%2027.423-61.178%2061.13a60.98%2060.98%200%200%200%209.349%2032.535l1.455%202.312-6.179%2022.559%2023.146-6.069%202.235%201.324c9.387%205.571%2020.15%208.518%2031.126%208.524h.023c33.707%200%2061.14-27.426%2061.153-61.135a60.75%2060.75%200%200%200-17.895-43.251%2060.75%2060.75%200%200%200-43.235-17.929z%22%2F%3E%3Cpath%20fill%3D%22url%28%23b%29%22%20d%3D%22M87.184%2025.227c-33.733%200-61.166%2027.423-61.178%2061.13a60.98%2060.98%200%200%200%209.349%2032.535l1.455%202.313-6.179%2022.558%2023.146-6.069%202.235%201.324c9.387%205.571%2020.15%208.517%2031.126%208.523h.023c33.707%200%2061.14-27.426%2061.153-61.135a60.75%2060.75%200%200%200-17.895-43.251%2060.75%2060.75%200%200%200-43.235-17.928z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M68.772%2055.603c-1.378-3.061-2.828-3.123-4.137-3.176l-3.524-.043c-1.226%200-3.218.46-4.902%202.3s-6.435%206.287-6.435%2015.332%206.588%2017.785%207.506%2019.013%2012.718%2020.381%2031.405%2027.75c15.529%206.124%2018.689%204.906%2022.061%204.6s10.877-4.447%2012.408-8.74%201.532-7.971%201.073-8.74-1.685-1.226-3.525-2.146-10.877-5.367-12.562-5.981-2.91-.919-4.137.921-4.746%205.979-5.819%207.206-2.144%201.381-3.984.462-7.76-2.861-14.784-9.124c-5.465-4.873-9.154-10.891-10.228-12.73s-.114-2.835.808-3.751c.825-.824%201.838-2.147%202.759-3.22s1.224-1.84%201.836-3.065.307-2.301-.153-3.22-4.032-10.011-5.666-13.647%22%2F%3E%3C%2Fsvg%3E";
+
+var TelegramLogo = "data:image/svg+xml,%3Csvg%20id%3D%22Livello_1%22%20data-name%3D%22Livello%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%20240%20240%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22linear-gradient%22%20x1%3D%22120%22%20y1%3D%22240%22%20x2%3D%22120%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%231d93d2%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2338b0e3%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Ctitle%3ETelegram_logo%3C%2Ftitle%3E%3Ccircle%20cx%3D%22120%22%20cy%3D%22120%22%20r%3D%22120%22%20fill%3D%22url%28%23linear-gradient%29%22%2F%3E%3Cpath%20d%3D%22M81.229%2C128.772l14.237%2C39.406s1.78%2C3.687%2C3.686%2C3.687%2C30.255-29.492%2C30.255-29.492l31.525-60.89L81.737%2C118.6Z%22%20fill%3D%22%23c8daea%22%2F%3E%3Cpath%20d%3D%22M100.106%2C138.878l-2.733%2C29.046s-1.144%2C8.9%2C7.754%2C0%2C17.415-15.763%2C17.415-15.763%22%20fill%3D%22%23a9c6d8%22%2F%3E%3Cpath%20d%3D%22M81.486%2C130.178%2C52.2%2C120.636s-3.5-1.42-2.373-4.64c.232-.664.7-1.229%2C2.1-2.2%2C6.489-4.523%2C120.106-45.36%2C120.106-45.36s3.208-1.081%2C5.1-.362a2.766%2C2.766%2C0%2C0%2C1%2C1.885%2C2.055%2C9.357%2C9.357%2C0%2C0%2C1%2C.254%2C2.585c-.009.752-.1%2C1.449-.169%2C2.542-.692%2C11.165-21.4%2C94.493-21.4%2C94.493s-1.239%2C4.876-5.678%2C5.043A8.13%2C8.13%2C0%2C0%2C1%2C146.1%2C172.5c-8.711-7.493-38.819-27.727-45.472-32.177a1.27%2C1.27%2C0%2C0%2C1-.546-.9c-.093-.469.417-1.05.417-1.05s52.426-46.6%2C53.821-51.492c.108-.379-.3-.566-.848-.4-3.482%2C1.281-63.844%2C39.4-70.506%2C43.607A3.21%2C3.21%2C0%2C0%2C1%2C81.486%2C130.178Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E";
+
+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 LOG = getLogger('Planner', 'WEB-PLANNER-REACT');
+var ShareViaSocialMedias = function ShareViaSocialMedias(_ref) {
+  var url = _ref.url,
+    _ref$config = _ref.config,
+    _ref$config$title = _ref$config.title,
+    ti = _ref$config$title === void 0 ? '' : _ref$config$title,
+    _ref$config$text = _ref$config.text,
+    te = _ref$config$text === void 0 ? '' : _ref$config$text;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var title = t(ti);
+  var text = t(te);
+  var shareContent = {
+    text: text,
+    title: title,
+    url: url
+  };
+  var _useState = useState('WHATSAPP'),
+    _useState2 = _slicedToArray(_useState, 2),
+    shareVia = _useState2[0],
+    setShareVia = _useState2[1];
+  var utmSource = shareVia == 'WHATSAPP' ? UtmSource.WHATSAPP : UtmSource.TELEGRAM;
+  var utm = new UTMUtils(utmSource, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+  var fullUrl = utm.addUtmParams(url);
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("div", {
+      className: infoText,
+      children: t('checkout.share_social.share_whatsapp')
+    }), /*#__PURE__*/jsx(QRCodeSVG, {
+      size: 200,
+      minVersion: 6,
+      value: shareVia == 'WHATSAPP' ? 'https://wa.me/?text=' + encodeURIComponent("".concat(text, "\n").concat(fullUrl)) : 'https://t.me/share/url?url=' + encodeURIComponent(fullUrl) + '&text=' + encodeURIComponent(text),
+      style: {
+        cursor: 'pointer'
+      },
+      onClick: function onClick() {
+        return shareSocial(shareVia == 'WHATSAPP' ? 'whatsapp' : 'telegram', shareContent, true);
+      },
+      imageSettings: {
+        src: shareVia == 'WHATSAPP' ? WhatsappLogo : TelegramLogo,
+        height: 40,
+        width: 40,
+        excavate: true
+      }
+    }), /*#__PURE__*/jsx("div", {
+      className: bottomInfoText,
+      children: t(shareVia == 'WHATSAPP' ? 'checkout.share_social.text_whatsapp' : 'checkout.share_social.text_telegram')
+    }), /*#__PURE__*/jsx("button", {
+      className: classnames(button, inverted),
+      onClick: function onClick() {
+        return shareSocial(shareVia == 'WHATSAPP' ? 'whatsapp' : 'telegram', shareContent);
+      },
+      children: t(shareVia == 'WHATSAPP' ? 'checkout.share_social.text_whatsapp2' : 'checkout.share_social.text_telegram2')
+    }), /*#__PURE__*/jsx("div", {
+      className: horizontalLine
+    }), /*#__PURE__*/jsx("div", {
+      className: infoText,
+      children: t('checkout.share_social.other_socials')
+    }), /*#__PURE__*/jsxs("div", {
+      className: gridWrapper,
+      children: [/*#__PURE__*/jsxs("button", {
+        className: classnames(button, iconTextButton),
+        onClick: function onClick() {
+          return shareSocial('facebook', shareContent);
+        },
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, facebook)
+        }), /*#__PURE__*/jsx("div", {
+          children: "Facebook"
+        })]
+      }), /*#__PURE__*/jsxs("button", {
+        className: classnames(button, iconTextButton),
+        onClick: function onClick() {
+          return shareSocial('linkedin', shareContent);
+        },
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, linkedin)
+        }), /*#__PURE__*/jsx("div", {
+          children: "LinkedIn"
+        })]
+      }), /*#__PURE__*/jsxs("button", {
+        className: classnames(button, iconTextButton),
+        onClick: function onClick() {
+          return setShareVia(shareVia == 'WHATSAPP' ? 'TELEGRAM' : 'WHATSAPP');
+        },
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, message)
+        }), /*#__PURE__*/jsx("div", {
+          children: shareVia == 'WHATSAPP' ? 'Telegram' : 'Whatsapp'
+        })]
+      }), /*#__PURE__*/jsxs("button", {
+        className: classnames(button, iconTextButton),
+        onClick: function onClick() {
+          return shareSocial('twitter', shareContent);
+        },
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, twitter)
+        }), /*#__PURE__*/jsx("div", {
+          children: "Twitter"
+        })]
+      })]
+    })]
+  });
+};
+var shareSocial = function shareSocial(platform, content, qrCode) {
+  var url = content.url,
+    title = content.title,
+    text = content.text,
+    hashtags = content.hashtags,
+    via = content.via;
+  var shareUrl = '';
+  LOG.businessEvent('onPlannerShareConfiguration', 'Planner', "Eine Koniguration wurde \xFCber einen Social Kanal geteilt", {
+    shareType: 'social',
+    shareAction: !qrCode ? 'button_click' : 'qr_click',
+    sharePlatform: platform
+  });
+  var fullUrl = '';
+  var utm = undefined;
+  switch (platform) {
+    case 'facebook':
+      utm = new UTMUtils(UtmSource.FACEBOOK, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+      fullUrl = utm.addUtmParams(url);
+      shareUrl = "https://www.facebook.com/sharer/sharer.php?u=".concat(encodeURIComponent(fullUrl), "&quote=").concat(encodeURIComponent(text));
+      break;
+    case 'twitter':
+      utm = new UTMUtils(UtmSource.X, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+      fullUrl = utm.addUtmParams(url);
+      shareUrl = "https://twitter.com/intent/tweet?url=".concat(encodeURIComponent(fullUrl), "&text=").concat(encodeURIComponent(text)).concat(hashtags ? "&hashtags=".concat(encodeURIComponent(hashtags)) : '').concat(via ? "&via=".concat(encodeURIComponent(via)) : '');
+      break;
+    case 'linkedin':
+      utm = new UTMUtils(UtmSource.LINKEDIN, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+      fullUrl = utm.addUtmParams(url);
+      shareUrl = "https://www.linkedin.com/shareArticle?mini=true&url=".concat(encodeURIComponent(fullUrl), "&title=").concat(encodeURIComponent(title), "&summary=").concat(encodeURIComponent(text));
+      break;
+    case 'whatsapp':
+      utm = new UTMUtils(UtmSource.WHATSAPP, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+      fullUrl = utm.addUtmParams(url);
+      // Use WhatsApp Web for desktop and fallback to WhatsApp mobile protocol
+      shareUrl = "https://web.whatsapp.com/send?text=".concat(encodeURIComponent("".concat(text, "\n").concat(fullUrl)));
+      break;
+    case 'telegram':
+      utm = new UTMUtils(UtmSource.TELEGRAM, UtmMedium.SOCIAL, UtmCampaign.PLANNER_SHARE);
+      fullUrl = utm.addUtmParams(url);
+      shareUrl = "https://t.me/share/url?url=".concat(encodeURIComponent(fullUrl), "&text=").concat(encodeURIComponent(text));
+      break;
+  }
+
+  // For WhatsApp, we'll open in a new tab instead of a popup
+  if (platform === 'whatsapp' || platform == 'telegram') {
+    window.open(shareUrl, '_blank');
+  } else {
+    createShareWindow(shareUrl);
+  }
+};
+var WINDOW_CONFIG = {
+  width: 600,
+  height: 400,
+  location: 'no',
+  toolbar: 'no',
+  status: 'no',
+  directories: 'no',
+  menubar: 'no',
+  scrollbars: 'yes',
+  resizable: 'no',
+  centerscreen: 'yes',
+  chrome: 'yes'
+};
+var createShareWindow = function createShareWindow(url) {
+  var left = window.screen.width / 2 - WINDOW_CONFIG.width / 2;
+  var top = window.screen.height / 2 - WINDOW_CONFIG.height / 2;
+  return window.open(url, 'share', Object.entries(_objectSpread(_objectSpread({}, WINDOW_CONFIG), {}, {
+    left: left,
+    top: top
+  })).map(function (_ref2) {
+    var _ref3 = _slicedToArray(_ref2, 2),
+      key = _ref3[0],
+      value = _ref3[1];
+    return "".concat(key, "=").concat(value);
+  }).join(','));
+};
+
+export { ShareViaSocialMedias as default, shareSocial };

package/build/esm/index-ef66be8a.js

@@ -0,0 +1,43 @@
+import './index-50519ff7.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/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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 '@crystaldesign/widget-contact-form';
+
+var ElementCopy = function ElementCopy(_ref) {
+  var item = _ref.item,
+    rect = _ref.rect,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  return /*#__PURE__*/jsx("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    onClick: function onClick() {
+      var _item$clickFunction;
+      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId));
+    },
+    style: {
+      left: rect.doUseCalc ? rect.leftCalc : item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px',
+      top: rect.doUseCalc ? rect.topCalc : item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px'
+    },
+    className: classnames(plannerUIProps.classes.copy.ElementCopy, plannerUIProps.classes.buttonGeneral)
+  });
+};
+var ElementCopy$1 = observer(ElementCopy);
+
+export { ElementCopy$1 as default };

package/build/esm/index-f1837c8d.js

@@ -0,0 +1,55 @@
+import { s as styleInject } from './index-50519ff7.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+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 '@crystaldesign/widget-contact-form';
+
+var configuratorSpec = "Configurator-spec-Pa0bu";
+var configuratorSpecTextContainer = "Configurator-spec-text-Container-yp9wU";
+var configuratorSpecTitle = "Configurator-spec-title-JDala";
+var configuratorSpecPrice = "Configurator-spec-price-pOXke";
+var css_248z = "/*Summary*/\n\n.Configurator-spec-Pa0bu {\n  border-bottom: 1px solid #dfdfdf;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  color: var(--secondaryColor);\n  overflow: hidden;\n  display: flex;\n  width: 100%;\n  word-break: normal;\n  flex-direction: column;\n  padding: 10px 0;\n}\n\n.Configurator-spec-text-Container-yp9wU {\n  display: flex;\n  position: relative;\n}\n.Configurator-spec-title-JDala {\n  font-size: 16px;\n  width: 70%;\n  margin-right: 20px;\n}\n\n.Configurator-spec-price-pOXke {\n  text-align: right;\n  width: 30%;\n  color: var(--primaryColor);\n  font-weight: 300;\n  line-height: 1.5;\n}\n\n.Configurator-spec-Codex-ESLPx {\n}\n";
+styleInject(css_248z);
+
+var SummaryPartlist = function SummaryPartlist(_ref) {
+  var itemP = _ref.item;
+  var item = itemP;
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  return /*#__PURE__*/jsx("div", {
+    className: classnames(configuratorSpec),
+    children: /*#__PURE__*/jsxs("div", {
+      className: configuratorSpecTextContainer,
+      children: [/*#__PURE__*/jsx("span", {
+        className: configuratorSpecTitle,
+        children: item.title
+      }), /*#__PURE__*/jsx("span", {
+        className: configuratorSpecTitle,
+        children: item.description
+      }), /*#__PURE__*/jsx("span", {
+        className: configuratorSpecTitle,
+        children: 'x' + item.posNr
+      }), !hidePrices && !!item.price && /*#__PURE__*/jsx("span", {
+        className: configuratorSpecPrice,
+        children: DivaUtils.formatPrice(item.price)
+      })]
+    })
+  });
+};
+var SummaryPartlist$1 = observer(SummaryPartlist);
+
+export { SummaryPartlist$1 as default };

package/build/esm/index-f1b146f2.js

@@ -0,0 +1,41 @@
+import { s as styleInject, u as useViewHandler } from './index-50519ff7.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useDivaCore } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import { 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/helpers/slicedToArray';
+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 '@crystaldesign/widget-contact-form';
+
+var logo = "logo-h99KB";
+var mobile = "mobile-W86xf";
+var hidden = "hidden-uMA1f";
+var notHidden = "not-hidden-88ft-";
+var landscape = "landscape-gPEyU";
+var css_248z = ".logo-h99KB {\n  right: 0px;\n  bottom: 0px;\n  position: absolute;\n  z-index: 600;\n  opacity: 1;\n  max-width: 30%;\n  max-height: 64px;\n  margin-bottom: 16px;\n  margin-right: 20px;\n}\n\n.mobile-W86xf {\n  right: auto;\n  right: initial;\n  left: 0px;\n  bottom: 36px;\n  margin-bottom: 10px;\n  margin-right: 0;\n  margin-right: initial;\n  margin-left: 20px;\n  max-height: 50px;\n}\n\n.hidden-uMA1f {\n  opacity: 0;\n}\n\n.not-hidden-88ft- {\n  transition: opacity 0.5s;\n}\n\n.landscape-gPEyU.logo-h99KB {\n  opacity: 0;\n}\n";
+styleInject(css_248z);
+
+var Logo = function Logo(props) {
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    logoUrl = _useDivaCore.state.organization.logoUrl;
+  if (!viewHandler.uiState.isInMobileView && !viewHandler.uiState.ViewConfig.showLogoInProductDesktop || !viewHandler.uiState.ViewConfig.showLogoInProduct || !logoUrl) return /*#__PURE__*/jsx(Fragment, {});
+  return /*#__PURE__*/jsx("img", {
+    className: classnames(logo, viewHandler.getIsInMobileView() ? mobile : undefined, viewHandler.productState.orbitHidden ? notHidden : hidden, viewHandler.uiState.isMobileLandscape ? landscape : undefined),
+    src: logoUrl
+  });
+};
+var Logo$1 = observer(Logo);
+
+export { Logo$1 as default };