@crystaldesign/diva-web-planner-react 26.13.0-beta.32 → 26.13.0-beta.33

package/build/esm/index-6a35b2b5.js

@@ -1,205 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, P as PricePreview, S as SettingsHeader } from './index-9bc78e81.js';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import { useState, useEffect } from 'react';
-import Dropdown from 'react-dropdown';
-import MobileDropdown from './index-74b8196f.js';
-import { observer } from 'mobx-react-lite';
-import InfoIcon from './index-d72e2302.js';
-import ReverseCheck from './index-ed92f45d.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-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 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-import './index-23ff8156.js';
-import '@mui/icons-material/Block';
-import '@mui/icons-material/Warning';
-
-var iconWrapper = "icon-wrapper-uXqGb";
-var wcDropDownSelect = "wcDropDownSelect-sB9TS";
-var dropDownArea = "dropDownArea-2LjDI";
-var image = "image-Ox-79";
-var label = "label-l3TV3";
-var wrapper = "wrapper-xpzd5";
-var css_248z = ".icon-wrapper-uXqGb {\n  display: flex;\n  position: relative;\n}\n.wcDropDownSelect-sB9TS {\n  padding: 10.2px 24px 7px 16px !important;\n}\n.wcDropDownSelect-sB9TS {\n  height: 39px;\n  padding: 8px;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  border: 1px solid #cacaca;\n  border-radius: 4px;\n  background-color: #fefefe;\n  font-family: inherit;\n  letter-spacing: 0pt;\n  color: #0a0a0a;\n  background-origin: content-box;\n  background-position: right -16px center;\n  background-repeat: no-repeat;\n  background-size: 9px 6px;\n  padding-right: 24px;\n  transition:\n    box-shadow 0.5s,\n    border-color 0.25s ease-in-out;\n\n  font-weight: 300;\n}\n\n.wcDropDownSelect-sB9TS > div > div {\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n}\n\n.dropDownArea-2LjDI {\n  max-height: 520px;\n\n  right: 0;\n  width: 100%;\n  min-width: 150px;\n  letter-spacing: 0px;\n  font-size: 13px;\n  font-weight: 300;\n}\n\n.dropDownArea-2LjDI .dropOption-lwWxd {\n  white-space: nowrap;\n}\n\n.row-fy2V4 {\n  width: 100%;\n  height: -moz-fit-content;\n  height: fit-content;\n  position: relative;\n  display: flex;\n  padding-bottom: 4px;\n  padding-top: 4px;\n}\n\n.title-KdLW7 {\n  text-align: right;\n  padding-bottom: 9px;\n  padding-top: 9px;\n}\n\n.colum-yG36- {\n  width: 50%;\n  margin: 15px;\n}\n\n.image-Ox-79 {\n  width: 45%;\n}\n\n.label-l3TV3 {\n  position: relative;\n  padding-right: 64px;\n}\n\n.wrapper-xpzd5 .Dropdown-root {\n  position: relative;\n}\n\n.wrapper-xpzd5 .Dropdown-control {\n  position: relative;\n  overflow: hidden;\n  box-sizing: border-box;\n  color: #333;\n  cursor: default;\n  outline: none;\n  padding: 2px 24px 2px 10px;\n  transition: all 200ms ease;\n  background-color: #fff;\n  border-radius: var(--globalBorderRadius);\n  font-size: 14px;\n}\n\n.mobile-XuD0m .Dropdown-control {\n  font-size: 12px;\n}\n\n.tablet-yL-Pt .Dropdown-control {\n  font-size: 15px;\n}\n\n.wrapper-xpzd5 .Dropdown-control:hover {\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);\n}\n\n.wrapper-xpzd5 .Dropdown-arrow {\n  border-color: #999 transparent transparent;\n  border-style: solid;\n  border-width: 5px 5px 0;\n  content: ' ';\n  display: block;\n  height: 0;\n  margin-top: -ceil(2.5);\n  position: absolute;\n  right: 8px;\n  top: 15px;\n  width: 0;\n}\n\n.wrapper-xpzd5 .is-open .Dropdown-arrow {\n  border-color: transparent transparent #999;\n  border-width: 0 5px 5px;\n}\n\n.wrapper-xpzd5 .Dropdown-menu {\n  background-color: white;\n  box-sizing: border-box;\n  border: 1px solid #ddd;\n  margin-top: -1px;\n  max-height: 200px;\n  overflow-y: auto;\n  position: absolute;\n  top: 100%;\n  width: 100%;\n  z-index: 1100;\n  -webkit-overflow-scrolling: touch;\n}\n\n.wrapper-xpzd5 .Dropdown-menu .Dropdown-group > .Dropdown-title {\n  padding: 8px 10px;\n  color: rgba(51, 51, 51, 1);\n  font-weight: 300;\n  text-transform: capitalize;\n}\n\n.wrapper-xpzd5 .Dropdown-option {\n  box-sizing: border-box;\n  color: rgba(51, 51, 51, 0.8);\n  cursor: pointer;\n  display: block;\n  padding: 8px 10px;\n}\n\n.wrapper-xpzd5 .Dropdown-option:last-child {\n  border-bottom-right-radius: 2px;\n  border-bottom-left-radius: 2px;\n}\n\n.wrapper-xpzd5 .Dropdown-option:hover {\n  background-color: #f2f9fc;\n}\n\n.wrapper-xpzd5 .Dropdown-option.is-selected {\n  background-color: #f2f9fc;\n  color: #333;\n}\n\n.wrapper-xpzd5 .Dropdown-noresults {\n  box-sizing: border-box;\n  color: #ccc;\n  cursor: default;\n  display: block;\n  padding: 8px 10px;\n}\n\n/* Dark mode – backoffice */\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wcDropDownSelect-sB9TS,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wcDropDownSelect-sB9TS,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wcDropDownSelect-sB9TS {\n  background-color: #374c86;\n  border-color: rgba(255, 255, 255, 0.2);\n  color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .title-KdLW7,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .title-KdLW7,\n.diva-component-DIVA_DATA_ENGINE .darkmode .title-KdLW7 {\n  color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-control,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-control,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-control {\n  background-color: #374c86;\n  color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-arrow,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-arrow,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-arrow {\n  border-top-color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .is-open .Dropdown-arrow,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .is-open .Dropdown-arrow,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .is-open .Dropdown-arrow {\n  border-bottom-color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-menu,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-menu,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-menu {\n  background-color: #374c86;\n  border-color: rgba(255, 255, 255, 0.12);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-menu .Dropdown-group > .Dropdown-title,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-menu .Dropdown-group > .Dropdown-title,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-menu .Dropdown-group > .Dropdown-title {\n  color: #fff;\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-option,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-option,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-option {\n  color: rgba(255, 255, 255, 0.85);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-option:hover,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-option:hover,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-option:hover,\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wrapper-xpzd5 .Dropdown-option.is-selected,\n.diva-component-DIVA_PRODUCT_ONBOARDING .darkmode .wrapper-xpzd5 .Dropdown-option.is-selected,\n.diva-component-DIVA_DATA_ENGINE .darkmode .wrapper-xpzd5 .Dropdown-option.is-selected {\n  background-color: rgba(255, 255, 255, 0.12);\n  color: #fff;\n}\n";
-styleInject(css_248z);
-
-function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-var DropDowmText = function DropDowmText(_ref) {
-  var _item$selectedElement;
-  var item = _ref.item,
-    paletteId = _ref.paletteId,
-    style = _ref.style;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    isMobile = _useDivaCore.state.dimensions.isMobile;
-  var _useState = useState(undefined),
-    _useState2 = _slicedToArray(_useState, 2),
-    actValue = _useState2[0],
-    setActValue = _useState2[1];
-  var _useState3 = useState([]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    allItems = _useState4[0],
-    setAllItems = _useState4[1];
-  var _useState5 = useState(undefined),
-    _useState6 = _slicedToArray(_useState5, 2),
-    sel = _useState6[0],
-    setSel = _useState6[1];
-  var _useState7 = useState([]),
-    _useState8 = _slicedToArray(_useState7, 2),
-    mobileOptions = _useState8[0],
-    setMobileOptions = _useState8[1];
-  var _useState9 = useState(undefined),
-    _useState10 = _slicedToArray(_useState9, 2),
-    selectedMobileOption = _useState10[0],
-    setSelectedMobileOption = _useState10[1];
-  var _useState11 = useState([]),
-    _useState12 = _slicedToArray(_useState11, 2),
-    options = _useState12[0],
-    setOptions = _useState12[1];
-  var _useState13 = useState(undefined),
-    _useState14 = _slicedToArray(_useState13, 2),
-    selOption = _useState14[0],
-    setSelOption = _useState14[1];
-  useEffect(function () {
-    var allItemsP = item.groups.flatMap(function (group) {
-      return group.items;
-    });
-    var items = allItemsP;
-    setAllItems(items);
-    var sel = items.find(function (item) {
-      return item.sel;
-    });
-    if (actValue !== (sel === null || sel === void 0 ? void 0 : sel.text)) setActValue(sel === null || sel === void 0 ? void 0 : sel.text);
-    setSel(sel);
-  }, [item]);
-  var onChange = function onChange(val) {
-    setActValue(val.value);
-  };
-  var onChangeMobile = function onChangeMobile(e) {
-    setActValue(e.target.value);
-  };
-  useEffect(function () {
-    var val = allItems.find(function (item) {
-      return item.codex == actValue;
-    });
-    if (val) {
-      setSelOption({
-        label: /*#__PURE__*/jsx("div", {
-          className: label,
-          children: val.text
-        }),
-        value: val.codex
-      });
-      viewHandler.paletteViewHandler.clickedOnConfigPalette(val, undefined, paletteId);
-    }
-  }, [actValue]);
-  useEffect(function () {
-    var mobileOptions = [];
-    var selectedMobileOption = undefined;
-    var opts = [];
-    var _iterator = _createForOfIteratorHelper(allItems),
-      _step;
-    try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var _item = _step.value;
-        mobileOptions.push({
-          text: _item.text,
-          codex: _item.codex
-        });
-        var option = {
-          label: /*#__PURE__*/jsxs("div", {
-            className: label,
-            children: [_item.text, _item.pricePreviewPromise !== undefined && /*#__PURE__*/jsx(PricePreview, {
-              asyncPricePreview: _item.pricePreviewPromise,
-              sel: _item.sel
-            }), _item.checkForReversingChanges !== undefined && /*#__PURE__*/jsx(ReverseCheck, {
-              item: _item,
-              paletteId: paletteId
-            })]
-          }),
-          text: _item.text,
-          value: _item.codex
-        };
-        if (_item.sel) {
-          setSelOption(option);
-          selectedMobileOption = _item.codex;
-        }
-        opts.push(option);
-      }
-    } catch (err) {
-      _iterator.e(err);
-    } finally {
-      _iterator.f();
-    }
-    setOptions(opts);
-    setMobileOptions(mobileOptions);
-    setSelectedMobileOption(selectedMobileOption);
-  }, [allItems]);
-  var paletteIsLastPalette = false;
-  if (paletteId) {
-    var nextPalette = viewHandler.settingsState.itemPalettes.get(paletteId + 1);
-    if (!(nextPalette !== null && nextPalette !== void 0 && nextPalette.visible)) {
-      paletteIsLastPalette = true;
-    }
-  }
-  return /*#__PURE__*/jsxs("div", {
-    ref: function ref(_ref2) {
-      return item.htmlRef = _ref2;
-    },
-    style: style,
-    className: wrapper,
-    children: [/*#__PURE__*/jsxs("div", {
-      className: iconWrapper,
-      children: [/*#__PURE__*/jsx(SettingsHeader, {
-        isInScroller: true,
-        isSettingsHeader: false,
-        item: item
-      }), ((_item$selectedElement = item.selectedElements) === null || _item$selectedElement === void 0 ? void 0 : _item$selectedElement[0].contentItemId) && /*#__PURE__*/jsx(InfoIcon, {
-        item: item.selectedElements[0],
-        style: {
-          position: 'relative',
-          bottom: -16
-        }
-      }, item.selectedElements[0].codex)]
-    }), isMobile ? /*#__PURE__*/jsx(MobileDropdown, {
-      id: 'wcConfigurator-mobiledropdown-' + item.id,
-      onChange: onChangeMobile,
-      mobileOptions: mobileOptions,
-      selectedOption: selectedMobileOption
-    }) : /*#__PURE__*/jsx(Dropdown, {
-      className: 'wcConfigurator-dropdown-' + item.id,
-      controlClassName: wcDropDownSelect,
-      menuClassName: dropDownArea,
-      options: options,
-      value: selOption,
-      onChange: onChange
-    }), item.type == 'DROPDOWN_IMAGE' && (sel === null || sel === void 0 ? void 0 : sel.image) && /*#__PURE__*/jsx("img", {
-      className: image,
-      src: sel.image.replace('_gal.', '.')
-    }), paletteIsLastPalette && /*#__PURE__*/jsx("div", {
-      style: {
-        height: options.length * 32 + 10
-      }
-    })]
-  });
-};
-var index = observer(DropDowmText);
-
-export { index as default };

