@crystaldesign/diva-web-planner-react 26.4.0-beta.32 → 26.4.0-beta.34

package/build/esm/index-4b33dbd6.js

@@ -0,0 +1,53 @@
+import { s as styleInject, u as useViewHandler } from './index-e88e8992.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useTranslation, useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/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-vxlYB";
+var totalPrice = "totalPrice-sBu4C";
+var price = "price-jVSu8";
+var css_248z = ".container-vxlYB {\n  width: 100%;\n  border-top: 1px #6d6e71 solid;\n  color: #6d6e71;\n  font-weight: 600;\n  font-size: 20px;\n  line-height: 24px;\n  padding-top: 1rem;\n}\n\n.totalPrice-sBu4C {\n  float: left;\n  margin-left: 2rem;\n}\n\n.price-jVSu8 {\n  float: right;\n  margin-right: 2rem;\n}\n";
+styleInject(css_248z);
+
+var SummaryTotalPrice = function SummaryTotalPrice(props) {
+  var _viewHandler$productS;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  return /*#__PURE__*/jsx(Fragment, {
+    children: !hidePrices && /*#__PURE__*/jsxs("div", {
+      className: container,
+      children: [/*#__PURE__*/jsx("div", {
+        className: totalPrice,
+        children: t('configurator.TotalPrice', 'TotalPrice')
+      }), /*#__PURE__*/jsx("div", {
+        className: price,
+        children: DivaUtils.formatPrice((_viewHandler$productS = viewHandler.productState.formatedTotalPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0, viewHandler.productState.priceFormat)
+      })]
+    })
+  });
+};
+var TotalPrice = observer(SummaryTotalPrice);
+
+export { TotalPrice as default };

package/build/esm/index-4bf2684b.js

@@ -0,0 +1,60 @@
+import { s as styleInject } from './index-e88e8992.js';
+import { observer } from 'mobx-react-lite';
+import Arrow from './index-2fd11ca9.js';
+import 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+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/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 selectContainer = "select-container-IwjJt";
+var select = "select-ftXa-";
+var arrow = "arrow-vRzWc";
+var css_248z = ".select-container-IwjJt {\n  position: relative;\n  width: calc(100% - 16px);\n}\n\n.select-ftXa- {\n  outline: none !important;\n}\n\n.select-ftXa- {\n  position: relative;\n  font-size: 16px;\n  color: #111;\n  line-height: 20px;\n  height: 30px;\n  -webkit-appearance: none;\n     -moz-appearance: none;\n          appearance: none;\n  width: calc(100% - 16px);\n  border: 1px solid var(--select-border);\n  border-radius: 3px;\n  padding: 4px 8px;\n  cursor: pointer;\n  background-color: #fff;\n  background-image: linear-gradient(to top, #f9f9f9, #fff 33%);\n}\n\n.arrow-vRzWc {\n  position: absolute;\n  top: 10px;\n  right: 12px;\n  z-index: 10;\n  pointer-events: none;\n}\n";
+styleInject(css_248z);
+
+var MobileDropdown = function MobileDropdown(_ref) {
+  var onChange = _ref.onChange,
+    mobileOptions = _ref.mobileOptions,
+    selectedOption = _ref.selectedOption,
+    id = _ref.id;
+  return /*#__PURE__*/jsxs("div", {
+    className: selectContainer,
+    id: id,
+    children: [/*#__PURE__*/jsx(Arrow, {
+      open: false,
+      className: arrow
+    }), /*#__PURE__*/jsx("select", {
+      className: select,
+      onChange: onChange,
+      value: selectedOption,
+      children: mobileOptions.map(function (option) {
+        return /*#__PURE__*/jsx("option", {
+          value: option.codex,
+          dangerouslySetInnerHTML: {
+            __html: option.text + (!!option.price ? '  -  ' + option.price : '')
+          }
+        }, option.codex);
+      })
+    })]
+  });
+};
+var MobileDropdown$1 = observer(MobileDropdown);
+
+export { MobileDropdown$1 as default };

package/build/esm/index-4dd8b310.js

@@ -0,0 +1,39 @@
+import { s as styleInject } from './index-e88e8992.js';
+import 'react';
+import classnames from 'classnames';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+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/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 isActive = "is-active-bp70x";
+var listenToVariablesOptionClass = "listen-to-variables-option-class-rPBBX";
+var listenToVariablesGalleryClass = "listen-to-variables-gallery-class-dRVC6";
+var css_248z = ".is-active-bp70x {\n  position: absolute;\n  left: 4px;\n  top: 4px;\n  height: 19.2px;\n  width: 19.2px;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2221%22 height%3D%2221%22 viewBox%3D%220 0 21 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2210.3408%22 cy%3D%2210.781%22 r%3D%2210%22 fill%3D%22%234A4A4A%22%2F%3E%3Cpath d%3D%22M5.68848 10.7237L9.86816 15.3262L14.9932 8.18604%22 stroke%3D%22white%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  border-radius: 20px;\n  border: 1px solid #d5d5d5;\n  background-position: center;\n  z-index: 100;\n}\n.listen-to-variables-option-class-rPBBX {\n  opacity: 1;\n  opacity: var(--hideOptionSelActive, 1);\n}\n\n.listen-to-variables-gallery-class-dRVC6 {\n  opacity: 1;\n  opacity: var(--hideGallerySelActive, 1);\n}\n";
+styleInject(css_248z);
+
+var IsActive = function IsActive(_ref) {
+  var listenToGalleryVariables = _ref.listenToGalleryVariables,
+    listenToOptionVariables = _ref.listenToOptionVariables;
+  return /*#__PURE__*/jsx("div", {
+    className: classnames(isActive, listenToOptionVariables ? listenToVariablesOptionClass : undefined, listenToGalleryVariables ? listenToVariablesGalleryClass : undefined)
+  });
+};
+
+export { IsActive as default };

package/build/esm/index-4e529de2.js

@@ -0,0 +1,275 @@
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject, u as useViewHandler } from './index-e88e8992.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useState } from 'react';
+import { getLogger, useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+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/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 container = "container-5GMrB";
+var buttonDropdown = "button-dropdown-hJTTc";
+var open = "open-cFdzA";
+var icon = "icon-7uXLI";
+var column = "column-SanUs";
+var button = "button-qcl7w";
+var actionButton = "action-button-nTgLc";
+var actionButtonDisabled = "action-button-disabled--LWWq";
+var secondButton = "second-button-KGVxc";
+var row = "row-bjrma";
+var iconColor = "icon-color-hyBQn";
+var saveIcon = "save-icon-s5mPx";
+var sendIcon = "send-icon-O6d2-";
+var css_248z = ".container-5GMrB {\n  display: flex;\n  flex-direction: row;\n  margin-left: 16px;\n}\n\n.button-dropdown-hJTTc {\n  border: 1px solid #cacaca;\n  border-radius: 4px;\n  position: absolute;\n  bottom: 105%;\n  left: 0;\n  right: -5px;\n  padding: 0.84em 1em;\n  color: #000;\n  color: initial;\n  display: none;\n  flex-direction: column;\n}\n\n.button-dropdown-hJTTc.open-cFdzA {\n  display: flex;\n}\n\n.button-dropdown-hJTTc .icon-7uXLI {\n  filter: brightness(0.1);\n}\n.button-dropdown-hJTTc .column-SanUs:hover {\n  color: var(--primaryColor);\n}\n\n.button-qcl7w {\n  position: relative;\n  font-weight: 100;\n  border-radius: 32px;\n  transition: background-color 0.25s ease-out, color 0.25s ease-out;\n  font-size: 0.9rem;\n  line-height: 18px;\n  text-align: center;\n  cursor: pointer;\n  box-sizing: border-box;\n  display: inline-block;\n  vertical-align: middle;\n  margin: 0 0.5rem 1rem 0;\n  padding: 0.85em 1em;\n  -webkit-appearance: none;\n  border: 1px solid transparent;\n}\n\n.action-button-nTgLc {\n  background-color: var(--primaryColor);\n  color: #fefefe;\n}\n\n.action-button-disabled--LWWq {\n  opacity: 0.25;\n  cursor: not-allowed;\n}\n\n.action-button-nTgLc:hover {\n  filter: brightness(0.9);\n}\n\n.second-button-KGVxc {\n  background-color: transparent;\n  border-color: var(--primaryColor);\n  color: var(--primaryColor);\n  padding: 0.85em 1em 0.85em 0.25em;\n}\n\n.second-button-KGVxc:hover {\n  fill: #202020 !important;\n}\n\n.second-button-KGVxc:hover {\n  border-color: #202020;\n  color: #202020;\n}\n\n.row-bjrma {\n  float: left;\n}\n.second-button-KGVxc .row-bjrma {\n  padding-left: 0.5em;\n}\n\n.column-SanUs {\n  margin: 0.5em 0;\n}\n\n.icon-7uXLI {\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  width: 20px;\n  height: 20px;\n}\n.icon-color-hyBQn {\n  fill: var(--primaryColor);\n  transition: fill 0.25s ease-out, color 0.25s ease-out;\n}\n\n.second-button-KGVxc:hover .icon-color-hyBQn {\n  fill: black;\n}\n\n.save-icon-s5mPx {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2242%22 height%3D%2242%22 viewBox%3D%220 0 3400 3400%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Cpath    fill%3D%22white%22    transform%3D%22scale(1%2C-1) translate(450%2C-2600)%22    strokeWidth%3D%221%22    d%3D%22M783 255l-325 325l-70 70l-391 391q-14 15 -14 35.5t14 35.5l325 325q14 14 35 14t35 -14l391 -391q15 -15 35.5 -15t35.5 15l1049 1049q15 15 35.5 15t35.5 -15l327 -322q15 -15 15 -35q0 -21 -15 -35l-1447 -1448q-15 -14 -35.5 -14t-35.5 14z%22     %2F%3E%3C%2Fsvg%3E\");\n}\n.send-icon-O6d2- {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2242%22 height%3D%2242%22 viewBox%3D%220 0 3400 3400%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Cpath    fill%3D%22white%22    transform%3D%22scale(1%2C-1) translate(450%2C-2600)%22    strokeWidth%3D%221%22d%3D%22M921 89q-43 -54 -75 -54q-22 0 -34 25.5t-12 72.5v767h-708q-91 0 -91 31q0 26 63 65l2063 1278q42 26 79 26q42 0 68 -32t26 -88v-1800q0 -57 -26.5 -89.5t-69.5 -32.5q-37 0 -78 25l-712 425zM1000 480l1186 1700l-1186 -1300v-400z%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.reset-icon-HqNs3 path {\n  background-color: var(--primaryColor);\n}\n";
+styleInject(css_248z);
+
+var LOG = getLogger('Planner', 'BasketActionSerious');
+var BasketActionSerious = function BasketActionSerious(_ref) {
+  var saveIsDisabled = _ref.saveIsDisabled,
+    sendEmailIsDisabled = _ref.sendEmailIsDisabled,
+    onSave = _ref.onSave;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    openDropdown = _useState2[0],
+    setOpen = _useState2[1];
+  var _useDivaCore = useDivaCore(),
+    _useDivaCore$actions = _useDivaCore.actions,
+    userHasPermission = _useDivaCore$actions.userHasPermission,
+    openSnackBar = _useDivaCore$actions.openSnackBar;
+  var onClickReset = function onClickReset() {
+    var _viewHandler$actions;
+    (_viewHandler$actions = viewHandler.actions) === null || _viewHandler$actions === void 0 || _viewHandler$actions.openModal({
+      title: t('modals.reset'),
+      accept: true,
+      reject: true,
+      text: t('modals.are_you_sure_to_reset'),
+      callback: function callback(accepted) {
+        if (accepted) {
+          viewHandler.productState.onClickReset();
+        }
+      }
+    });
+  };
+  var onClickSave = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(type) {
+      var _viewHandler$getViewC, _viewHandler$getViewC2, _viewHandler$divaWebP, url, _viewHandler$getViewC3, _viewHandler$getViewC4;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.t0 = type;
+            _context.next = _context.t0 === 'email' ? 3 : _context.t0 === 'save' ? 8 : 13;
+            break;
+          case 3:
+            if (!(!saveIsDisabled && !sendEmailIsDisabled)) {
+              _context.next = 7;
+              break;
+            }
+            onSave();
+            _context.next = 7;
+            return viewHandler.actionButtonState.onClickAddToBasket(viewHandler, 'onSendEmail');
+          case 7:
+            return _context.abrupt("break", 13);
+          case 8:
+            if (saveIsDisabled) {
+              _context.next = 12;
+              break;
+            }
+            onSave();
+            _context.next = 12;
+            return viewHandler.actionButtonState.onClickAddToBasket(viewHandler);
+          case 12:
+            return _context.abrupt("break", 13);
+          case 13:
+            if (!viewHandler.getViewConfig().showPdfQR) {
+              _context.next = 22;
+              break;
+            }
+            if (!(typeof viewHandler.getViewConfig().showPdfQR == 'boolean')) {
+              _context.next = 18;
+              break;
+            }
+            if (viewHandler.divaWebPlanner.getBasket().PDFDocumentURL) {
+              openSnackBar({
+                type: 'big',
+                qrCode: viewHandler.divaWebPlanner.getBasket().PDFDocumentURL,
+                message: t('basket.checkout.pdfqr'),
+                autoHideDuration: (_viewHandler$getViewC = viewHandler.getViewConfig().pdfQRAutoHideDuration) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : 1000 * 60 * 2,
+                clickable: !((_viewHandler$getViewC2 = viewHandler.getViewConfig().pdfQRNotClickable) !== null && _viewHandler$getViewC2 !== void 0 ? _viewHandler$getViewC2 : false),
+                qrCodeSize: 312
+              });
+            } else {
+              LOG.warn('Basket is missing a pdf, no QR-Code displayed');
+            }
+            _context.next = 22;
+            break;
+          case 18:
+            _context.next = 20;
+            return (_viewHandler$divaWebP = viewHandler.divaWebPlanner.actSet()) === null || _viewHandler$divaWebP === void 0 ? void 0 : _viewHandler$divaWebP.api.createBasketReport(viewHandler.divaWebPlanner.getBasket(), viewHandler.getViewConfig().showPdfQR, viewHandler.getViewConfig().savePdfQR);
+          case 20:
+            url = _context.sent;
+            if (url) {
+              openSnackBar({
+                type: 'big',
+                qrCode: url,
+                qrCodeSize: 312,
+                message: t('basket.checkout.pdfqr'),
+                autoHideDuration: (_viewHandler$getViewC3 = viewHandler.getViewConfig().pdfQRAutoHideDuration) !== null && _viewHandler$getViewC3 !== void 0 ? _viewHandler$getViewC3 : 1000 * 60 * 2,
+                clickable: !((_viewHandler$getViewC4 = viewHandler.getViewConfig().pdfQRNotClickable) !== null && _viewHandler$getViewC4 !== void 0 ? _viewHandler$getViewC4 : false)
+              });
+            } else {
+              LOG.warn('Could not generate PDF, no QR-Code displayed');
+            }
+          case 22:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function onClickSave(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var onClickFavorites = function onClickFavorites() {
+    var _viewHandler$actions2;
+    (_viewHandler$actions2 = viewHandler.actions) === null || _viewHandler$actions2 === void 0 || _viewHandler$actions2.openModal({
+      title: t('modals.favorite'),
+      accept: true,
+      reject: true,
+      text: t('modals.are_you_sure_favorite'),
+      callback: function () {
+        var _callback = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(accepted) {
+          var _viewHandler$actions3;
+          return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+            while (1) switch (_context2.prev = _context2.next) {
+              case 0:
+                if (!accepted) {
+                  _context2.next = 5;
+                  break;
+                }
+                onSave();
+                _context2.next = 4;
+                return viewHandler.actionButtonState.onClickAddToBasket(viewHandler, 'onSaveProduct');
+              case 4:
+                (_viewHandler$actions3 = viewHandler.actions) === null || _viewHandler$actions3 === void 0 || _viewHandler$actions3.openModal({
+                  title: t('modals.favorite'),
+                  accept: true,
+                  text: t('modals.favorites_saved')
+                });
+              case 5:
+              case "end":
+                return _context2.stop();
+            }
+          }, _callee2);
+        }));
+        function callback(_x2) {
+          return _callback.apply(this, arguments);
+        }
+        return callback;
+      }()
+    });
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: container,
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classnames(button, actionButton, saveIsDisabled ? actionButtonDisabled : undefined),
+      onClick: function onClick() {
+        if (!saveIsDisabled) setOpen(!openDropdown);
+      },
+      children: [/*#__PURE__*/jsx("div", {
+        className: classnames(row, icon, saveIcon)
+      }), /*#__PURE__*/jsxs("div", {
+        className: classnames(row),
+        children: [" ", t('configurator.ADD_TO_BASKET')]
+      }), /*#__PURE__*/jsxs("div", {
+        className: classnames(openDropdown ? open : undefined, buttonDropdown),
+        children: [/*#__PURE__*/jsxs("div", {
+          className: column,
+          onClick: function onClick() {
+            return onClickSave('save');
+          },
+          id: "wcConfigurator-action-tobasket",
+          children: [/*#__PURE__*/jsx("div", {
+            className: classnames(row, icon, saveIcon)
+          }), /*#__PURE__*/jsxs("div", {
+            className: classnames(row),
+            children: [" ", t('configurator.ADD_TO_BASKET')]
+          })]
+        }), /*#__PURE__*/jsxs("div", {
+          className: classnames(column, sendEmailIsDisabled ? actionButtonDisabled : undefined),
+          onClick: function onClick() {
+            return onClickSave('email');
+          },
+          children: [/*#__PURE__*/jsx("div", {
+            className: classnames(row, icon, sendIcon)
+          }), /*#__PURE__*/jsxs("div", {
+            className: classnames(row),
+            children: [" ", t('configurator.SendToClient')]
+          })]
+        })]
+      })]
+    }), /*#__PURE__*/jsxs("div", {
+      onClick: onClickReset,
+      className: classnames(button, secondButton),
+      children: [/*#__PURE__*/jsx("div", {
+        className: classnames(row, icon),
+        children: /*#__PURE__*/jsx("svg", {
+          width: "26",
+          height: "22",
+          viewBox: "0 0 3400 3400",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: /*#__PURE__*/jsx("path", {
+            className: iconColor,
+            transform: "scale(1,-1) translate(450,-2600)",
+            strokeWidth: "1",
+            d: "M935 2061l-114 277q135 45 279 57v-300q-85 -9 -165 -34zM1435 2069q-71 19 -135 26v300q131 -11 251 -48zM615 1884l-211 212q119 105 260 176l114 -276q-87 -47 -163 -112zM1737 1921q-43 32 -89 59l115 279q99 -53 187 -125zM2007 -3l-148 204l-6 -4 q-146 -95 -321 -145t-332 -51q-172 0 -331.5 43t-291 120.5t-240 188t-182.5 242.5t-114.5 287t-40.5 318q0 225 80 429.5t224 367.5l212 -212q-103 -120 -159.5 -270t-56.5 -314q0 -123 32 -239.5t90 -215t140.5 -181.5t181.5 -141t216 -90.5t240 -31.5q146 0 256.5 34 t226.5 109l-151 212q-8 11 -8 20q0 20 29 19h683q17 0 27.5 -10t10.5 -25q0 -6 -3 -13l-220 -644q-7 -22 -22 -22q-12 0 -22 15zM1964 1673q-20 32 -43 64l213 213q61 -75 109 -161zM2085 1400q-4 0 -10 27l279 126q4 -14 8.5 -35.5t8 -41t6.5 -37.5t6 -28.5t5 -10.5h-303z "
+          })
+        })
+      }), /*#__PURE__*/jsxs("div", {
+        className: classnames(row),
+        children: [" ", t('configurator.ConfigReset')]
+      })]
+    }), userHasPermission('favorites_lueck') && /*#__PURE__*/jsxs("div", {
+      onClick: onClickFavorites,
+      className: classnames(button, secondButton),
+      children: [/*#__PURE__*/jsx("div", {
+        className: classnames(row, icon),
+        children: /*#__PURE__*/jsx("svg", {
+          width: "26",
+          height: "22",
+          viewBox: "0 0 3400 3400",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: /*#__PURE__*/jsx("path", {
+            className: iconColor,
+            transform: "scale(1,-1) translate(450,-2600)",
+            strokeWidth: "1",
+            d: "M2491 1500l-765 -541l291 -885l-768 551l-764 -554l291 883l-776 546h958l294 900h3l292 -900h944zM484 68h-3l4 3z"
+          })
+        })
+      }), /*#__PURE__*/jsxs("div", {
+        className: classnames(row),
+        children: [" ", t('configurator.Favorites')]
+      })]
+    })]
+  });
+};
+var BasketActionSerious$1 = observer(BasketActionSerious);
+
+export { BasketActionSerious$1 as default };

