@crystaldesign/diva-web-planner-react 24.13.0-rc.1 → 24.13.0-rc.11

package/build/esm/index-b4ddb4c4.js

@@ -0,0 +1,144 @@
+import { s as styleInject, u as useViewHandler } from './index-ce87f7de.js';
+import { useEffect } from 'react';
+import Inputbox from './index-df7a33ec.js';
+import { cssVariables } from './index-183e9fc5.js';
+import Product from './index-1a87c845.js';
+import Settings from './index-8b5419cd.js';
+import TabGroup from './index-4bb65f07.js';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import { jsxs, Fragment, 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/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-55c0cdca.js';
+import './index-49d3d9e9.js';
+import 'react-switch';
+import 'react-dropdown';
+import './index-ffb720fc.js';
+import './index-b28b0025.js';
+import './index-69cef507.js';
+import './index-af1e9037.js';
+import './index-1685d700.js';
+import './index.module-eff37708.js';
+import './index-f8778a3f.js';
+import './index-cba8cab8.js';
+import './index-e43ba6f5.js';
+import './index-45505dc8.js';
+import './index-3689e8ae.js';
+import './index-d4d5855e.js';
+import '@crystaldesign/content-box';
+import './index-9a145dc1.js';
+import './index-7af609f9.js';
+import '@crystaldesign/content-item';
+import 'react-draggable';
+import './index-5c185263.js';
+import './index-1a256308.js';
+import './index-175264f5.js';
+import './index-d99ae8ad.js';
+import './index-2cf2eea2.js';
+import 'react-laag';
+import './index-753c0fb3.js';
+import './index-4ba18281.js';
+import './index-f78b8477.js';
+import 'sift';
+import './index-a60eb5fa.js';
+import './index-48bc8015.js';
+import './index-7a78ad57.js';
+import './index-0fff6797.js';
+import './index.module-14f56ab1.js';
+import './index-db9a16bf.js';
+import './index-a5450a70.js';
+import './index-a3daa5a9.js';
+import './index-6f8757a5.js';
+import './index-5864e079.js';
+import './index-f0963d23.js';
+import './index-c5090889.js';
+import './index-6cfe98da.js';
+import './index-bf1b50f0.js';
+import './index-209167a0.js';
+import './index-35f0e1b5.js';
+import '@crystaldesign/products-component';
+import './index-dd3daa4c.js';
+import './index-e2501f39.js';
+import './index-963c2609.js';
+import './index-2fd411f3.js';
+import './index-4791c330.js';
+import './index-8458683f.js';
+import './index-aa60b338.js';
+import './index-f9137c02.js';
+import './index-929c48ac.js';
+import './index-8d84988b.js';
+import './index-187d8892.js';
+import './index-d3843e8a.js';
+import './index-a2f8eddd.js';
+import './index.module-d8319912.js';
+import './index-ace1d448.js';
+import './index-8f8042bb.js';
+import './index-164f15d2.js';
+import './index-e4a6cba3.js';
+import './index-7be72a93.js';
+import './index-89124c27.js';
+import './index-c7d941bf.js';
+import './index.module-6bd9ce8e.js';
+import './index-601f8736.js';
+import './index-bce9b667.js';
+import './index-e5086900.js';
+import './index-69eb925a.js';
+import './index-e17be87d.js';
+import './index-e6566e4f.js';
+import './index-664a0bb2.js';
+import './index-9dc929f5.js';
+
+var wcConfigurator = "wcConfigurator-VvOGT";
+var wcConfiguratorSteps = "wc-configurator-steps-CYXm7";
+var wcConfiguratorProduct = "wc-configurator-product-Z3rOO";
+var productList = "product-list-18YTy";
+var wcConfiguratorSettings = "wc-configurator-Settings-On8Ph";
+var css_248z = "body {\n  margin: 0;\n  overscroll-behavior-x: none;\n}\n\n.wcConfigurator-VvOGT {\n  position: relative;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  -webkit-font-smoothing: antialiased;\n  -webkit-touch-callout: none; /* iOS Safari */\n  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */\n  -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently*/\n\n  position: relative;\n  height: 100%;\n  width: 100%;\n  display: flex;\n}\n\n.wcConfigurator-VvOGT *,\n.wcConfigurator-VvOGT *::before,\n.wcConfigurator-VvOGT *::after {\n  box-sizing: content-box;\n  box-sizing: initial;\n}\n\n.wc-configurator-steps-CYXm7 {\n  width: 75px;\n  position: relative;\n}\n.wc-configurator-product-Z3rOO {\n  width: calc(100% - 501px);\n  position: relative;\n  overflow: auto;\n}\n.wc-configurator-product-Z3rOO.product-list-18YTy {\n  display: none;\n}\n\n.wc-configurator-Settings-On8Ph.product-list-18YTy {\n  flex-grow: 1;\n  position: relative;\n  overflow: auto;\n}\n\n.wc-configurator-Settings-On8Ph {\n  width: 426px;\n  position: relative;\n  border-right: 1px solid #e6e6e6;\n}\n\n::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n::-webkit-scrollbar-track {\n  background: #dfdfdf;\n  border-radius: 3px;\n}\n::-webkit-scrollbar-thumb {\n  background: #b1b1b1;\n  border-radius: 3px;\n}\n";
+styleInject(css_248z);
+
+var Serious = function Serious(props) {
+  var _viewHandler$tabGroup;
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.layoutRendered = true;
+    viewHandler.initCSSVariablesObj(cssVariables);
+  }, []);
+  var currentIsProductList = ((_viewHandler$tabGroup = viewHandler.tabGroupState.curTabGroup) === null || _viewHandler$tabGroup === void 0 ? void 0 : _viewHandler$tabGroup.type) == 'PRODUCTS';
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      ref: function ref(configuratorRef) {
+        return viewHandler.uiState.setConfiguratorRef(configuratorRef);
+      },
+      style: {
+        pointerEvents: viewHandler.uiState.configuratorDisabled ? 'none' : undefined
+      },
+      hidden: viewHandler.uiState.configuratorHidden,
+      id: "wcConfigurator",
+      className: wcConfigurator,
+      children: [/*#__PURE__*/jsx(Product, {
+        className: classnames(wcConfiguratorProduct, currentIsProductList ? productList : undefined),
+        contentItemStartPos: "left"
+      }), /*#__PURE__*/jsx(Settings, {
+        className: classnames(wcConfiguratorSettings, currentIsProductList ? productList : undefined)
+      }), /*#__PURE__*/jsx(TabGroup, {
+        className: wcConfiguratorSteps
+      })]
+    }), viewHandler.settingsState.inputBoxVisible && /*#__PURE__*/jsx(Inputbox, {})]
+  });
+};
+var index = observer(Serious);
+
+export { index as default };

