@crystaldesign/diva-web-planner-react 25.9.0-beta.9 → 25.9.0-rc.1

package/build/esm/index-8059fd35.js

@@ -0,0 +1,32 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-e0c6b93d.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 '@crystaldesign/widget-contact-form';
+
+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 ProductFooter = function ProductFooter(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Product/ProductFooter"
+  }));
+};
+
+export { ProductFooter as default };

package/build/esm/index-82944be0.js

@@ -0,0 +1,87 @@
+import { u as useViewHandler } from './index-e0c6b93d.js';
+import { observer } from 'mobx-react-lite';
+import React, { Suspense } from 'react';
+import Planner2DGrid from './index-6fafabe0.js';
+import Planner3DImage from './index-9db055a0.js';
+import { w as wcConfiguratorProductCenter, p as portrait, l as landscape, s as settingsHidden, i as inGridVisible, f as fullscreen, a as wcConfiguratorArticleImage, c as center, b as foldback, d as foldbackLeft, e as foldup } from './index.module-8f869cc4.js';
+import classnames from 'classnames';
+import Planner3DGrid from './index-ca7f3d9e.js';
+import PlannerMsgContainer from './index-4e45ce76.js';
+import PlannerUIVariant from './index-4ba394fb.js';
+import RotateInfo from './index-41b5b357.js';
+import PromotedOpvs from './index-1cad1f93.js';
+import OrbitInteraction from './index-c1da6810.js';
+import MobileNavIcons from './index-fff0113a.js';
+import { jsxs, jsx, Fragment } 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 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import '@crystaldesign/widget-contact-form';
+import './index-707613bc.js';
+import './index-2fbb7efc.js';
+import '@crystaldesign/content-box';
+import './index-2ccae45f.js';
+import 'react-laag';
+import './index-61b6b02e.js';
+import 'react-qr-code';
+import './index-6f97ec29.js';
+
+var Planner3D = /*#__PURE__*/React.lazy(function () {
+  return import('./index-32e52f0d.js');
+});
+var PlannerRTV = /*#__PURE__*/React.lazy(function () {
+  return import('./index-c6db9a7a.js');
+});
+var ProductCenter = function ProductCenter(_ref) {
+  var style = _ref.style,
+    _ref$folderPosition = _ref.folderPosition,
+    folderPosition = _ref$folderPosition === void 0 ? 'right' : _ref$folderPosition;
+  var viewHandler = useViewHandler();
+  var showFolderButton = !viewHandler.uiState.ViewConfig.hideMobileFolder || viewHandler.uiState.ViewConfig.showSettingsFolder && viewHandler.productState.promotionVisible;
+  var showFoldup = !viewHandler.uiState.ViewConfig.hideMobileFolder && !viewHandler.uiState.configSettingsIsFoldedUp && !viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isMobilePortrait && !viewHandler.productState.roomListExpanded;
+  var showFoldDown = viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isInMobileView || viewHandler.uiState.ViewConfig.showSettingsFolder && viewHandler.productState.promotionVisible;
+  var showOrbitCube = viewHandler.productState.doShowRenderImage && (!viewHandler.uiState.ViewConfig.dontShowOrbitInMobile || !viewHandler.getIsInMobileView()) && viewHandler.viewPlannerHandler.getCurPlannerViewMode() == '3DImage' && viewHandler.productState.doShowRenderImage && !viewHandler.productState.plannerRenderingIsStaticBG;
+  return /*#__PURE__*/jsxs("div", {
+    style: style,
+    className: classnames(wcConfiguratorProductCenter, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.configSettingsIsHidden ? settingsHidden : undefined, viewHandler.productState.doShowGrid ? inGridVisible : undefined, fullscreen),
+    children: [/*#__PURE__*/jsx(PlannerMsgContainer, {}), /*#__PURE__*/jsx(Planner3DImage, {}), viewHandler.productState.allow3DComb && viewHandler.isParentViewVisible && /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx(Fragment, {}),
+      children: /*#__PURE__*/jsx(Planner3D, {})
+    }), /*#__PURE__*/jsx(Planner3DGrid, {}), (viewHandler.productState.allowRTV || viewHandler.productState.allowQRCodeAR) && viewHandler.isParentViewVisible && /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx(Fragment, {}),
+      children: /*#__PURE__*/jsx(PlannerRTV, {})
+    }), showOrbitCube && /*#__PURE__*/jsx(OrbitInteraction, {}), /*#__PURE__*/jsx(Planner2DGrid, {}), viewHandler.uiState.isInMobileView && /*#__PURE__*/jsx(MobileNavIcons, {}), /*#__PURE__*/jsx(RotateInfo, {}), /*#__PURE__*/jsx(PromotedOpvs, {}), !viewHandler.productState.hidePlannerUiIcons && !(viewHandler.productState.doShowRTV || viewHandler.productState.doShow3DComb) && /*#__PURE__*/jsx(PlannerUIVariant, {}), viewHandler.productState.plannerMode == 'No' && /*#__PURE__*/jsx("div", {
+      className: wcConfiguratorArticleImage,
+      children: viewHandler.productState.articleImage && /*#__PURE__*/jsx("img", {
+        src: viewHandler.productState.articleImage,
+        className: center
+      })
+    }), showFolderButton && /*#__PURE__*/jsxs(Fragment, {
+      children: [showFoldDown && /*#__PURE__*/jsx("div", {
+        className: classnames(foldback, folderPosition === 'left' ? foldbackLeft : undefined),
+        onClick: viewHandler.uiState.onClickHideConfigSettings,
+        id: "btnFoldDown"
+      }), showFoldup && /*#__PURE__*/jsx("div", {
+        id: "btnFoldUp",
+        className: classnames(foldup),
+        onClick: viewHandler.uiState.onClickFoldupConfigSettings
+      })]
+    })]
+  });
+};
+var ProductCenter$1 = observer(ProductCenter);
+
+export { ProductCenter$1 as default };

