@crystaldesign/diva-web-planner-react 24.15.0-beta.9 → 24.16.0-beta.1

package/build/esm/index-2d979630.js

@@ -0,0 +1,91 @@
+import { s as styleInject, u as useViewHandler } from './index-034e1c95.js';
+import 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import ProductRoomList from './index-c12bccba.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 '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var wcNav3DToolbar = "wc_Nav3DToolbar-dFNdl";
+var wrapper = "wrapper-AVxdB";
+var wcZoomIn = "wcZoomIn-Zt83g";
+var wcZoomOut = "wcZoomOut-sVnrQ";
+var wcFullScreen = "wcFullScreen-YrF3k";
+var wcReset = "wcReset-b3nN-";
+var wc3DDimLine = "wc3DDimLine-qXO6b";
+var css_248z = ".wc_Nav3DToolbar-dFNdl {\n  display: flex;\n  flex-direction: row;\n  position: absolute;\n  z-index: 400;\n  margin: 0;\n  position: absolute;\n  top: 0;\n  right: 0;\n}\n.wrapper-AVxdB {\n  background: rgba(254, 254, 254, 0.9);\n  height: 20px;\n  margin-right: 5px;\n  display: flex;\n  flex-direction: row;\n  line-height: 24px;\n\n  padding: 0.6rem 0.5rem 0.9rem 0.5rem;\n}\n.wrapper-AVxdB:hover {\n  background: #fefefe;\n  color: var(--primaryColor);\n  cursor: pointer;\n  box-shadow: var(--boxShadowHover);\n}\n.wc_Nav3DToolbar-dFNdl .wrapper-AVxdB div {\n  width: 25.6px;\n  height: 25.6px;\n  display: block;\n  background-repeat: no-repeat;\n  background-position: center center;\n  transition: background-color 0.15s ease;\n}\n\n/*------------------------Nav Icons--------------------------------------*/\n\n/* pfister */\n.wcZoomIn-Zt83g {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2226%22 height%3D%2224%22 viewBox%3D%220 0 26 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9.13434 17.3731C13.8328 17.3731 17.6417 13.6079 17.6417 8.96328C17.6417 4.31867 13.8328 0.553467 9.13434 0.553467C4.43584 0.553467 0.626953 4.31867 0.626953 8.96328C0.626953 13.6079 4.43584 17.3731 9.13434 17.3731Z%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22%2F%3E%3Cpath d%3D%22M24.868 22.6179L15.6235 14.5441%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M4.56201 8.96326H13.7097%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M9.13379 4.44189V13.4847%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcZoomOut-sVnrQ {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2222%22 viewBox%3D%220 0 24 22%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.69615 16.6951C12.9919 16.6951 16.4743 13.2526 16.4743 9.00611C16.4743 4.75961 12.9919 1.31714 8.69615 1.31714C4.40038 1.31714 0.917969 4.75961 0.917969 9.00611C0.917969 13.2526 4.40038 16.6951 8.69615 16.6951Z%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22%2F%3E%3Cpath d%3D%22M23.0816 21.4903L14.6631 14.1379%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M4.51465 9.0061H12.8783%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcFullScreen-YrF3k {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2221%22 viewBox%3D%220 0 20 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg clip-path%3D%22url(%23clip0)%22%3E%3Cpath d%3D%22M19.5811 10.3625V16.9734C19.5811 18.5633 18.4933 19.9023 17.2381 19.9023H2.76106C1.42215 19.9023 0.417969 18.5633 0.417969 16.9734V3.75162C0.417969 2.16167 1.50583 0.822754 2.76106 0.822754H9.87404%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M19.5813 0.822754L10.46 9.94409%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M13.7236 0.822754H19.5814V6.59681%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath id%3D%22clip0%22%3E%3Crect width%3D%2220%22 height%3D%2220%22 fill%3D%22white%22 transform%3D%22translate(0 0.404297)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\");\n}\n\n.wcReset-b3nN- {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2225%22 height%3D%2221%22 viewBox%3D%220 0 25 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg clip-path%3D%22url(%23clip0)%22%3E%3Cpath d%3D%22M4.3782 14.1701C3.9275 13.2399 3.70215 12.0771 3.70215 10.9143C3.70215 5.68177 7.75849 1.49573 12.8289 1.49573C14.181 1.49573 15.5331 1.84456 16.6599 2.42596%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M20.7159 6.14685C21.5047 7.5422 21.9554 9.17011 21.9554 10.9143C21.9554 16.1469 17.899 20.3329 12.8286 20.3329C10.9131 20.3329 9.1103 19.7515 7.64551 18.5887%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M19.1387 9.05387L20.4908 5.44922L23.9837 6.84457%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M6.0681 11.2632L4.60331 14.8678L1.11035 13.2399%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath id%3D%22clip0%22%3E%3Crect width%3D%2224%22 height%3D%2220%22 fill%3D%22white%22 transform%3D%22translate(0.546875 0.914307)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\");\n}\n\n.wc3DDimLine-qXO6b {\n  width: 32px !important;\n  height: 30px !important;\n  margin-top: -3px !important;\n  margin-left: -5px !important;\n  margin-right: -5px !important;\n}\n\n.wc3DDimLine-qXO6b {\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3Csvg version%3D%221.1%22 id%3D%22Ebene_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 viewBox%3D%220 0 15 12%22 style%3D%22enable-background%3Anew 0 0 15 12%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3Anone%3B %7D%09.st1%7Bfill%3A%237E7E7E%3B%7D%3C%2Fstyle%3E%3Cpath class%3D%22st0%22 d%3D%22M14.8%2C1.3c0-0.6-0.5-1.2-1.2-1.2H1.4c-0.6%2C0-1.2%2C0.5-1.2%2C1.2v9.4c0%2C0.6%2C0.5%2C1.2%2C1.2%2C1.2h12.2%09c0.6%2C0%2C1.2-0.5%2C1.2-1.2C14.8%2C10.7%2C14.8%2C1.3%2C14.8%2C1.3z%22%2F%3E%3Cg%3E%09%3Cpath class%3D%22st1%22 d%3D%22M12.9%2C2.9c-0.1%2C0-0.2%2C0.1-0.2%2C0.2v5.8c0%2C0.1%2C0.1%2C0.2%2C0.2%2C0.2S13%2C9%2C13%2C8.9V3.1C13%2C3%2C12.9%2C2.9%2C12.9%2C2.9z%22%2F%3E%09%3Cpath class%3D%22st1%22 d%3D%22M2.1%2C2.9C2.1%2C2.9%2C2%2C3%2C2%2C3.1v5.8C2%2C9%2C2.1%2C9.1%2C2.1%2C9.1c0.1%2C0%2C0.2-0.1%2C0.2-0.2V3.1C2.3%2C3%2C2.2%2C2.9%2C2.1%2C2.9z%22%2F%3E%09%3Cpath class%3D%22st1%22 d%3D%22M10.3%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0C10.1%2C5%2C10%2C5%2C10%2C5.1v0.8H5V5.1C5%2C5%2C4.9%2C5%2C4.9%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0l-1.5%2C1%09%09c0%2C0-0.1%2C0.1-0.1%2C0.1c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1l1.5%2C1c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0C4.9%2C7.1%2C5%2C7.1%2C5%2C7V6.2H10V7c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1%09%09c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0l1.5-1c0%2C0%2C0.1-0.1%2C0.1-0.1c0-0.1%2C0-0.1-0.1-0.1L10.3%2C4.9z M4.6%2C6.7L3.6%2C6l1-0.6V6.7z M10.4%2C6.7%09%09V5.4l1%2C0.6L10.4%2C6.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n";
+styleInject(css_248z);
+
+var NavBar = function NavBar(props) {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classnames(wcNav3DToolbar),
+      children: [!viewHandler.productState.plannerRenderingIsStaticBG && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("div", {
+          className: wrapper,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DViews');
+          },
+          children: /*#__PURE__*/jsx("div", {
+            className: wcReset,
+            title: t('configurator.NAV3DVIEWS_TT')
+          })
+        }), /*#__PURE__*/jsx("div", {
+          className: wrapper,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DZoomIn');
+          },
+          children: /*#__PURE__*/jsx("div", {
+            className: wcZoomIn,
+            title: t('configurator.NAV3DZOOMIN_TT')
+          })
+        }), /*#__PURE__*/jsx("div", {
+          className: wrapper,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DZoomOut');
+          },
+          children: /*#__PURE__*/jsx("div", {
+            className: wcZoomOut,
+            title: t('configurator.NAV3DZOOMOUT_TT')
+          })
+        })]
+      }), /*#__PURE__*/jsx("div", {
+        className: wrapper,
+        onClick: function onClick() {
+          return viewHandler.productState.onNav3DMenuSelect('Nav3DDimLine');
+        },
+        children: /*#__PURE__*/jsx("div", {
+          className: wc3DDimLine,
+          title: t('configurator.NAV3DDIMLINE_TT')
+        })
+      }), /*#__PURE__*/jsx("div", {
+        className: wrapper,
+        onClick: function onClick() {
+          return viewHandler.productState.onNav3DMenuSelect('Nav3DFullScreen');
+        },
+        children: /*#__PURE__*/jsx("div", {
+          className: wcFullScreen,
+          title: t('configurator.NAV3DFULLSCREEN_TT')
+        })
+      })]
+    }), /*#__PURE__*/jsx(ProductRoomList, {})]
+  });
+};
+var index = observer(NavBar);
+
+export { index as default };