package/build/esm/index-b6e14398.js

@@ -0,0 +1,30 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-ce87f7de.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import ActionNavigation from './index-e82d5a29.js';
+import { jsx } from 'react/jsx-runtime';
+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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+
+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 ActionNavigationGold = function ActionNavigationGold(props) {
+  return /*#__PURE__*/jsx(ActionNavigation, _objectSpread(_objectSpread({}, props), {}, {
+    showBackButtonText: true
+  }));
+};
+var index = observer(ActionNavigationGold);
+
+export { index as default };

package/build/esm/index-b7131834.js

@@ -0,0 +1,91 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { s as styleInject } from './index-ce87f7de.js';
+import { observer } from 'mobx-react-lite';
+import AccessoiresStandard from './index-0f24987e.js';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'react-laag';
+import './index-2fd411f3.js';
+import './index-4791c330.js';
+import './index-eda52f52.js';
+import 'react-collapsible';
+import './index-6184f1c0.js';
+import './index-f78b8477.js';
+import 'sift';
+import './index-a60eb5fa.js';
+import './index-1a256308.js';
+import './index-48bc8015.js';
+import './index-7a78ad57.js';
+import './index-0fff6797.js';
+import './index.module-14f56ab1.js';
+import './index-49d3d9e9.js';
+import 'react-switch';
+import './index-db9a16bf.js';
+import './index-a5450a70.js';
+import 'react-dropdown';
+import './index-a3daa5a9.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-6f8757a5.js';
+import './index-5864e079.js';
+import './index-f0963d23.js';
+import '@crystaldesign/content-box';
+import './index-c5090889.js';
+import './index-6cfe98da.js';
+import './index-bf1b50f0.js';
+import './index-209167a0.js';
+import './index-35f0e1b5.js';
+import '@crystaldesign/products-component';
+import './index-dd3daa4c.js';
+import './index-e2501f39.js';
+import './index-963c2609.js';
+import './index-8458683f.js';
+import './index-aa60b338.js';
+import './index-f9137c02.js';
+import './index-929c48ac.js';
+import './index-8d84988b.js';
+import './index-187d8892.js';
+import './index-d3843e8a.js';
+import './index-a2f8eddd.js';
+import './index.module-d8319912.js';
+import './index-ace1d448.js';
+import './index-8f8042bb.js';
+import './index-164f15d2.js';
+import './index-e4a6cba3.js';
+import './index-7be72a93.js';
+import './index-89124c27.js';
+import './index-c7d941bf.js';
+import './index.module-6bd9ce8e.js';
+import './index-601f8736.js';
+import './index-bce9b667.js';
+
+var wcAccInfoContainer = "wcAccInfoContainer-gHZnB";
+var wcConfiguratorSettingsTitle = "wcConfigurator-settings-title--6avT";
+var css_248z = ".wcAccInfoContainer-gHZnB {\n  float: left;\n  position: relative;\n  height: 100%;\n  max-width: 160px;\n}\n\n.wcConfigurator-settings-title--6avT {\n  display: -webkit-box;\n  float: left;\n  max-height: 150px;\n  min-height: 16px;\n  margin-top: 8px;\n  max-width: 100%;\n  color: var(--secondaryColor);\n  font-size: 20px;\n  font-weight: 300;\n  line-height: 20.8px;\n  overflow: hidden;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  position: relative;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  z-index: 100;\n}\n\n.wcConfigurator-settings-title--6avT:hover {\n  max-height: 608px;\n  -webkit-line-clamp: 30;\n  overflow: visible;\n  background: #fff;\n  z-index: 150;\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 AccessoiresSerious = function AccessoiresSerious(props) {
+  return /*#__PURE__*/jsx(AccessoiresStandard, _objectSpread(_objectSpread({}, props), {}, {
+    wcAccInfoContainerClass: wcAccInfoContainer,
+    wcConfiguratorSettingsTitleClass: wcConfiguratorSettingsTitle,
+    hidePrice: true,
+    hideSize: true
+  }));
+};
+var index = observer(AccessoiresSerious);
+
+export { index as default };