package/build/esm/index-6b0d0288.js

@@ -1,108 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-9bc78e81.js';
-import { useState, useEffect } from 'react';
-import { observer } from 'mobx-react-lite';
-import { useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
-import ConfettiExplosion from 'react-confetti-explosion';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-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 '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 bigExplodeProps = {
-  force: 0.6,
-  duration: 5000,
-  particleCount: 200,
-  floorHeight: 1600,
-  floorWidth: 1600
-};
-var ConfettiInSummary = function ConfettiInSummary(props) {
-  var _theme$palette$primar, _theme$palette, _theme$palette$primar2, _theme$palette2, _theme$palette$primar3, _theme$palette3;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    theme = _useDivaCore.state.theme;
-  var delay = viewHandler.getViewConfig().navigateMobileSwiper && viewHandler.getIsInMobileView();
-  var _useState = useState(!delay),
-    _useState2 = _slicedToArray(_useState, 2),
-    visible = _useState2[0],
-    setVisible = _useState2[1];
-  useEffect(function () {
-    if (!delay) return;
-    setTimeout(function () {
-      setVisible(true);
-    }, 300);
-  }, []);
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    shouldShowConfetti = _useState4[0],
-    setShouldShowConfetti = _useState4[1];
-  useEffect(function () {
-    var _viewHandler$uiState$, _viewHandler$uiState$2;
-    var confettiCooldownInHours = (_viewHandler$uiState$ = (_viewHandler$uiState$2 = viewHandler.uiState.ViewConfig.showConfettiInSummary) === null || _viewHandler$uiState$2 === void 0 ? void 0 : _viewHandler$uiState$2.confettiCooldownInHours) !== null && _viewHandler$uiState$ !== void 0 ? _viewHandler$uiState$ : 0;
-
-    //handeling strict mode
-    if (localStorage.getItem('lastConfettiSessionId') === DivaUtils.SessionId && localStorage.getItem('lastConfettiChange') == viewHandler.settingsState.configChanged.toString()) return;
-    if (confettiCooldownInHours > 0) {
-      var lastConfettiTime = localStorage.getItem('lastConfettiTime');
-      if (lastConfettiTime) {
-        var diff = Date.now() - Number(lastConfettiTime);
-        if (diff < confettiCooldownInHours * 60 * 60 * 1000) {
-          setShouldShowConfetti(false);
-          return;
-        }
-      }
-      // Set the timestamp only when we're actually going to show confetti
-      localStorage.setItem('lastConfettiTime', Date.now().toString());
-      localStorage.setItem('lastConfettiChange', viewHandler.settingsState.configChanged.toString());
-      setShouldShowConfetti(true);
-      return;
-    }
-
-    // Session-based logic (confettiCooldownInHours == 0)
-
-    if (localStorage.getItem('lastConfettiSessionId') === DivaUtils.SessionId) {
-      setShouldShowConfetti(false);
-      return;
-    }
-    // Set the session ID only when we're actually going to show confetti
-    localStorage.setItem('lastConfettiSessionId', DivaUtils.SessionId);
-    localStorage.setItem('lastConfettiChange', viewHandler.settingsState.configChanged.toString());
-    setShouldShowConfetti(true);
-  }, []);
-  if (!viewHandler.uiState.ViewConfig.showConfettiInSummary) return /*#__PURE__*/jsx(Fragment, {});
-  if (!shouldShowConfetti) return /*#__PURE__*/jsx(Fragment, {});
-  if (!viewHandler.isParentViewVisible) return /*#__PURE__*/jsx(Fragment, {});
-  var confettiProps = viewHandler.uiState.ViewConfig.showConfettiInSummary.confettiProps;
-  return /*#__PURE__*/jsx("div", {
-    style: {
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      width: '100%'
-    },
-    children: visible && /*#__PURE__*/jsx(ConfettiExplosion, _objectSpread(_objectSpread(_objectSpread({
-      zIndex: 1000001
-    }, bigExplodeProps), confettiProps !== null && confettiProps !== void 0 ? confettiProps : {}), {}, {
-      colors: [(_theme$palette$primar = (_theme$palette = theme.palette) === null || _theme$palette === void 0 || (_theme$palette = _theme$palette.primary) === null || _theme$palette === void 0 ? void 0 : _theme$palette.main) !== null && _theme$palette$primar !== void 0 ? _theme$palette$primar : '', (_theme$palette$primar2 = (_theme$palette2 = theme.palette) === null || _theme$palette2 === void 0 || (_theme$palette2 = _theme$palette2.primary) === null || _theme$palette2 === void 0 ? void 0 : _theme$palette2.dark) !== null && _theme$palette$primar2 !== void 0 ? _theme$palette$primar2 : '', (_theme$palette$primar3 = (_theme$palette3 = theme.palette) === null || _theme$palette3 === void 0 || (_theme$palette3 = _theme$palette3.primary) === null || _theme$palette3 === void 0 ? void 0 : _theme$palette3.light) !== null && _theme$palette$primar3 !== void 0 ? _theme$palette$primar3 : '']
-    }))
-  });
-};
-var ConfettiInSummary$1 = observer(ConfettiInSummary);
-
-export { ConfettiInSummary$1 as default };