package/build/esm/index-832ca166.js

@@ -0,0 +1,169 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { u as useViewHandler } from './index-e0c6b93d.js';
+import { observer } from 'mobx-react-lite';
+import { useState } from 'react';
+import { w as wrapper, t as tabs, s as sel, a as selectionWrapper, b as selectionText, c as selection, T as Table } from './index-bf59b152.js';
+import classnames from 'classnames';
+import properties from './CatalogProperties-0b9457e5.js';
+import properties$1 from './ArticleProperties-ee272d6c.js';
+import properties$2 from './OptionProperties-4d329d18.js';
+import properties$3 from './OptionValueProperties-1a36b82d.js';
+import Select from 'react-select';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+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 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import '@crystaldesign/widget-contact-form';
+import './index-16cea8f1.js';
+import 'react-switch';
+
+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 PropertiesEditor = function PropertiesEditor(props) {
+  var _catalogData$allCatal, _allArticles$find, _allOptions$find, _allOptionsValues$fin;
+  var viewHandler = useViewHandler();
+  var catalogData = viewHandler.divaWebPlanner.getCatalogData();
+  var _useState = useState('catalog'),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentProperties = _useState2[0],
+    setCurrentProperties = _useState2[1];
+  var allArticles = Object.values((_catalogData$allCatal = catalogData === null || catalogData === void 0 ? void 0 : catalogData.allCatalogArticles) !== null && _catalogData$allCatal !== void 0 ? _catalogData$allCatal : {});
+  var allOptions = catalogData === null || catalogData === void 0 ? void 0 : catalogData.getOptions();
+  var allOptionsValues = catalogData === null || catalogData === void 0 ? void 0 : catalogData.getOptionValues();
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentArticleCodex = _useState4[0],
+    setCurrentArticleCodex = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    currentOptionCodex = _useState6[0],
+    setCurrentOptionCodex = _useState6[1];
+  var _useState7 = useState(''),
+    _useState8 = _slicedToArray(_useState7, 2),
+    currentOptionValueCodex = _useState8[0],
+    setCurrentOptionValueCodex = _useState8[1];
+  if (!catalogData) return /*#__PURE__*/jsx(Fragment, {});
+  var dataDictionary = {
+    catalog: {
+      data: catalogData.catalogProps,
+      properties: properties
+    },
+    article: {
+      data: allArticles === null || allArticles === void 0 || (_allArticles$find = allArticles.find(function (a) {
+        return a.articleCodex === currentArticleCodex;
+      })) === null || _allArticles$find === void 0 ? void 0 : _allArticles$find.catalogArticle,
+      properties: properties$1
+    },
+    option: {
+      data: allOptions === null || allOptions === void 0 || (_allOptions$find = allOptions.find(function (o) {
+        return o.codex === currentOptionCodex;
+      })) === null || _allOptions$find === void 0 ? void 0 : _allOptions$find.opt,
+      properties: properties$2
+    },
+    optionvalue: {
+      data: allOptionsValues === null || allOptionsValues === void 0 || (_allOptionsValues$fin = allOptionsValues.find(function (o) {
+        return o.codex === currentOptionValueCodex;
+      })) === null || _allOptionsValues$fin === void 0 ? void 0 : _allOptionsValues$fin.opv,
+      properties: properties$3
+    }
+  };
+  var tabsArray = ['catalog', 'article', 'option', 'optionvalue'];
+  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(wrapper, props.className),
+    children: [/*#__PURE__*/jsx("div", {
+      className: tabs,
+      children: tabsArray.map(function (t) {
+        return /*#__PURE__*/jsx("div", {
+          className: classnames(currentProperties === t ? sel : undefined),
+          onClick: function onClick() {
+            return setCurrentProperties(t);
+          },
+          children: t
+        }, t);
+      })
+    }), currentProperties !== 'catalog' && /*#__PURE__*/jsxs("div", {
+      className: selectionWrapper,
+      children: [/*#__PURE__*/jsx("div", {
+        className: selectionText,
+        children: 'select ' + currentProperties + ':'
+      }), currentProperties === 'article' && /*#__PURE__*/jsx(Select, {
+        styles: colourStyles,
+        className: selection,
+        value: currentArticleCodex ? {
+          label: currentArticleCodex
+        } : undefined,
+        options: allArticles.map(function (a) {
+          return {
+            label: a.articleCodex
+          };
+        }),
+        onChange: function onChange(v) {
+          return setCurrentArticleCodex(v.label);
+        }
+      }), currentProperties === 'option' && /*#__PURE__*/jsx(Select, {
+        styles: colourStyles,
+        className: selection,
+        value: currentOptionCodex ? {
+          label: currentOptionCodex
+        } : undefined,
+        options: allOptions === null || allOptions === void 0 ? void 0 : allOptions.map(function (a) {
+          return {
+            label: a.codex
+          };
+        }),
+        onChange: function onChange(v) {
+          return setCurrentOptionCodex(v.label);
+        }
+      }), currentProperties === 'optionvalue' && /*#__PURE__*/jsx(Select, {
+        styles: colourStyles,
+        className: selection,
+        value: currentOptionValueCodex ? {
+          label: currentOptionValueCodex
+        } : undefined,
+        options: allOptionsValues === null || allOptionsValues === void 0 ? void 0 : allOptionsValues.map(function (a) {
+          return {
+            label: a.codex
+          };
+        }),
+        onChange: function onChange(v) {
+          return setCurrentOptionValueCodex(v.label);
+        }
+      })]
+    }), /*#__PURE__*/jsx(Table, _objectSpread(_objectSpread({}, dataDictionary[currentProperties]), {}, {
+      id: currentProperties
+    }))]
+  }));
+};
+var PropertiesEditor$1 = observer(PropertiesEditor);
+var colourStyles = {
+  control: function control(styles) {
+    return _objectSpread(_objectSpread({}, styles), {}, {
+      backgroundColor: 'white'
+    });
+  },
+  option: function option(styles, _ref) {
+    var isDisabled = _ref.isDisabled,
+      isFocused = _ref.isFocused,
+      isSelected = _ref.isSelected;
+    return _objectSpread(_objectSpread({}, styles), {}, {
+      backgroundColor: isDisabled ? undefined : isFocused ? 'lightblue' : isSelected ? '#fff' : undefined,
+      cursor: isDisabled ? 'not-allowed' : 'default',
+      color: 'black',
+      ':active': _objectSpread({}, styles[':active'])
+    });
+  }
+};
+
+export { PropertiesEditor$1 as default };