package/build/esm/index-b7b6db43.js

@@ -0,0 +1,44 @@
+import './index-ce87f7de.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 '@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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var Trash = function Trash(_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.trash, plannerUIProps.classes.buttonGeneral),
+    id: "testDel",
+    children: item.posNr
+  });
+};
+var Trash$1 = observer(Trash);
+
+export { Trash$1 as default };

package/build/esm/index-bc03bcb1.js

@@ -0,0 +1,187 @@
+import { s as styleInject, u as useViewHandler } from './index-ce87f7de.js';
+import { useEffect } from 'react';
+import Inputbox from './index-df7a33ec.js';
+import Settings from './index-8b5419cd.js';
+import TabGroup from './index-4bb65f07.js';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import Toolbar from './index-037a55a7.js';
+import NavigationButtons from './index-99d787a5.js';
+import { jsxs, Fragment, 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/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-5c185263.js';
+import './index-1a256308.js';
+import './index-175264f5.js';
+import './index-d99ae8ad.js';
+import './index-2cf2eea2.js';
+import 'react-laag';
+import './index-753c0fb3.js';
+import './index-4ba18281.js';
+import './index-f78b8477.js';
+import 'sift';
+import './index-a60eb5fa.js';
+import './index-48bc8015.js';
+import './index-7a78ad57.js';
+import './index-0fff6797.js';
+import './index.module-14f56ab1.js';
+import './index-49d3d9e9.js';
+import 'react-switch';
+import './index-db9a16bf.js';
+import './index-a5450a70.js';
+import 'react-dropdown';
+import './index-a3daa5a9.js';
+import './index-6f8757a5.js';
+import './index-5864e079.js';
+import './index-f0963d23.js';
+import '@crystaldesign/content-box';
+import './index-c5090889.js';
+import './index-6cfe98da.js';
+import './index-bf1b50f0.js';
+import './index-209167a0.js';
+import './index-35f0e1b5.js';
+import '@crystaldesign/products-component';
+import './index-dd3daa4c.js';
+import './index-e2501f39.js';
+import './index-963c2609.js';
+import './index-2fd411f3.js';
+import './index-4791c330.js';
+import './index-8458683f.js';
+import './index-aa60b338.js';
+import './index-f9137c02.js';
+import './index-929c48ac.js';
+import './index-8d84988b.js';
+import './index-187d8892.js';
+import './index-d3843e8a.js';
+import './index-a2f8eddd.js';
+import './index.module-d8319912.js';
+import './index-ace1d448.js';
+import './index-8f8042bb.js';
+import './index-164f15d2.js';
+import './index-e4a6cba3.js';
+import './index-7be72a93.js';
+import './index-89124c27.js';
+import './index-c7d941bf.js';
+import './index.module-6bd9ce8e.js';
+import './index-601f8736.js';
+import './index-bce9b667.js';
+import './index-e5086900.js';
+import './index-69eb925a.js';
+import './index-e17be87d.js';
+import './index-e6566e4f.js';
+import './index-664a0bb2.js';
+import './index-9dc929f5.js';
+import './index-26e07b19.js';
+import './index-ad3178c5.js';
+import './index.module-9e919dd5.js';
+import './index-006ec484.js';
+import './index-f7faf0d1.js';
+import './index-51549d6b.js';
+import 'react-collapsible';
+import './index-86fbea86.js';
+import './index-cf2ef07d.js';
+import './index.module-c4053556.js';
+import 'react-json-view';
+import './index-883d8977.js';
+import './index.module-01eb9be5.js';
+import './index-e2943203.js';
+import 'jsoneditor';
+import './index-eecd2bbb.js';
+import './index-3d7150c5.js';
+import './index-66cff8a4.js';
+import './index-dc18de55.js';
+import './index-07c806db.js';
+import './index.module-5d8a0d96.js';
+import './index-0419b661.js';
+import './index-7fec2840.js';
+import './index-4bc57d97.js';
+import './index-2617f9fc.js';
+import './index.module-f932477d.js';
+import './index-a7acc864.js';
+import './index-bd545c2f.js';
+import './index-f142eae0.js';
+import './index-9b45d7b1.js';
+import './index-efb85af3.js';
+import './index-3e1c47a5.js';
+import './index-80635175.js';
+import './CatalogProperties-aa5a93f8.js';
+import './ArticleProperties-9ac5c853.js';
+import './OptionProperties-7674c180.js';
+import './OptionValueProperties-7363593b.js';
+import 'react-select';
+
+var wcConfigurator = "wcConfigurator-XqlAg";
+var wcConfiguratorSteps = "wc-configurator-steps-KdP9s";
+var mobile = "mobile-PPTgR";
+var wcConfiguratorSettings = "wc-configurator-Settings-dVmBR";
+var wcConfiguratorSettingsActions = "wcConfigurator-settings-actions-yVOyu";
+var css_248z = ".wcConfigurator-XqlAg {\n  position: relative;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  -webkit-font-smoothing: antialiased;\n  -webkit-touch-callout: none; /* iOS Safari */\n  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */\n  -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently*/\n\n  position: relative;\n  height: 100%;\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n}\n\n.wcConfigurator-XqlAg *,\n.wcConfigurator-XqlAg *::before,\n.wcConfigurator-XqlAg *::after {\n  box-sizing: content-box;\n  box-sizing: initial;\n}\n\n.wc-configurator-steps-KdP9s {\n  height: 56px;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  margin: 0 8px;\n}\n.mobile-PPTgR .wc-configurator-steps-KdP9s {\n  height: 40px;\n}\n\n.wc-configurator-Settings-dVmBR {\n  height: calc(100% - 56px - 42px - 40px);\n  position: relative;\n  border-right: 1px solid #e6e6e6;\n}\n\n.mobile-PPTgR .wc-configurator-Settings-dVmBR {\n  height: calc(100% - 40px - 42px - 40px);\n}\n\n.wcConfigurator-settings-actions-yVOyu {\n  height: 40px;\n  z-index: 1001;\n}\n";
+styleInject(css_248z);
+
+var Wysiwyg = function Wysiwyg(props) {
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.layoutRendered = true;
+    viewHandler.initCSSVariablesObj(cssVariables);
+  }, []);
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      ref: function ref(configuratorRef) {
+        return viewHandler.uiState.setConfiguratorRef(configuratorRef);
+      },
+      style: {
+        pointerEvents: viewHandler.uiState.configuratorDisabled ? 'none' : undefined
+      },
+      hidden: viewHandler.uiState.configuratorHidden,
+      id: "wcConfigurator",
+      className: classnames(wcConfigurator, viewHandler.getIsInMobileView() ? mobile : undefined),
+      children: [/*#__PURE__*/jsx(TabGroup, {
+        className: wcConfiguratorSteps
+      }), /*#__PURE__*/jsx(Settings, {
+        className: wcConfiguratorSettings
+      }), /*#__PURE__*/jsx(NavigationButtons, {
+        className: wcConfiguratorSettingsActions,
+        showBackButtonText: true
+      }), /*#__PURE__*/jsx(Toolbar, {})]
+    }), viewHandler.settingsState.inputBoxVisible && /*#__PURE__*/jsx(Inputbox, {})]
+  });
+};
+var cssVariables = {
+  '--primaryColor': '#df2927',
+  '--secondaryColor': '#404040',
+  '--thirdColor': '#8a8a8a',
+  '--globalBorderRadius': '3px',
+  '--galleryItemRadius': '3px',
+  '--articlePosNrRadius': '3px',
+  '--articlePosNrSize': '20.8px',
+  '--articlePosNrFontSize': '16px',
+  '--settingsBackgroundColor': '#fefefe',
+  '--settingsScrollerPaddingTopBottom': '30px',
+  '--settingsScrollerPaddingRight': '30px',
+  '--settingsScrollerPaddingLeft': '30px',
+  '--tabGroupBackground': 'var(--thirdColor)',
+  '--foldArrowMarginRight': '16px',
+  '--configuratorActionWidthForthBackSpacer': '0.1rem',
+  '--configuratorActionForthWidth': 'calc(50% - calc(var(--configuratorActionWidthForthBackSpacer) / 2) - 2px)',
+  '--configuratorActionBackWidth': 'calc(50% - calc(var(--configuratorActionWidthForthBackSpacer) / 2) - 2px)',
+  '--lineHeight1': '36.8px',
+  '--fontWeight1': '600',
+  '--boxShadowHover': '0px 1px 4px rgba(0, 0, 0, 0.15)',
+  '--boxShadowActive': '0px 1px 4px rgba(0, 0, 0, 0.3)',
+  '--itemsMargin': '0.3125rem'
+};
+var index = observer(Wysiwyg);
+
+export { cssVariables, index as default };