package/build/esm/index-6b291fcd.js

@@ -1,47 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-9bc78e81.js';
-import { observer } from 'mobx-react-lite';
-import 'react';
-import NavBar from './index-7febd15f.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var wcConfiguratorProductCenter = "wcConfigurator-product-center-T-Vr3";
-var landscape = "landscape-mjn27";
-var fullscreen = "fullscreen-rBOrC";
-var portrait = "portrait-gNyhf";
-var inGridVisible = "in-grid-visible-8UlAH";
-var wcConfigurator3Dimage = "wcConfigurator-3dimage-10NCi";
-var wcConfiguratorArticleImage = "wcConfigurator-ArticleImage--2dad";
-var center = "center-eIYYK";
-var imageCenterOrbit = "imageCenterOrbit-m9ffC";
-var imageCenterStatic = "imageCenterStatic-Xu-zR";
-var css_248z = ".wcConfigurator-product-center-T-Vr3 {\n  position: absolute;\n  left: 0px;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  width: 100%;\n  transform: translateZ(0);\n}\n\n.landscape-mjn27.wcConfigurator-product-center-T-Vr3 {\n  height: calc(100% - 54.4px);\n  top: 54.4px;\n}\n\n.landscape-mjn27.wcConfigurator-product-center-T-Vr3 {\n  width: 45%;\n}\n\n.fullscreen-rBOrC.landscape-mjn27.wcConfigurator-product-center-T-Vr3 {\n  width: 100%;\n  top: 0px;\n  height: 100%;\n}\n\n.portrait-gNyhf.wcConfigurator-product-center-T-Vr3 {\n  width: 100%;\n  height: 100%;\n}\n.portrait-gNyhf.in-grid-visible-8UlAH.wcConfigurator-product-center-T-Vr3 {\n  height: calc(100% - 62px);\n  top: 62px;\n}\n\n.wcConfigurator-3dimage-10NCi {\n  width: 100%;\n  height: 100%;\n  position: absolute;\n}\n\n.wcConfigurator-ArticleImage--2dad {\n  width: 100%;\n  height: 100%;\n  position: relative;\n}\n\n.wcConfigurator-ArticleImage--2dad .center-eIYYK {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  width: auto;\n  height: auto;\n  max-width: 100%;\n  max-height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n  transform: translate(-50%, -50%);\n}\n.imageCenterOrbit-m9ffC {\n  box-sizing: inherit;\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0px;\n  left: 0px;\n  z-index: 5;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n\n.imageCenterStatic-Xu-zR {\n  box-sizing: inherit;\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0px;\n  left: 0px;\n  z-index: 5;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n";
-styleInject(css_248z);
-
-var Planner3DImage = function Planner3DImage(props) {
-  var viewHandler = useViewHandler();
-  return /*#__PURE__*/jsxs("div", {
-    ref: function ref(_ref) {
-      return viewHandler.productState.setImage3DElement(_ref);
-    },
-    className: wcConfigurator3Dimage,
-    id: "3DImage-Container",
-    style: {
-      // backgroundImage: viewHandler.productState.RenderImageURL,
-      visibility: viewHandler.productState.doShowRenderImage ? 'visible' : 'hidden'
-    },
-    children: [/*#__PURE__*/jsx(NavBar, {}), /*#__PURE__*/jsx("img", {
-      className: !viewHandler.productState.plannerRenderingIsStaticBG ? imageCenterOrbit : imageCenterStatic,
-      id: "diva3dImg",
-      draggable: "false",
-      src: viewHandler.productState.diva3dImgSrc
-    })]
-  });
-};
-var Planner3DImage$1 = observer(Planner3DImage);
-
-var index = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  'default': Planner3DImage$1
-});
-
-export { Planner3DImage$1 as P, wcConfiguratorArticleImage as a, index as b, center as c, fullscreen as f, inGridVisible as i, landscape as l, portrait as p, wcConfiguratorProductCenter as w };