package/build/esm/index-303d62e4.js

@@ -0,0 +1,57 @@
+import { s as styleInject, u as useViewHandler } from './index-034e1c95.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useRef, useEffect } from 'react';
+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 wcTabGroupItem = "wcTabGroupItem-TP7vT";
+var portrait = "portrait-3cTAf";
+var landscape = "landscape-6Dea8";
+var wcActiveStep = "wcActiveStep-y3S9Y";
+var wcVisitedStep = "wcVisitedStep-yDCqq";
+var wcStepNum = "wcStepNum-6FgQh";
+var css_248z = ".wcTabGroupItem-TP7vT {\n  height: 100%;\n  width: -moz-fit-content;\n  width: fit-content;\n  float: left;\n  border: none;\n  transition: background-color 0.3s ease-out;\n  line-height: 56px;\n  padding: 0 13px;\n}\n.portrait-3cTAf.wcTabGroupItem-TP7vT,\n.landscape-6Dea8.wcTabGroupItem-TP7vT {\n  line-height: 38px;\n}\n\n.wcTabGroupItem-TP7vT.wcActiveStep-y3S9Y {\n  color: white;\n  background-color: var(--primaryColor);\n}\n\n.wcActiveStep-y3S9Y.wcTabGroupItem-TP7vT:hover {\n  background-color: var(--primaryColor);\n}\n\n.wcVisitedStep-yDCqq {\n  background-color: #b1b1b1;\n}\n\n.wcVisitedStep-yDCqq.wcTabGroupItem-TP7vT:hover {\n  background-color: #bbbbbb;\n}\n.wcTabGroupItem-TP7vT:hover {\n  background-color: #c8c8c8;\n}\n\n.wcStepNum-6FgQh {\n  display: inline-block;\n  height: 20px;\n  width: 20px;\n  margin-right: 10px;\n  margin-top: 10px;\n  border: 1px solid white;\n  background-color: white;\n  border-radius: 10px;\n  text-align: center;\n  line-height: 21px;\n  font-size: 14px;\n  color: #6f6f6f;\n}\n\n.wcActiveStep-y3S9Y .wcStepNum-6FgQh {\n  color: var(--primaryColor);\n  font-weight: 700;\n}\n.wcVisitedStep-yDCqq .wcStepNum-6FgQh {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2212%22 height%3D%229%22 viewBox%3D%220 0 12 9%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1.44531 3.49126L5.625 8.09375L10.75 0.953613%22 stroke%3D%22%236F6F6F%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  color: transparent;\n}\n.wcVisitedStep-yDCqq .wcStepNum-6FgQh:empty:before {\n  content: '\\200b';\n}\n";
+styleInject(css_248z);
+
+var TabGroupItemHorizontalGold = function TabGroupItemHorizontalGold(_ref) {
+  var tabGroup = _ref.tabGroup;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var tabGroupItemRef = useRef(null);
+  var curTabGroup = viewHandler.tabGroupState.curTabGroup;
+  useEffect(function () {
+    viewHandler.tabGroupState.setTabGroupItems(tabGroup.key, tabGroupItemRef.current);
+  }, [tabGroupItemRef]);
+  var onTabGroupClick = function onTabGroupClick(tabGroup) {
+    viewHandler.tabGroupState.navigateToTabgroupByPosNr(+tabGroup.posNr);
+  };
+  var isActive = tabGroup.posNr == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.posNr);
+  return /*#__PURE__*/jsxs("div", {
+    ref: tabGroupItemRef,
+    onClick: function onClick() {
+      return onTabGroupClick(tabGroup);
+    },
+    className: classnames(wcTabGroupItem, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, tabGroup.title == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.title) && isActive ? wcActiveStep : undefined, viewHandler.tabGroupAlreadyVisited(tabGroup) && !(tabGroup.title == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.title) && isActive) ? wcVisitedStep : undefined),
+    children: [/*#__PURE__*/jsx("span", {
+      className: classnames(wcStepNum),
+      children: tabGroup.posNr
+    }), t('configurator.' + tabGroup.title, tabGroup.title)]
+  });
+};
+var index = observer(TabGroupItemHorizontalGold);
+
+export { index as default };