package/build/esm/index-4f6d42fe.js

@@ -0,0 +1,33 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-e88e8992.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@crystaldesign/diva-core';
+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 '@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 SettingsItemAccessoireTemplate = function SettingsItemAccessoireTemplate(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Settings/SettingsScroller/SettingsItem/ItemPalette/Accessoires"
+  }));
+};
+
+export { SettingsItemAccessoireTemplate as default };

package/build/esm/index-4fa82515.js

@@ -0,0 +1,155 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { s as styleInject, u as useViewHandler } from './index-e88e8992.js';
+import 'react';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import ArQrCodeIcon from './index-a4e4ed24.js';
+import { u as useCustomDimensions } from './useCustomDimensions-98389e48.js';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+import 'react-laag';
+import './index-b7250cd3.js';
+import 'react-qr-code';
+import './index-4000ba20.js';
+
+var wrapper = "wrapper-IoYoU";
+var subWrapper = "subWrapper-Gf23J";
+var row = "row-fJACz";
+var header = "header-wqJL7";
+var column = "column-HLDRl";
+var black = "black-AHhTL";
+var separator = "separator-MwswF";
+var button = "button-74YF9";
+var css_248z = ".wrapper-IoYoU {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  position: relative;\n  border: 1px solid var(--diva-theme-palette-primary-main);\n  border-radius: calc(var(--buttons-border-radius) * 2);\n  color: var(--diva-theme-palette-primary-main);\n  width: calc(100% - 32px);\n  padding: 16px;\n  margin: 12px 0px;\n}\n\n.subWrapper-Gf23J {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  gap: 8px;\n  font-size: 14px;\n}\n\n.wrapper-IoYoU::before {\n  content: '';\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  background-color: var(--diva-theme-palette-primary-light);\n  opacity: 0.15;\n  z-index: -1;\n  pointer-events: none;\n  border-radius: inherit;\n}\n\n.row-fJACz {\n  display: flex;\n  flex-direction: row;\n  gap: 16px;\n  justify-content: space-between;\n  width: 100%;\n}\n\n.header-wqJL7 {\n  font-weight: 600;\n}\n\n.column-HLDRl {\n  display: flex;\n  gap: 4px;\n  align-items: center;\n}\n\n.black-AHhTL {\n  color: #000;\n  font-weight: 600;\n}\n\n.separator-MwswF {\n  width: 100%;\n  height: 1px;\n  background-color: var(--diva-theme-palette-primary-main);\n}\n\n.button-74YF9 {\n  cursor: pointer;\n  width: calc(100% - 32px);\n  height: 22px;\n  padding: 8px 16px;\n  background-color: transparent;\n  border: 1px solid var(--diva-theme-palette-primary-main);\n  border-radius: calc(var(--buttons-border-radius) * 1.5);\n  font-size: 14px;\n  font-weight: 600;\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  align-items: center;\n  justify-content: center;\n  transition:\n    background-color 0.3s ease,\n    box-shadow 0.3s ease;\n}\n\n.button-74YF9:hover {\n  background-color: var(--diva-theme-palette-primary-light);\n  box-shadow: 0 -3px 6px rgba(0, 0, 0, 0.1);\n}\n";
+styleInject(css_248z);
+
+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 ArticleOverview = function ArticleOverview() {
+  var _bbox$X, _bbox$Y, _bbox$Z, _bbox$wOLT, _bbox$dOLT, _bbox$hOLT;
+  var viewHandler = useViewHandler();
+  var _useCustomDimensions = useCustomDimensions(),
+    dimensions = _useCustomDimensions.dimensions,
+    dimOnlyForOneArticle = _useCustomDimensions.dimOnlyForOneArticle;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var bbox = viewHandler.settingsState.bbox;
+  return /*#__PURE__*/jsxs("div", {
+    className: wrapper,
+    children: [/*#__PURE__*/jsx("div", {
+      className: row,
+      children: /*#__PURE__*/jsxs("div", {
+        className: classnames(column, header),
+        children: [/*#__PURE__*/jsxs("svg", {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "18",
+          height: "18",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "var(--diva-theme-palette-primary-main)",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          children: [/*#__PURE__*/jsx("path", {
+            d: "M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z"
+          }), /*#__PURE__*/jsx("path", {
+            d: "m14.5 12.5 2-2"
+          }), /*#__PURE__*/jsx("path", {
+            d: "m11.5 9.5 2-2"
+          }), /*#__PURE__*/jsx("path", {
+            d: "m8.5 6.5 2-2"
+          }), /*#__PURE__*/jsx("path", {
+            d: "m17.5 15.5 2-2"
+          })]
+        }), t('configurator.summary.total_dimensions')]
+      })
+    }), /*#__PURE__*/jsxs("div", {
+      className: subWrapper,
+      children: [/*#__PURE__*/jsxs("div", {
+        className: row,
+        children: [/*#__PURE__*/jsx("div", {
+          className: column,
+          children: t('configurator.bth')
+        }), /*#__PURE__*/jsxs("div", {
+          className: classnames(column, black),
+          children: [(_bbox$X = bbox === null || bbox === void 0 ? void 0 : bbox.X) !== null && _bbox$X !== void 0 ? _bbox$X : -1, " \xD7 ", (_bbox$Y = bbox === null || bbox === void 0 ? void 0 : bbox.Y) !== null && _bbox$Y !== void 0 ? _bbox$Y : -1, " \xD7 ", (_bbox$Z = bbox === null || bbox === void 0 ? void 0 : bbox.Z) !== null && _bbox$Z !== void 0 ? _bbox$Z : -1, " cm"]
+        })]
+      }), (bbox === null || bbox === void 0 ? void 0 : bbox.wOLT) !== undefined && /*#__PURE__*/jsxs("div", {
+        className: row,
+        children: [/*#__PURE__*/jsx("div", {
+          className: column,
+          children: t('configurator.without_olf')
+        }), /*#__PURE__*/jsxs("div", {
+          className: classnames(column, black),
+          children: [(_bbox$wOLT = bbox === null || bbox === void 0 ? void 0 : bbox.wOLT) !== null && _bbox$wOLT !== void 0 ? _bbox$wOLT : -1, " \xD7 ", (_bbox$dOLT = bbox === null || bbox === void 0 ? void 0 : bbox.dOLT) !== null && _bbox$dOLT !== void 0 ? _bbox$dOLT : -1, " \xD7 ", (_bbox$hOLT = bbox === null || bbox === void 0 ? void 0 : bbox.hOLT) !== null && _bbox$hOLT !== void 0 ? _bbox$hOLT : -1, " cm"]
+        })]
+      }), !!(dimensions !== null && dimensions !== void 0 && dimensions.length) && (dimensions === null || dimensions === void 0 ? void 0 : dimensions.map(function (dimension) {
+        var _dimension$text, _dimension$dimension;
+        return /*#__PURE__*/jsxs("div", {
+          className: row,
+          children: [/*#__PURE__*/jsxs("div", {
+            className: column,
+            children: [(_dimension$text = dimension.text) !== null && _dimension$text !== void 0 ? _dimension$text : t('configurator.headerdimension.' + dimension.dimensionId), !dimOnlyForOneArticle && ' (' + dimension.posNrs.join(',') + ')']
+          }), /*#__PURE__*/jsxs("div", {
+            className: classnames(column, black),
+            children: [(_dimension$dimension = dimension.dimension) !== null && _dimension$dimension !== void 0 ? _dimension$dimension : 0, " ", dimension.unit]
+          })]
+        });
+      }))]
+    }), viewHandler.productState.allowQRCodeAR && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx("div", {
+        className: separator
+      }), /*#__PURE__*/jsx(ArQrCodeIcon, {
+        dontOpenModal: true,
+        Button: function Button(props) {
+          return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({
+            className: button
+          }, props), {}, {
+            children: [/*#__PURE__*/jsxs("svg", {
+              width: "32",
+              height: "32",
+              viewBox: "0 0 32 32",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              children: [/*#__PURE__*/jsx("circle", {
+                cx: "16",
+                cy: "16",
+                r: "16"
+              }), /*#__PURE__*/jsx("path", {
+                fillRule: "evenodd",
+                clipRule: "evenodd",
+                d: "M18.9044 9.14469L16.5714 8.04166C16.4524 7.98611 16.3175 7.98611 16.1984 8.04166L13.8575 9.14469C13.5242 9.3034 13.3734 9.70811 13.5321 10.0414C13.6432 10.2874 13.8892 10.4302 14.1432 10.4302C14.2384 10.4302 14.3336 10.4064 14.4288 10.3668L15.7064 9.76366V11.4063C15.7064 11.7793 16.008 12.0808 16.381 12.0808C16.7539 12.0808 17.0555 11.7793 17.0555 11.4063V9.76366L18.3331 10.3668C18.6664 10.5255 19.0711 10.3826 19.2298 10.0414C19.3885 9.70018 19.2457 9.3034 18.9044 9.14469ZM18.3324 13.6921L16.3803 14.6126L14.4282 13.6921C14.0949 13.5334 13.6902 13.6762 13.5315 14.0175C13.3728 14.3508 13.5156 14.7555 13.8568 14.9142L15.682 15.7712C15.682 15.7871 15.678 15.801 15.674 15.8149C15.6701 15.8287 15.6661 15.8426 15.6661 15.8585V17.5091C15.6661 17.882 15.9677 18.1836 16.3406 18.1836C16.7136 18.1836 17.0151 17.882 17.0151 17.5091V15.8585C17.0151 15.8506 17.0132 15.8426 17.0112 15.8347L17.0112 15.8347C17.0092 15.8267 17.0072 15.8188 17.0072 15.8109L18.9117 14.9142C19.245 14.7555 19.3958 14.3508 19.2371 14.0175C19.0704 13.6842 18.6657 13.5334 18.3324 13.6921ZM21.4188 10.3832L23.5059 11.3831C23.6646 11.4545 23.7598 11.6132 23.7598 11.7798V14.1843C23.7598 14.5573 23.4583 14.8588 23.0853 14.8588C22.7123 14.8588 22.4108 14.5573 22.4108 14.1843V13.2955L21.3077 13.8113C21.2125 13.851 21.1173 13.8748 21.0221 13.8748C20.7681 13.8748 20.5221 13.732 20.411 13.486C20.2523 13.1527 20.4031 12.748 20.7364 12.5893L21.8315 12.0735L20.8395 11.5973C20.5063 11.4386 20.3634 11.0339 20.5221 10.7006C20.6808 10.3673 21.0855 10.2245 21.4188 10.3832ZM12.0234 12.589L10.9283 12.0732L11.9203 11.597C12.2536 11.4383 12.3964 11.0336 12.2377 10.7003C12.079 10.3591 11.6743 10.2162 11.341 10.3829L9.25394 11.3828C9.09523 11.4542 9 11.6129 9 11.7795V14.1761C9 14.549 9.30155 14.8506 9.67452 14.8506C10.0475 14.8506 10.349 14.557 10.349 14.184V13.2873L11.4521 13.8031C11.5473 13.8507 11.6425 13.8745 11.7377 13.8745C11.9917 13.8745 12.2377 13.7317 12.3488 13.4857C12.5075 13.1524 12.3646 12.7477 12.0234 12.589ZM11.4521 18.4139C11.7854 18.2552 12.1901 18.4059 12.3488 18.7392C12.5075 19.0805 12.3646 19.4852 12.0234 19.6439L10.9283 20.1597L11.9203 20.6358C12.2536 20.7945 12.3964 21.1992 12.2377 21.5325C12.1186 21.7706 11.8806 21.9134 11.6266 21.9134C11.5235 21.9134 11.4283 21.8976 11.333 21.8499L9.246 20.8501C9.09523 20.7786 9 20.6199 9 20.4533V18.0488C9 17.6759 9.30155 17.3743 9.67452 17.3743C10.0475 17.3743 10.349 17.6759 10.349 18.0488V18.9376L11.4521 18.4139Z",
+                fill: "var(--diva-theme-palette-primary-main)"
+              }), /*#__PURE__*/jsx("path", {
+                d: "M18.749 24H17.6823L17.272 22.799H15.3849L14.9746 24H13.9229L15.7205 19.0769H16.9513L18.749 24ZM15.6161 22.0382H17.0408L16.3247 19.89L15.6161 22.0382Z",
+                fill: "var(--diva-theme-palette-primary-main)"
+              }), /*#__PURE__*/jsx("path", {
+                d: "M21.6498 19.0769C22.2068 19.0769 22.6444 19.2112 22.9627 19.4797C23.2809 19.7482 23.44 20.1088 23.44 20.5613C23.44 21.0436 23.2809 21.4141 22.9627 21.6727C22.6444 21.9263 22.2093 22.0531 21.6573 22.0531L21.5529 22.1128H20.4937V24H19.4792V19.0769H21.6498ZM21.5305 21.3296C21.8189 21.3296 22.0327 21.2724 22.172 21.158C22.3162 21.0387 22.3883 20.8572 22.3883 20.6135C22.3883 20.3698 22.3162 20.1908 22.172 20.0764C22.0327 19.9571 21.8189 19.8974 21.5305 19.8974H20.4937V21.3296H21.5305ZM22.1347 21.5459L23.731 24H22.5748L21.2545 21.8443L22.1347 21.5459Z",
+                fill: "var(--diva-theme-palette-primary-main)"
+              })]
+            }), t('configurator.ar_try_at_home')]
+          }));
+        }
+      })]
+    })]
+  });
+};
+var ArticleOverview$1 = observer(ArticleOverview);
+
+export { ArticleOverview$1 as default };