package/build/esm/index-707c3b25.js

@@ -1,177 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-9bc78e81.js';
-import 'react';
-import { Rnd } from 'react-rnd';
-import { jsxs, 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/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-efJ5C";
-var header = "header-1CJv0";
-var headerTitle = "headerTitle-uXM2j";
-var closeBtn = "closeBtn-5GDgH";
-var body = "body-x-0by";
-var bodyScroll = "bodyScroll-7BmZx";
-var css_248z = ".container-efJ5C {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 6px;\n  overflow: hidden;\n  background: #fff;\n  z-index: 1500;\n}\n\n.header-1CJv0 {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: #f3f3f3;\n  border-bottom: 1px solid #e0e0e0;\n  cursor: move;\n  flex-shrink: 0;\n}\n\n.headerTitle-uXM2j {\n  font-weight: 600;\n  font-size: 14px;\n}\n\n.closeBtn-5GDgH {\n  background: none;\n  border: none;\n  font-size: 20px;\n  line-height: 1;\n  cursor: pointer;\n  padding: 0 4px;\n  color: #666;\n}\n\n.closeBtn-5GDgH:hover {\n  color: #333;\n}\n\n.body-x-0by {\n  flex: 1 1 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.bodyScroll-7BmZx {\n  flex: 1 1 0;\n  min-height: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n/* Dark mode – matches backoffice (portaled to body) */\nbody.darkmode .container-efJ5C {\n  background: rgb(20, 20, 20);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);\n}\n\nbody.darkmode .header-1CJv0 {\n  background: rgb(30, 30, 30);\n  border-bottom-color: rgba(255, 255, 255, 0.12);\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .headerTitle-uXM2j {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .closeBtn-5GDgH {\n  color: rgba(255, 255, 255, 0.65);\n}\n\nbody.darkmode .closeBtn-5GDgH:hover {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .body-x-0by {\n  background: rgb(20, 20, 20);\n  color: rgb(255, 255, 255);\n}\n";
-styleInject(css_248z);
-
-var SNAP_THRESHOLD = 24;
-
-/** Snaps position to viewport edges when within threshold (dock-style snapping). */
-function getSnappedBounds(x, y, width, height) {
-  var vw = window.innerWidth;
-  var vh = window.innerHeight;
-  var nx = x;
-  var ny = y;
-  if (x <= SNAP_THRESHOLD) nx = 0;
-  if (x + width >= vw - SNAP_THRESHOLD) nx = Math.max(0, vw - width);
-  if (y <= SNAP_THRESHOLD) ny = 0;
-  if (y + height >= vh - SNAP_THRESHOLD) ny = Math.max(0, vh - height);
-  return {
-    x: nx,
-    y: ny
-  };
-}
-/** Resize handle styles – positioned inside the container so they are not clipped by overflow:hidden. */
-var resizeHandleStyles = {
-  top: {
-    top: 0,
-    height: 12
-  },
-  right: {
-    right: 0,
-    left: 'auto',
-    width: 12
-  },
-  bottom: {
-    bottom: 0,
-    top: 'auto',
-    height: 12
-  },
-  left: {
-    left: 0,
-    width: 12
-  },
-  topRight: {
-    top: 0,
-    right: 0,
-    left: 'auto',
-    bottom: 'auto',
-    width: 16,
-    height: 16
-  },
-  bottomRight: {
-    bottom: 0,
-    right: 0,
-    left: 'auto',
-    top: 'auto',
-    width: 16,
-    height: 16
-  },
-  bottomLeft: {
-    bottom: 0,
-    left: 0,
-    right: 'auto',
-    top: 'auto',
-    width: 16,
-    height: 16
-  },
-  topLeft: {
-    top: 0,
-    left: 0,
-    right: 'auto',
-    bottom: 'auto',
-    width: 16,
-    height: 16
-  }
-};
-var FloatingWindow = function FloatingWindow(_ref) {
-  var windowType = _ref.windowType,
-    title = _ref.title,
-    bounds = _ref.bounds,
-    children = _ref.children;
-  var viewHandler = useViewHandler();
-  var handleDragStop = function handleDragStop(_e, d) {
-    var snapped = getSnappedBounds(d.x, d.y, bounds.width, bounds.height);
-    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, snapped);
-  };
-  var handleResizeStop = function handleResizeStop(_e, _direction, ref, _delta, position) {
-    var _ref$style$width, _ref$style$height;
-    var width = parseInt((_ref$style$width = ref.style.width) !== null && _ref$style$width !== void 0 ? _ref$style$width : String(bounds.width), 10);
-    var height = parseInt((_ref$style$height = ref.style.height) !== null && _ref$style$height !== void 0 ? _ref$style$height : String(bounds.height), 10);
-    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, {
-      x: position.x,
-      y: position.y,
-      width: width,
-      height: height
-    });
-  };
-  var handleClose = function handleClose() {
-    viewHandler.wysiwygDebugState.removeWysiwygWindow(windowType);
-  };
-  return /*#__PURE__*/jsxs(Rnd, {
-    position: {
-      x: bounds.x,
-      y: bounds.y
-    },
-    size: {
-      width: bounds.width,
-      height: bounds.height
-    },
-    onDragStop: function onDragStop(e, d) {
-      return handleDragStop(e, d);
-    },
-    onResizeStop: handleResizeStop,
-    dragHandleClassName: header,
-    minWidth: 280,
-    minHeight: 200,
-    className: container,
-    style: {
-      display: 'flex',
-      flexDirection: 'column'
-    },
-    bounds: "window",
-    resizeHandleStyles: resizeHandleStyles,
-    resizeHandleWrapperStyle: {
-      zIndex: 1000
-    },
-    children: [/*#__PURE__*/jsxs("div", {
-      className: header,
-      children: [/*#__PURE__*/jsx("span", {
-        className: headerTitle,
-        children: title
-      }), /*#__PURE__*/jsx("button", {
-        type: "button",
-        className: closeBtn,
-        onClick: handleClose,
-        "aria-label": "Close",
-        children: "\xD7"
-      })]
-    }), /*#__PURE__*/jsx("div", {
-      className: body,
-      children: /*#__PURE__*/jsx("div", {
-        className: bodyScroll,
-        children: children
-      })
-    })]
-  });
-};
-
-export { FloatingWindow as default };