package/build/esm/index-3308c1e8.js

@@ -0,0 +1,54 @@
+import { u as useViewHandler } from './index-034e1c95.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var PosNr = function PosNr(_ref) {
+  var rect = _ref.rect,
+    item = _ref.item,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  var viewHandler = useViewHandler();
+  return /*#__PURE__*/jsxs("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    style: {
+      left: item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px',
+      top: item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px',
+      visibility: viewHandler.productState.plannerMode == 'BoxPlanner' ? '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.plannerMode == 'BoxPlanner' ? '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-34938b4c.js

@@ -0,0 +1,32 @@
+import { s as styleInject } from './index-034e1c95.js';
+import 'react';
+import OrbitInteractionStandard from './index-21f05e2c.js';
+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';
+import 'mobx-react-lite';
+import 'react-3d-cube-interaction';
+import 'classnames';
+
+var orbitInteractionContainer = "orbit-interaction-container-jxGAx";
+var css_248z = ".orbit-interaction-container-jxGAx {\n  position: absolute;\n  bottom: 20px;\n  right: 70px;\n  z-index: 350;\n}\n";
+styleInject(css_248z);
+
+var OrbitInteractionFree = function OrbitInteractionFree(props) {
+  return /*#__PURE__*/jsx(OrbitInteractionStandard, {
+    orbitInteractionContainerClass: orbitInteractionContainer
+  });
+};
+
+export { OrbitInteractionFree as default };

package/build/esm/index-36248ec4.js

@@ -0,0 +1,78 @@
+import { s as styleInject } from './index-034e1c95.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useDivaCore, useTranslation, DivaUtils } from '@crystaldesign/diva-core';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var row = "row-aKbIG";
+var rowPaddingTop = "row-padding-top-SRH2s";
+var rowPaddingTopArticle = "row-padding-top-article-Iwelk";
+var columnLeft = "column-left-jSCha";
+var columnRight = "column-right-rkkBn";
+var columnRightRed = "column-right-red-Lmt65";
+var columnOption = "column-option-2v7Hm";
+var columnPartlist = "column-partlist-0LS9Z";
+var codexes = "codexes--r2fL";
+var tabGroup = "tab-group-an6TP";
+var css_248z = ".row-aKbIG {\n  height: -moz-fit-content;\n  height: fit-content;\n  position: relative;\n  font-weight: 300;\n  padding-right: 0.9375rem;\n  padding-left: 0.9375rem;\n  display: flow-root;\n  color: #404040;\n}\n.row-padding-top-SRH2s {\n  padding-top: 8px;\n}\n\n.row-padding-top-article-Iwelk {\n  padding-top: 1rem;\n}\n\n.column-left-jSCha {\n  float: left;\n}\n.column-left-jSCha a {\n  color: var(--primaryColor);\n}\n.column-right-rkkBn {\n  float: right;\n  text-align: right;\n}\n\n.column-right-red-Lmt65 {\n  color: var(--primaryColor);\n}\n.column-option-2v7Hm {\n  font-size: 0.8125rem;\n  font-weight: normal;\n  line-height: 1.1;\n}\n.column-partlist-0LS9Z {\n  max-width: 70%;\n}\n\n.codexes--r2fL {\n  font-style: italic;\n}\n\n.tab-group-an6TP {\n  border-bottom: 1px solid var(--primaryColor);\n  font-size: 1.125rem;\n  margin: 1.5rem 0 0 0;\n  color: var(--primaryColor);\n  padding: 0;\n  text-align: left;\n  text-transform: capitalize;\n  font-weight: 300;\n}\n";
+styleInject(css_248z);
+
+var OptiontreeSerious = function OptiontreeSerious(_ref) {
+  var itemP = _ref.item;
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var item = itemP;
+  if (item.isTabGroup) {
+    return /*#__PURE__*/jsx("div", {
+      className: tabGroup,
+      children: item.title
+    });
+  }
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [item.isPartlistArticle && /*#__PURE__*/jsxs("div", {
+      className: classnames(row, rowPaddingTopArticle),
+      children: [/*#__PURE__*/jsx("span", {
+        className: classnames(columnPartlist, columnLeft),
+        children: item.title
+      }), /*#__PURE__*/jsx("span", {
+        className: classnames(columnRight),
+        children: (item.quantity && item.quantity > 1 ? '(x' + item.quantity + ') ' : '') + (!hidePrices && item.price ? DivaUtils.formatPrice(item.price) : '')
+      })]
+    }), /*#__PURE__*/jsxs("div", {
+      className: classnames(row, item.isPartlistArticle ? rowPaddingTop : undefined),
+      children: [/*#__PURE__*/jsxs("span", {
+        className: classnames(columnOption, columnLeft),
+        children: [item.isPartlistArticle && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx("a", {
+            children: item.size && item.size !== '' ? t('configurator.size') : item.description
+          }), ": ", item.size]
+        }), !item.isPartlistArticle && /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx("a", {
+            children: item.title
+          }), item.description && ': ' + item.description]
+        })]
+      }), /*#__PURE__*/jsx("span", {
+        className: classnames(columnOption, columnRight, columnRightRed, codexes),
+        children: item.codex
+      })]
+    })]
+  });
+};
+var index = observer(OptiontreeSerious);
+
+export { index as default };