package/build/esm/index-85d79537.js

@@ -0,0 +1,62 @@
+import { u as useViewHandler } from './index-e0c6b93d.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+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 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import '@crystaldesign/widget-contact-form';
+
+var PosNr = function PosNr(_ref) {
+  var rect = _ref.rect,
+    item = _ref.item,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps,
+    hasTrash = _ref.hasTrash;
+  var viewHandler = useViewHandler();
+  var top = item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px';
+  if (hasTrash && rect.top < 4) top = 'calc(' + top + ' + 35px + var(--globalSize) / 2)'; // 35px space for trash icon
+  else top = 'calc(' + top + ' + var(--globalSize) / 2)'; // correct for icon center
+  return /*#__PURE__*/jsxs("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    style: {
+      left: item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left,
+      top: top,
+      visibility: viewHandler.productState.isBoxPlanner ? 'hidden' : 'visible'
+    },
+    className: classnames(plannerUIProps.classes.buttonGeneral, plannerUIProps.classes.posNr.posNr, item.isDockedAccessoire ? plannerUIProps.classes.posNr.posNrAcc : undefined, item.elemState == 'selected' ? plannerUIProps.classes.posNr.posNrSelected : undefined, item.elemState == 'selectable' ? plannerUIProps.classes.posNr.posNrSelectable : undefined, item.elemState == 'unselectable' ? plannerUIProps.classes.posNr.posNrUnSelectable : undefined, item.onHover && item.elemState != 'unselectable' ? plannerUIProps.classes.posNr.posNrOnHover : undefined
+    //TODO ADD wcPlanner_PosNr_Selectable_Area logic!
+    ),
+    children: [item.posNr, /*#__PURE__*/jsx("div", {
+      onClick: function onClick() {
+        var _item$clickFunction;
+        (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId));
+      },
+      style: {
+        left: '0px',
+        top: '0px',
+        visibility: viewHandler.productState.isBoxPlanner ? 'hidden' : 'visible'
+      },
+      className: classnames(item.elemState == 'selectable' ? plannerUIProps.classes.posNr.posNrSelectableArea : undefined)
+    })]
+  });
+};
+var PosNr$1 = observer(PosNr);
+
+export { PosNr$1 as default };