package/build/esm/index-7133ee9a.js

@@ -1,85 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-9bc78e81.js';
-import 'react';
-import { observer } from 'mobx-react-lite';
-import { jsxs, 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 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var teaserContainer = "teaserContainer--DnKQ";
-var emoji = "emoji-R0ay8";
-var title = "title-PeINh";
-var description = "description-dcuP6";
-var button = "button-0gvSY";
-var buttonText = "buttonText-HqWTX";
-var arrow = "arrow-9YFFk";
-var css_248z = ".teaserContainer--DnKQ {\n  background-color: #e6f0fa;\n  background-color: var(--diva-theme-palette-primary-light, #e6f0fa);\n  padding: 12px 16px;\n  border-radius: 8px;\n  text-align: center;\n  margin: 8px 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 4px;\n  font-family: inherit;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.emoji-R0ay8 {\n  font-size: 28px;\n  margin-bottom: 2px;\n}\n\n.title-PeINh {\n  font-weight: 700;\n  font-size: 16px;\n  color: #000;\n  margin: 0;\n  line-height: 1.2;\n}\n\n.description-dcuP6 {\n  font-size: 15px;\n  color: #333;\n  margin: 0;\n  line-height: 1.4;\n}\n.mobile .description-dcuP6 {\n  font-size: 13px;\n}\n\n.button-0gvSY {\n  margin-top: 10px;\n  border: 2px solid #ff6b00;\n  border: 2px solid var(--primaryColor, #ff6b00);\n  color: #ff6b00;\n  color: var(--primaryColor, #ff6b00);\n  background: #fff;\n  padding: 6px 16px;\n  border-radius: 6px;\n  font-weight: 700;\n  font-size: 15px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  transition: all 0.2s ease;\n  width: 100%;\n  max-width: 280px;\n  box-sizing: border-box;\n  min-height: 40px;\n}\n\n.button-0gvSY:hover {\n  background-color: #ff6b00;\n  background-color: var(--primaryColor, #ff6b00);\n  color: #fff;\n}\n\n.buttonText-HqWTX {\n  flex: 1;\n  text-align: center;\n  padding: 0 24px;\n}\n\n.arrow-9YFFk {\n  position: absolute;\n  right: 12px;\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.arrow-9YFFk svg {\n  width: 100%;\n  height: 100%;\n}\n";
-styleInject(css_248z);
-
-var isUrl = function isUrl(id) {
-  return /^https?:\/\//.test(id);
-};
-var ContentItemTeaser = function ContentItemTeaser(_ref) {
-  var item = _ref.item;
-  var viewHandler = useViewHandler();
-  var onClick = function onClick() {
-    if (isUrl(item.id)) {
-      window.open(item.id, '_blank', 'noopener,noreferrer');
-    } else {
-      viewHandler.settingsState.onClickContentItemId(item.id);
-    }
-  };
-  return /*#__PURE__*/jsxs("div", {
-    className: teaserContainer,
-    children: [item.emoji && /*#__PURE__*/jsx("div", {
-      className: emoji,
-      children: item.emoji
-    }), /*#__PURE__*/jsx("div", {
-      className: title,
-      children: item.title
-    }), /*#__PURE__*/jsx("div", {
-      className: description,
-      children: item.description
-    }), item.id && /*#__PURE__*/jsxs("button", {
-      className: button,
-      onClick: onClick,
-      children: [/*#__PURE__*/jsx("span", {
-        className: buttonText,
-        children: item.buttonText
-      }), /*#__PURE__*/jsx("div", {
-        className: arrow,
-        children: /*#__PURE__*/jsx("svg", {
-          viewBox: "0 0 24 24",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /*#__PURE__*/jsx("path", {
-            d: "M5 12H19M19 12L13 6M19 12L13 18",
-            stroke: "currentColor",
-            strokeWidth: "2.5",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          })
-        })
-      })]
-    })]
-  });
-};
-var ContentItemTeaser$1 = observer(ContentItemTeaser);
-
-export { ContentItemTeaser$1 as default };