package/build/esm/index-3645f5e6.js

@@ -0,0 +1,179 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { u as useViewHandler } from './index-034e1c95.js';
+import 'react';
+import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
+import ShelfDeleteButton from './index-fe276f04.js';
+import { observer } from 'mobx-react-lite';
+import { jsx, Fragment, jsxs } 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';
+
+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 GridList = function GridList(_ref) {
+  var _item$shelfPlannerGri;
+  var item = _ref.item,
+    height = _ref.height;
+    _ref.width;
+    var direction = _ref.direction;
+  var grid = (_item$shelfPlannerGri = item.shelfPlannerGrids) === null || _item$shelfPlannerGri === void 0 ? void 0 : _item$shelfPlannerGri[0];
+  var viewHandler = useViewHandler();
+  if (!grid) return /*#__PURE__*/jsx(Fragment, {});
+  var itemHeight = height / grid.Cells.length;
+  var cells = [];
+  var lastInUse = -1;
+  var onBoardNameAdded = false;
+  for (var i = 0; i < grid.Cells.length; i++) {
+    var cell = grid.Cells[i];
+    if (cell.InUse == -1) {
+      cells.splice(0, 0, {
+        heightCount: 1,
+        inUse: cell.InUse,
+        index: cell.Index,
+        type: undefined,
+        isDisabled: cell.IsDisabled,
+        isRequired: cell.IsRequired,
+        onlyPlaceHolder: cell.OnlyPlaceHolder,
+        noMove: cell.NoMove,
+        noDelete: cell.NoDelete
+      });
+    } else if (lastInUse != cell.InUse && lastInUse != cell.OnBoard) {
+      var _cell$Article, _cell$Article2;
+      lastInUse = cell.InUse;
+      onBoardNameAdded = false;
+      cells.splice(0, 0, {
+        heightCount: 1,
+        inUse: cell.InUse,
+        index: cell.Index,
+        type: cell.Type,
+        isDisabled: cell.IsDisabled,
+        isRequired: cell.IsRequired,
+        articleText: (_cell$Article = cell.Article) === null || _cell$Article === void 0 ? void 0 : _cell$Article.name,
+        onlyPlaceHolder: cell.OnlyPlaceHolder,
+        noMove: cell.NoMove,
+        noDelete: cell.NoDelete,
+        basketId: (_cell$Article2 = cell.Article) === null || _cell$Article2 === void 0 ? void 0 : _cell$Article2.basketId
+      });
+    } else {
+      var foundCell = cells.find(function (cell) {
+        return cell.inUse == lastInUse;
+      });
+      if (foundCell) {
+        if (lastInUse === cell.OnBoard && !onBoardNameAdded) {
+          var _cell$Article3;
+          onBoardNameAdded = true;
+          foundCell.articleText = ((_cell$Article3 = cell.Article) === null || _cell$Article3 === void 0 ? void 0 : _cell$Article3.name) + '<br/>&<br/>' + foundCell.articleText;
+          foundCell.onBoard = true;
+        }
+        foundCell.heightCount++;
+      }
+    }
+  }
+  var onDragEnd = function onDragEnd(result) {
+    if (!result.destination) return;
+    var sourceIndex = cells[result.source.index].index;
+    var destinationIndex = cells[result.destination.index].index;
+    if (sourceIndex != destinationIndex) viewHandler.paletteViewHandler.shelfItemMoved(grid, sourceIndex, destinationIndex);
+  };
+  var getItemStyle = function getItemStyle(isDragging, draggableStyle, item, showNumber) {
+    if (direction == 'horizontal') {
+      return getItemStyleHorizontal(isDragging, draggableStyle, item, showNumber);
+    } else {
+      return getItemStyleVertical(isDragging, draggableStyle, item);
+    }
+  };
+  var getItemStyleVertical = function getItemStyleVertical(isDragging, draggableStyle, item) {
+    return _objectSpread({
+      userSelect: 'none',
+      width: 'calc(' + 100 * (item.heightCount / grid.Cells.length) + '% - 1px)',
+      wordBreak: 'break-word',
+      height: '100%',
+      marginRight: '1px',
+      background: item.isRequired ? '#FFEBEB' : item.inUse == -1 ? 'none' : isDragging ? 'grey' : 'lightgrey',
+      backgroundImage: item.isDisabled && 'linear-gradient(45deg, #ffffff  25%, #c7c7c7 25%, #c7c7c7 50%, #ffffff  50%, #ffffff  75%, #c7c7c7 75%, #c7c7c7 100%)',
+      backgroundSize: item.isDisabled && '28.28px 28.28px',
+      "float": 'left',
+      borderRight: item.inUse == -1 ? '1px solid lightgrey' : 'none',
+      boxSizing: 'border-box'
+    }, draggableStyle);
+  };
+  var getItemStyleHorizontal = function getItemStyleHorizontal(isDragging, draggableStyle, item, showNumber) {
+    return _objectSpread({
+      userSelect: 'none',
+      height: itemHeight * item.heightCount - 1,
+      marginBottom: '1px',
+      fontSize: item.inUse === -1 ? '12px' : undefined,
+      lineHeight: item.inUse === -1 ? '2px' : undefined,
+      background: item.isRequired ? '#FFEBEB' : item.inUse === -1 ? 'none' : isDragging ? 'grey' : 'lightgrey',
+      backgroundImage: item.isDisabled && 'linear-gradient(45deg, #ffffff  25%, #c7c7c7 25%, #c7c7c7 50%, #ffffff  50%, #ffffff  75%, #c7c7c7 75%, #c7c7c7 100%)',
+      backgroundSize: item.isDisabled && '28.28px 28.28px',
+      borderBottom: item.inUse == -1 ? showNumber ? '1px solid #B5B5B5' : '1px solid lightgrey' : 'none',
+      boxSizing: 'border-box'
+    }, draggableStyle);
+  };
+  var getTextStyle = function getTextStyle() {
+    if (direction == 'vertikal') {
+      return {
+        maxHeight: 'calc(100% - 22px)',
+        overflow: 'auto'
+      };
+    }
+    return {};
+  };
+  return /*#__PURE__*/jsx(DragDropContext, {
+    onDragEnd: onDragEnd,
+    children: /*#__PURE__*/jsx(Droppable, {
+      droppableId: "droppable",
+      direction: direction == 'vertikal' ? 'horizontal' : 'vertical',
+      children: function children(provided, snapshot) {
+        return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, provided.droppableProps), {}, {
+          ref: provided.innerRef,
+          style: {
+            width: '100%',
+            height: '100%'
+          },
+          children: [cells.map(function (item, index) {
+            return /*#__PURE__*/jsx(Draggable, {
+              index: index,
+              isDragDisabled: item.inUse == -1 || item.isDisabled || item.noMove,
+              draggableId: index.toString(),
+              children: function children(provided, snapshot) {
+                return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread(_objectSpread({
+                  onClick: function onClick() {
+                    viewHandler.settingsState.setSelectedShelfAccessoire(item.basketId);
+                    viewHandler.paletteViewHandler.clickAddAccessorieOnShelfPlanner(grid, item.index);
+                  },
+                  ref: provided.innerRef
+                }, provided.draggableProps), provided.dragHandleProps), {}, {
+                  style: getItemStyle(snapshot.isDragging, provided.draggableProps.style, item, item.index % 5 === 0 && !!index),
+                  children: [!!item.articleText && /*#__PURE__*/jsx("div", {
+                    style: getTextStyle(),
+                    dangerouslySetInnerHTML: {
+                      __html: item.articleText
+                    }
+                  }), item.inUse == -1 && item.index % 5 === 0 && !!index && direction == 'horizontal' && item.index, (item.inUse > -1 && !item.noDelete && !item.isDisabled || item.onBoard) && /*#__PURE__*/jsx(ShelfDeleteButton, {
+                    grid: grid,
+                    index: item.inUse
+                  })]
+                }));
+              }
+            }, index);
+          }), provided.placeholder]
+        }));
+      }
+    })
+  });
+};
+var GridList$1 = observer(GridList);
+
+export { GridList$1 as default };