package/build/esm/index-8725b14f.js

@@ -0,0 +1,164 @@
+import { s as styleInject } from './index-e0c6b93d.js';
+import 'react';
+import { w as wcBoxPlannerAddElement, a as wcBoxPlannerAddElementLeft, b as wcBoxPlannerAddElementTop, c as wcBoxPlannerAddElementRight, h as wc2DRotClock, i as wc2DRotCounterClock, d as wcPlanner3DRot, e as wcPlanner3DMove, f as wcPlannerDistanceToGround, g as wcPlannerArrowDistanceToGround } from './index.module-dff51b67.js';
+import { w as wcUi2DOutlineDraggable, a as wcUi2DOutlineDraggableActive, b as wcUi2DOutlineSelectable, c as wc3DOutlineSvg, d as wc3DOutlinePolygon, e as wc3DOutlinePolygonContours, f as wc3DOutlinePolygonContoursSel } from './index.module-e9a4adcf.js';
+import PlannerUI from './index-62d1664b.js';
+import { useDivaCore } from '@crystaldesign/diva-core';
+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 '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 '@crystaldesign/widget-contact-form';
+import './index-5a3c91c8.js';
+import './index-59430be8.js';
+import './index-d7be8339.js';
+import './index-bc7de908.js';
+import './index-ca6294fb.js';
+import './index-a027e4d6.js';
+import './index-497d438a.js';
+import './index-a29fe3cc.js';
+import './index-db251866.js';
+import './index-cada4fdd.js';
+import './index-85d79537.js';
+import './index-90ef53ba.js';
+import './index-ca126268.js';
+import 'react-draggable';
+import './index-49033906.js';
+import './index-4b6fb704.js';
+import './index-b400db02.js';
+
+var wcPlannerButton = "wcPlannerButton-hPp4U";
+var mobile = "mobile-ZE7fr";
+var css_248z$6 = ".wcPlannerButton-hPp4U {\n  position: absolute;\n  background-repeat: no-repeat;\n  transition: background-image 0.2s ease-in-out;\n  --globalSize: 40px;\n  --posNrSize: var(--globalSize);\n  --trashSize: var(--globalSize);\n  --rotSize: var(--globalSize);\n  --copySize: var(--globalSize);\n  --fontSize: 26px;\n  --copyArrowSize: var(--globalSize);\n}\n\n.mobile-ZE7fr {\n  --globalSize: 28px;\n  --fontSize: 17px;\n}\n";
+styleInject(css_248z$6);
+
+var wcUi2DDpAvl = "wcUI2D_DP_AVL-iHhPw";
+var wcUi2DDpAvlSel = "wcUI2D_DP_AVL_SEL-SFLkk";
+var css_248z$5 = "/*STANDARD*/\n\n.wcUI2D_DP_AVL-iHhPw {\n  height: 40px;\n  width: 40px;\n\n  margin-top: -20px;\n  margin-left: -20px;\n\n  border-radius: 50%;\n  background-color: rgba(0, 0, 0, 0);\n  background-position: center center;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle opacity%3D%220.5%22 cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 transform%3D%22rotate(-180 20 20)%22 fill%3D%22%23E5E5E5%22%2F%3E%3Cpath d%3D%22M7 20L20 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M13 14L7 20.0606L13 26%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%224%22 transform%3D%22rotate(-180 20 20)%22 fill%3D%22%234B4B4B%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  z-index: 263;\n}\n\n.wcUI2D_DP_AVL-iHhPw:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle opacity%3D%220.5%22 cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 transform%3D%22rotate(-180 20 20)%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M7 20L20 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M13 14L7 20.0606L13 26%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%224%22 transform%3D%22rotate(-180 20 20)%22 fill%3D%22%234B4B4B%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.wcUI2D_DP_AVL_SEL-SFLkk::after {\n  position: absolute;\n  width: 40px;\n  height: 40px;\n  content: '';\n  background-color: var(--primaryColor);\n  border-radius: var(--articlePosNrRadius);\n  opacity: 0.3;\n}\n";
+styleInject(css_248z$5);
+
+var wcUi2DDpAvr = "wcUI2D_DP_AVR-exJDT";
+var wcUi2DDpAvrSel = "wcUI2D_DP_AVR_SEL-RiZkU";
+var css_248z$4 = "/*STANDARD*/\n\n.wcUI2D_DP_AVR-exJDT {\n  height: 40px;\n  width: 40px;\n  border-radius: 50%;\n  background-color: rgba(0, 0, 0, 0);\n\n  margin-top: -20px;\n  margin-left: -20px;\n\n  background-position: center center;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle opacity%3D%220.5%22 cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23E5E5E5%22%2F%3E%3Cpath d%3D%22M33 20L20 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M27 26L33 19.9394L27 14%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%224%22 fill%3D%22%234B4B4B%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  z-index: 263;\n}\n\n.wcUI2D_DP_AVR-exJDT:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle opacity%3D%220.5%22 cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M33 20L20 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M27 26L33 19.9394L27 14%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%224%22 fill%3D%22%234B4B4B%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcUI2D_DP_AVR_SEL-RiZkU::after {\n  width: 40px;\n  height: 40px;\n  content: '';\n  background-color: var(--primaryColor);\n  border-radius: var(--articlePosNrRadius);\n  opacity: 0.3;\n}\n";
+styleInject(css_248z$4);
+
+var wcUi2DDpAvDocking = "wcUI2D_DP_AV_DOCKING-B4pye";
+var wcUi2DDpAvNotDocking = "wcUI2D_DP_AV_NOT_DOCKING-lVgqL";
+var wcUi2DDpAvNotDockingSel = "wcUI2D_DP_AV_NOT_DOCKING_SEL-IB1dU";
+var wcUi3DDpAvDocking = "wcUI3D_DP_AV_DOCKING-WVzbw";
+var wcUi3DDpAvNotDocking = "wcUI3D_DP_AV_NOT_DOCKING-knDpA";
+var wcUi3DDpAvNotDockingSel = "wcUI3D_DP_AV_NOT_DOCKING_SEL-gFJW1";
+var css_248z$3 = "/*STANDARD*/\n.wcUI2D_DP_AV_DOCKING-B4pye {\n  background-size: 100%;\n  background-position: center center;\n  border-radius: 50%;\n  background-color: #f2f2f2;\n  height: var(--globalSize);\n  width: var(--globalSize);\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  margin-top: calc(var(--globalSize) * -0.5);\n  margin-left: calc(var(--globalSize) * -0.5);\n  z-index: 263;\n}\n.wcUI2D_DP_AV_NOT_DOCKING-lVgqL {\n  background-size: 100%;\n  background-position: center center;\n  border-radius: 50%;\n  background-color: #f2f2f2;\n  height: var(--globalSize);\n  width: var(--globalSize);\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M20 27L20 13%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  margin-top: calc(var(--globalSize) * -0.5);\n  margin-left: calc(var(--globalSize) * -0.5);\n  z-index: 263;\n}\n.wcUI2D_DP_AV_NOT_DOCKING-lVgqL:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M20 27L20 13%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.wcUI2D_DP_AV_NOT_DOCKING_SEL-IB1dU::after {\n  position: absolute;\n  width: var(--globalSize);\n  height: var(--globalSize);\n  background-color: var(--primaryColor);\n  border-radius: var(--articlePosNrRadius);\n  opacity: 0.5;\n}\n\n.wcUI3D_DP_AV_DOCKING-WVzbw {\n  background-size: 100%;\n  background-position: center center;\n  border-radius: 50%;\n  background-color: #f2f2f2;\n  height: var(--globalSize);\n  width: var(--globalSize);\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  margin-top: calc(var(--globalSize) * -0.5);\n  margin-left: 0px;\n  z-index: 270;\n}\n\n.wcUI3D_DP_AV_DOCKING-WVzbw:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.wcUI3D_DP_AV_NOT_DOCKING-knDpA {\n  background-size: 100%;\n  background-position: center center;\n  border-radius: 50%;\n  background-color: #f2f2f2;\n  height: var(--globalSize);\n  width: var(--globalSize);\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M20 27L20 13%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n  margin-top: calc(var(--globalSize) * -0.5);\n  margin-left: 0px;\n  z-index: 270;\n}\n.wcUI3D_DP_AV_NOT_DOCKING-knDpA:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect width%3D%2240%22 height%3D%2240%22 rx%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M27 20L13 20%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M20 27L20 13%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.wcUI3D_DP_AV_NOT_DOCKING_SEL-gFJW1::after {\n  position: absolute;\n  width: var(--globalSize);\n  height: var(--globalSize);\n  content: '';\n  border-radius: var(--articlePosNrRadius);\n  opacity: 0.5;\n}\n";
+styleInject(css_248z$3);
+
+var wcUiCopy = "wcUI_Copy-zGN0x";
+var css_248z$2 = "/*STANDARD*/\n.wcUI_Copy-zGN0x {\n  width: var(--copySize);\n  height: var(--copySize);\n  border-radius: 50%;\n  background: #f5f5f5;\n  background-repeat: no-repeat;\n  text-align: center;\n  cursor: pointer;\n  background-size: 70%;\n  margin-top: calc(var(--copySize) / -2);\n  margin-left: calc(var(--copySize) / -2);\n  background-position: center center;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2226%22 height%3D%2226%22 viewBox%3D%220 0 26 26%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M20.6426 6.40527H8.20862V22.9839H20.6426V6.40527Z%22 stroke%3D%22%23555050%22 stroke-width%3D%221.5%22%2F%3E%3Cpath d%3D%22M4.75452 19.5298V2.95117H17.1885%22 stroke%3D%22%23555050%22 stroke-width%3D%221.5%22%2F%3E%3C%2Fsvg%3E\");\n  z-index: 262;\n}\n\n.wcUI_Copy-zGN0x:hover {\n  background-color: #c4c4c4;\n}\n";
+styleInject(css_248z$2);
+
+var wcUiDel = "wcUI_Del-S-iQr";
+var boxplanner = "boxplanner-8JTKR";
+var css_248z$1 = "/*STANDARD*/\n.wcUI_Del-S-iQr {\n  width: var(--trashSize);\n  height: var(--trashSize);\n  border-radius: 50%;\n  background: #f5f5f5;\n  text-align: center;\n  cursor: pointer;\n  margin-top: calc(var(--trashSize) / -2);\n  margin-left: calc(var(--trashSize) / -2);\n  background-position: center center;\n  background-size: 110%;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M11 13.7127L29 13.7124M14.2348 28.9391L13.2581 14.2008V13.9969L13.2987 13.7127H26.7004L26.7419 13.9969V14.1602L25.7644 28.9391C23.9718 29.0203 16.2719 29.0203 14.2348 28.9391ZM17.0933 13.712H22.9067V11H17.0933V13.712Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M21.8885 16.8988V25.8406M18.0547 16.8721V25.8139V16.8721Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  z-index: 262;\n}\n\n.wcUI_Del-S-iQr:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M11 13.7127L29 13.7124M14.2348 28.9391L13.2581 14.2008V13.9969L13.2987 13.7127H26.7004L26.7419 13.9969V14.1602L25.7644 28.9391C23.9718 29.0203 16.2719 29.0203 14.2348 28.9391ZM17.0933 13.712H22.9067V11H17.0933V13.712Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M21.8885 16.8988V25.8406M18.0547 16.8721V25.8139V16.8721Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n\n.boxplanner-8JTKR.wcUI_Del-S-iQr {\n  margin-left: calc(var(--trashSize) * -0.8);\n  margin-top: calc(var(--trashSize) * 0.3);\n}\n";
+styleInject(css_248z$1);
+
+var wcPlannerPosNr = "wcPlanner_PosNr-I5lrs";
+var wcPlannerPosNrSelectableArea = "wcPlanner_PosNr_Selectable_Area-mxnmd";
+var wcPlannerPosNrSelected = "wcPlanner_PosNr_Selected-VNG2p";
+var wcPlannerPosNrSelectable = "wcPlanner_PosNr_Selectable-XKr-h";
+var wcPlannerPosNrUnSelectable = "wcPlanner_PosNr_UnSelectable-Tm4HU";
+var wcPlannerPosNrOnHover = "wcPlanner_PosNr_OnHover-uUbHT";
+var css_248z = "/*Standard*/\n\n.wcPlanner_PosNr-I5lrs {\n  width: var(--posNrSize);\n  height: var(--posNrSize);\n  border-radius: 50%;\n  font-size: var(--fontSize);\n  line-height: var(--posNrSize);\n  text-align: center;\n  margin-top: calc(var(--posNrSize) / -2);\n  margin-left: calc(var(--posNrSize) / -2);\n  cursor: pointer;\n  z-index: 262;\n}\n\n.wcPlanner_PosNr-I5lrs:hover {\n  background: #c4c4c4;\n}\n\n.wcPlanner_PosNr_Selectable_Area-mxnmd {\n  width: var(--posNrSize);\n  height: var(--posNrSize);\n  position: absolute;\n  background-color: rgba(100, 100, 100, 0);\n  cursor: pointer;\n}\n.wcPlanner_PosNr_Selected-VNG2p {\n  background: var(--primaryColor);\n  color: #ffffff;\n}\n.wcPlanner_PosNr_Selectable-XKr-h {\n  background: #f5f5f5;\n  color: #4b4b4b;\n}\n\n.wcPlanner_PosNr_UnSelectable-Tm4HU {\n  background: #dfdfdf;\n  color: rgb(175, 172, 172);\n  cursor: inherit;\n}\n\n.wcPlanner_PosNr_UnSelectable-Tm4HU:hover {\n  background: #dfdfdf;\n}\n\n.wcPlanner_PosNr_OnHover-uUbHT {\n  background-color: #a3a3a3;\n  transition: background-color 0.15s ease;\n}\n";
+styleInject(css_248z);
+
+var StandardPlannerUI = function StandardPlannerUI() {
+  var _useDivaCore = useDivaCore(),
+    isMobile = _useDivaCore.state.dimensions.isMobile;
+  var plannerUIProps = {
+    classes: {
+      buttonGeneral: classnames(wcPlannerButton, isMobile ? mobile : undefined),
+      dockingPoint: {
+        AVL: {
+          avl: wcUi2DDpAvl,
+          avlSel: wcUi2DDpAvlSel
+        },
+        AVR: {
+          avr: wcUi2DDpAvr,
+          avrSel: wcUi2DDpAvrSel
+        },
+        DPACC: {
+          dp2DAccDocking: wcUi2DDpAvDocking,
+          dp2DAccNotDocking: wcUi2DDpAvNotDocking,
+          dp2DAccNotDockingSel: wcUi2DDpAvNotDockingSel,
+          dp3DAccDocking: wcUi3DDpAvDocking,
+          dp3DAccNotDocking: wcUi3DDpAvNotDocking,
+          dp3DAccNotDockingSel: wcUi3DDpAvNotDockingSel
+        }
+      },
+      copy: {
+        BoxPlannerCopy: {
+          copyGlobal: wcBoxPlannerAddElement,
+          copyLeft: wcBoxPlannerAddElementLeft,
+          copyTop: wcBoxPlannerAddElementTop,
+          copyRight: wcBoxPlannerAddElementRight
+        },
+        ElementCopy: wcUiCopy
+      },
+      outline: {
+        outline2D: {
+          draggable: wcUi2DOutlineDraggable,
+          draggableActive: wcUi2DOutlineDraggableActive,
+          selectable: wcUi2DOutlineSelectable
+        },
+        outline3D: {
+          outlineSVG: wc3DOutlineSvg,
+          outlinePolygon: wc3DOutlinePolygon,
+          outlinePolygonContours: wc3DOutlinePolygonContours,
+          outlinePolygonContoursSel: wc3DOutlinePolygonContoursSel
+        }
+      },
+      posNr: {
+        posNr: wcPlannerPosNr,
+        posNrAcc: '',
+        posNrSelectable: wcPlannerPosNrSelectable,
+        posNrSelectableArea: wcPlannerPosNrSelectableArea,
+        posNrSelected: wcPlannerPosNrSelected,
+        posNrUnSelectable: wcPlannerPosNrUnSelectable,
+        posNrOnHover: wcPlannerPosNrOnHover
+      },
+      rotation: {
+        rotClock: wc2DRotClock,
+        rotCounterClock: wc2DRotCounterClock,
+        rot3DGrid: wcPlanner3DRot
+      },
+      move3DGrid: {
+        move3DGrid: wcPlanner3DMove
+      },
+      trash: {
+        trashClass: wcUiDel,
+        boxplanner: boxplanner
+      },
+      dimension: {
+        distanceToGround: wcPlannerDistanceToGround,
+        distanceToGroundIcon: wcPlannerArrowDistanceToGround
+      }
+    }
+  };
+  return /*#__PURE__*/jsx(PlannerUI, {
+    plannerUIProps: plannerUIProps
+  });
+};
+
+export { StandardPlannerUI as default };