package/build/esm/index-bce9b667.js

@@ -0,0 +1,52 @@
+import { s as styleInject, u as useViewHandler } from './index-ce87f7de.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import classnames from 'classnames';
+import { useTranslation } 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/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';
+
+var wrapper = "wrapper-93hIM";
+var button = "button-smefE";
+var sel = "sel-vzSUc";
+var disabled = "disabled-l3E8B";
+var css_248z = ".wrapper-93hIM {\n  position: sticky;\n  top: -1px;\n  z-index: 500;\n  display: flex;\n  justify-content: space-around;\n  gap: 16px;\n  background-color: var(--settingsBackgroundColor);\n  padding: 6px;\n}\n\n.button-smefE {\n  transition: color 0.3s ease, border 0.3s ease;\n  cursor: pointer;\n  text-wrap: nowrap;\n  white-space: nowrap;\n  position: relative;\n  flex-grow: 1;\n  text-align: center;\n  padding-top: 4px;\n  padding-bottom: 4px;\n  font-size: 18px;\n}\n\n.button-smefE:hover,\n.sel-vzSUc {\n  border: none;\n  color: var(--diva-theme-palette-primary-main);\n}\n\n.button-smefE::after {\n  content: '';\n  position: absolute;\n  width: 0px;\n  left: 50%;\n  transition: all ease-in-out 0.2s;\n  bottom: 0;\n  height: 1px;\n  background-color: var(--diva-theme-palette-primary-main);\n}\n\n.button-smefE.sel-vzSUc::after {\n  height: 2px;\n}\n\n.button-smefE:hover::after,\n.sel-vzSUc::after {\n  width: 100%;\n  left: 0;\n}\n.disabled-l3E8B.button-smefE:hover::after {\n  width: 0px;\n  left: 0;\n}\n\n.disabled-l3E8B.button-smefE::after {\n  background-color: lightgray;\n}\n\n.disabled-l3E8B.button-smefE {\n  color: grey;\n  cursor: not-allowed;\n}\n";
+styleInject(css_248z);
+
+var ReplaceSwitch = function ReplaceSwitch(props) {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wrapper),
+    children: [/*#__PURE__*/jsx("div", {
+      onClick: function onClick() {
+        return viewHandler.paletteViewHandler.setPlannerReplaceMode(false, true);
+      },
+      className: classnames(button, !viewHandler.settingsState.plannerReplaceMode ? sel : undefined),
+      id: "configurator_plan_tab",
+      children: t('configurator.plan')
+    }), /*#__PURE__*/jsx("div", {
+      onClick: function onClick() {
+        if (viewHandler.settingsState.plannerReplaceModeAvailable) viewHandler.paletteViewHandler.setPlannerReplaceMode(true, true);
+      },
+      className: classnames(button, viewHandler.settingsState.plannerReplaceMode ? sel : undefined, !viewHandler.settingsState.plannerReplaceModeAvailable ? disabled : undefined),
+      id: "configurator_replace_tab",
+      children: t('configurator.replace')
+    })]
+  });
+};
+var ReplaceSwitch$1 = observer(ReplaceSwitch);
+
+export { ReplaceSwitch$1 as default };