@crystaldesign/diva-web-planner-react 25.8.0-beta.9 → 25.8.0-rc.0

package/build/esm/index-75dcac22.js

@@ -0,0 +1,204 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { u as useViewHandler } from './index-5b30dfe3.js';
+import { useState, useEffect, Suspense } from 'react';
+import { n as notExpanded } from './index.module-16088c5d.js';
+import { s as scrollable, h as header, t as toggleWrapper, o as optionWrapper } from './index.module-7c91dec8.js';
+import { d as decision, D as DecisionVisualization } from './DecisionVizualizer-9b1c2db9.js';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import Toggle from './index-7beb5814.js';
+import AsyncRender from './index-bcbc2e9d.js';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+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 'react-json-view-lite';
+import 'react-draggable';
+import 'react-switch';
+import './index-8333eeb7.js';
+import 'react-collapsible';
+
+var _excluded = ["onMouseDown"];
+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 PartList = function PartList(_ref) {
+  var onMouseDown = _ref.onMouseDown,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var viewHandler = useViewHandler();
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedDecision = _useState2[0],
+    setSelectedDecision = _useState2[1];
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    articlesList = _useState4[0],
+    setArticlesList = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    showVariantsOverview = _useState6[0],
+    setShowVariantsOverview = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    allTablesOpen = _useState8[0],
+    setAllTablesOpen = _useState8[1];
+  var _useState9 = useState(true),
+    _useState10 = _slicedToArray(_useState9, 2),
+    showDiffOnly = _useState10[0],
+    setShowDiffOnly = _useState10[1];
+  var onClick = function onClick(obj) {
+    var _selectedDecision$dec, _selectedDecision$dec2;
+    var d = obj.decision;
+    var nr = d.decisionNo || d.Number;
+    if (nr == ((selectedDecision === null || selectedDecision === void 0 || (_selectedDecision$dec = selectedDecision.decision) === null || _selectedDecision$dec === void 0 ? void 0 : _selectedDecision$dec.Number) || (selectedDecision === null || selectedDecision === void 0 || (_selectedDecision$dec2 = selectedDecision.decision) === null || _selectedDecision$dec2 === void 0 ? void 0 : _selectedDecision$dec2.decisionNo))) {
+      setSelectedDecision(undefined);
+    } else setSelectedDecision(obj);
+  };
+  useEffect(function () {
+    if (showVariantsOverview) {
+      setTimeout(function () {
+        return updateVariants();
+      }, 400);
+    } else {
+      setArticlesList([{
+        snapshots: [{
+          promise: new Promise(function (r) {
+            var _viewHandler$divaWebP, _viewHandler$divaWebP2, _viewHandler$divaWebP3;
+            r({
+              articleSnapshot: (_viewHandler$divaWebP = viewHandler.divaWebPlanner.getDivaArticles()) !== null && _viewHandler$divaWebP !== void 0 ? _viewHandler$divaWebP : {},
+              price: (_viewHandler$divaWebP2 = (_viewHandler$divaWebP3 = viewHandler.divaWebPlanner.actSet()) === null || _viewHandler$divaWebP3 === void 0 ? void 0 : _viewHandler$divaWebP3.getSetPrice()) !== null && _viewHandler$divaWebP2 !== void 0 ? _viewHandler$divaWebP2 : 0
+            });
+          }),
+          title: '',
+          key: viewHandler.settingsState.configChanged.toString()
+        }]
+      }]);
+    }
+  }, [viewHandler.settingsState.configChanged, viewHandler.tabGroupState.curConfigStep]);
+  var updateVariants = function updateVariants() {
+    var snapshots = [];
+    var partlistArticlesInOverview = {};
+    var allItems = viewHandler.settingsState.itemPaletteArr.filter(function (i) {
+      return i[1].visible;
+    }).map(function (i) {
+      return {
+        items: i[1].groups.flatMap(function (g) {
+          return g.items.flatMap(function (c) {
+            return c;
+          });
+        }),
+        palette: i[1]
+      };
+    });
+    for (var i = 0; i < allItems.length; i++) {
+      var items = allItems[i].items;
+      var palette = allItems[i].palette;
+      var preparedItems = [];
+      for (var j = 0; j < items.length; j++) {
+        var item = items[j];
+        if (item.pricePreviewPromise && (item.text || item.name)) {
+          preparedItems.push({
+            promise: item.pricePreviewPromise.promise,
+            title: item.text || item.name,
+            key: palette.configStepKey
+          });
+        }
+      }
+      partlistArticlesInOverview[palette.configStepKey] = {
+        items: [],
+        totalCount: items.length
+      };
+      snapshots.push({
+        snapshots: preparedItems,
+        palette: palette
+      });
+    }
+    viewHandler.settingsState.setPartlistArticlesInOverview(partlistArticlesInOverview);
+    setArticlesList(snapshots);
+  };
+  useEffect(function () {
+    var set = viewHandler.divaWebPlanner.actSet();
+    if (set) set.logTotalStateForVariants = showVariantsOverview;
+  }, [showVariantsOverview]);
+  if (!(articlesList !== null && articlesList !== void 0 && articlesList.length)) return /*#__PURE__*/jsx(Fragment, {});
+  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(props.className, scrollable, viewHandler.uiState.configSettingsIsExpanded ? notExpanded : undefined),
+    style: {
+      zIndex: 800
+    },
+    children: [/*#__PURE__*/jsxs("a", {
+      className: header,
+      onMouseDown: onMouseDown,
+      children: ['Stücklisten Übersicht', /*#__PURE__*/jsxs("div", {
+        className: toggleWrapper,
+        children: [/*#__PURE__*/jsx(Toggle, {
+          state: showVariantsOverview,
+          onChange: function onChange(val) {
+            return setShowVariantsOverview(val);
+          },
+          on: "alle",
+          off: "einzeln",
+          width: 100
+        }), showVariantsOverview && /*#__PURE__*/jsx(Toggle, {
+          state: allTablesOpen,
+          onChange: function onChange(val) {
+            return setAllTablesOpen(val);
+          },
+          on: "offen",
+          off: "zu",
+          width: 100
+        }), showVariantsOverview && /*#__PURE__*/jsx(Toggle, {
+          state: showDiffOnly,
+          onChange: function onChange(val) {
+            return setShowDiffOnly(val);
+          },
+          on: "schnittm.",
+          off: "alle",
+          width: 100
+        })]
+      })]
+    }), articlesList.map(function (a, index) {
+      var _a$palette;
+      return /*#__PURE__*/jsxs("div", {
+        className: optionWrapper,
+        children: [!!((_a$palette = a.palette) !== null && _a$palette !== void 0 && _a$palette.name) && /*#__PURE__*/jsx("div", {
+          children: a.palette.name
+        }), a.snapshots.map(function (v) {
+          return /*#__PURE__*/jsx(Suspense, {
+            children: /*#__PURE__*/jsx(AsyncRender, {
+              onClick: onClick,
+              optionSnapshot: v,
+              allOpen: allTablesOpen,
+              showDiffOnly: showDiffOnly
+            }, v.key)
+          });
+        })]
+      }, index);
+    }), selectedDecision && /*#__PURE__*/jsx("div", {
+      className: decision,
+      style: {
+        right: 0,
+        zIndex: 100
+      },
+      children: /*#__PURE__*/jsx(DecisionVisualization, {
+        decision: selectedDecision.decision,
+        matchingOptions: selectedDecision.rule
+      })
+    })]
+  }));
+};
+var PartListTable = observer(PartList);
+
+export { PartListTable as default };

package/build/esm/index-76b56e44.js

@@ -0,0 +1,66 @@
+import { s as styleInject, u as useViewHandler } from './index-5b30dfe3.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import SettingsHeader from './index-29ef81bf.js';
+import SettingsConfigSingle from './index-8cf9ed17.js';
+import SettingsPosNr from './index-b2a97433.js';
+import classnames from 'classnames';
+import { jsx, Fragment, jsxs } 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 '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-2bba40cc.js';
+import 'react-laag';
+import './index-2085e273.js';
+
+var wcConfiguratorSettingsFoldConfSettings = "wcConfigurator-settings-FoldConfSettings-hZych";
+var landscape = "landscape-LFbXM";
+var css_248z = ".wcConfigurator-settings-header-9tt3R .wcConfigurator-settings-header-act-elements-38jiy {\n  max-width: 80%;\n  margin-left: 16px;\n  margin-right: 0px;\n  -webkit-line-clamp: 1;\n  display: -webkit-inline-box;\n  float: left;\n}\n\n.wcConfigurator-settings-FoldConfSettings-hZych {\n  display: block;\n  position: absolute;\n  right: 0px;\n  z-index: 700;\n  width: 16px;\n  height: 32px;\n  padding-top: 9.6px;\n  margin-right: var(--foldArrowMarginRight);\n\n  transition: all 0.35s ease;\n  background-repeat: no-repeat;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2210%22 viewBox%3D%220 0 16 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M14.729 1.25L8.30043 9.25L1.229 1.25%22 stroke%3D%22%236F6F6F%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-position: center center;\n  background-size: contain;\n}\n\n.wcConfigurator-settings-header-9tt3R .wcConfigurator-settings-header-act-elements-38jiy {\n  max-width: 83%;\n  margin-right: 24px;\n  margin-left: 0px;\n  margin-top: 14.4px;\n  -webkit-line-clamp: 1;\n  display: -webkit-inline-box;\n  float: right;\n}\n\n.landscape-LFbXM .wcConfigurator-settings-FoldConfSettings-hZych {\n  display: block;\n  position: absolute;\n  width: 16px;\n  right: 0px;\n  height: 32px;\n  padding-top: 9.6px;\n  margin-right: 16px;\n  transition: all 0.35s ease;\n  background-repeat: no-repeat;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2210%22 viewBox%3D%220 0 16 10%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M14.729 1.25L8.30043 9.25L1.229 1.25%22 stroke%3D%22%236F6F6F%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-position: center center;\n  background-size: contain;\n  cursor: pointer;\n  z-index: 700;\n}\n";
+styleInject(css_248z);
+
+var SettingsHeaderContainer = function SettingsHeaderContainer(_ref) {
+  var _headerPalette$type, _headerPalette$type2;
+  var _ref$isScroller = _ref.isScroller,
+    isScroller = _ref$isScroller === void 0 ? false : _ref$isScroller;
+  var viewHandler = useViewHandler();
+  var headerPalette = viewHandler.settingsState.itemPalettes.get(1);
+  if (!headerPalette) return /*#__PURE__*/jsx(Fragment, {});
+  var showHeader = viewHandler.uiState.ViewConfig.headerInConfigPalette !== 'Hidden' && !((_headerPalette$type = headerPalette.type) !== null && _headerPalette$type !== void 0 && _headerPalette$type.startsWith('PRODUCTS')) && !((_headerPalette$type2 = headerPalette.type) !== null && _headerPalette$type2 !== void 0 && _headerPalette$type2.startsWith('PROMOTED')) && (!viewHandler.getIsInMobileView() || !viewHandler.uiState.ViewConfig.hideTopHeaderInMobile);
+  return /*#__PURE__*/jsxs("header", {
+    ref: function ref(_ref2) {
+      return viewHandler.settingsState.setHeaderElement(_ref2);
+    },
+    className: classnames(viewHandler.uiState.isMobileLandscape ? landscape : undefined),
+    children: [!viewHandler.uiState.ViewConfig.hideMobileFolder && !viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isInMobileView && /*#__PURE__*/jsx("div", {
+      className: wcConfiguratorSettingsFoldConfSettings,
+      id: "btnFoldDown",
+      onClick: function onClick() {
+        return viewHandler.uiState.onClickHideConfigSettings();
+      }
+    }), showHeader && /*#__PURE__*/jsx(SettingsHeader, {
+      isInScroller: isScroller,
+      isSettingsHeader: !headerPalette.isHeader,
+      item: headerPalette,
+      specialElement1: viewHandler.settingsState.doShowActElementInfo && !viewHandler.uiState.ViewConfig.hideElementInfo ? /*#__PURE__*/jsx(SettingsPosNr, {}) : undefined,
+      specialElement2: viewHandler.settingsState.doShowConfigSingle ? /*#__PURE__*/jsx(SettingsConfigSingle, {}) : undefined
+    })]
+  });
+};
+var SettingsHeaderContainer$1 = observer(SettingsHeaderContainer);
+
+export { SettingsHeaderContainer$1 as default };

package/build/esm/index-76c59513.js

@@ -0,0 +1,50 @@
+import './index-5b30dfe3.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@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 Trash = function Trash(_ref) {
+  var item = _ref.item,
+    rect = _ref.rect,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  var left = rect.doUseCalc ? rect.leftCalc : item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px';
+  var top = rect.doUseCalc ? rect.topCalc : item.position.interpretation == 'percentage' ? 'calc(' + rect.top + '% )' : rect.top + 'px';
+  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: left,
+      top: top
+    },
+    className: classnames(plannerUIProps.classes.trash.trashClass, plannerUIProps.classes.buttonGeneral, item.plannerMode == 'BOX' ? plannerUIProps.classes.trash.boxplanner : undefined),
+    id: "testDel",
+    children: item.posNr
+  });
+};
+var Trash$1 = observer(Trash);
+
+export { Trash$1 as default };

package/build/esm/index-789e4071.js

@@ -0,0 +1,95 @@
+import { u as useViewHandler } from './index-5b30dfe3.js';
+import 'react';
+import DivaUtils from '@crystaldesign/diva-utils';
+import Toggle from './index-7beb5814.js';
+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 '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 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import '@crystaldesign/widget-contact-form';
+import 'react-switch';
+
+var Varaint = function Varaint(_ref) {
+  var _item$variantValues;
+  var itemP = _ref.item;
+  var item = itemP;
+  var viewHandler = useViewHandler();
+  return /*#__PURE__*/jsxs("div", {
+    style: {
+      userSelect: 'unset',
+      display: 'flex',
+      flexDirection: 'row',
+      gap: 20,
+      alignItems: 'center',
+      borderBottom: '1px solid grey',
+      justifyContent: 'space-between',
+      padding: 10
+    },
+    children: [/*#__PURE__*/jsx("button", {
+      onClick: item.onClick,
+      children: "konfigurieren"
+    }), /*#__PURE__*/jsx("div", {
+      children: item.index
+    }), (_item$variantValues = item.variantValues) === null || _item$variantValues === void 0 ? void 0 : _item$variantValues.map(function (item) {
+      return /*#__PURE__*/jsxs("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center',
+          gap: 10
+        },
+        children: [item.optionValueImage && /*#__PURE__*/jsx("img", {
+          src: item.optionValueImage,
+          style: {
+            height: 40
+          }
+        }), /*#__PURE__*/jsxs("div", {
+          style: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: 5,
+            width: '150px'
+          },
+          children: [/*#__PURE__*/jsx("div", {
+            children: item.optionName
+          }), /*#__PURE__*/jsx("div", {
+            children: item.optionValueName
+          })]
+        })]
+      }, item.opt);
+    }), /*#__PURE__*/jsx("div", {
+      children: item.title
+    }), /*#__PURE__*/jsx("div", {
+      children: DivaUtils.formatPrice(item.price)
+    }), /*#__PURE__*/jsx("div", {
+      style: {
+        alignSelf: 'flex-end'
+      },
+      children: /*#__PURE__*/jsx(Toggle, {
+        height: 32,
+        handleDiameter: 22,
+        width: 60,
+        onChange: function onChange() {
+          item.onToggle();
+          viewHandler.paletteViewHandler.updateCurPaletteData(true);
+        },
+        state: !item.disabled
+      })
+    })]
+  }, item.hash);
+};
+
+export { Varaint as default };

package/build/esm/index-79228b99.js

@@ -0,0 +1,81 @@
+import { s as styleInject, u as useViewHandler, a as usePlannerUIHandler } from './index-5b30dfe3.js';
+import { observer } from 'mobx-react-lite';
+import { useRef, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import '@crystaldesign/widget-contact-form';
+
+var wcConfiguratorGrid = "wcConfigurator-grid-DANlC";
+var wcConfiguratorGrid2DCanvas = "wcConfigurator-grid-2D-canvas-kC0d5";
+var grid2DBg = "Grid2D_BG-qKtq3";
+var css_248z = ".wcConfigurator-grid-DANlC {\n  width: 100%;\n  height: 100%;\n  position: absolute;\n}\n\n.wcConfigurator-grid-2D-canvas-kC0d5 {\n  width: 100% !important;\n  height: 100% !important;\n  position: absolute !important;\n}\n\n.wcConfigurator-grid-2D-canvas-kC0d5 {\n  z-index: 5;\n}\n\n.Grid2D_BG-qKtq3 {\n  background-repeat: repeat;\n  width: 100%;\n  height: 100%;\n  left: 0px;\n  top: 0px;\n  position: absolute;\n  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAHdElNRQfdDAUQEiovM6IXAAAAGnRFWHRTb2Z0d2FyZQBQYWludC5ORVQgdjMuNS4xMUfzQjcAAAP7SURBVHhe7ZzZbtsKEEP7/38Yf0JWZEGWJxc0MMVAGFMUwN6rynw4DeA5kSkRUTBO7V8/Pz/nNZ6ensbHlzi97+9vyfv6+rp4W9xp1nF65eB8pnnndDqdU8hAChlIIQQlHHB6KYSghANOL4UQlHDA6aUQghIOOL0UQlDCAaeXQq5QFwZf11BOwu19fn5evC3uNOs4vXJwPtO8cykE8hG4v78fH98Lr6+vq9zd3eWWNbHrWxZQwgGnl0IISjjg9FIIQQkHnF4KISjhgNNLIQQlHHB6KYSghANOL4UQlHDA6d1sIRDXwAFxYIa63dbxpllH9ep5t7jTrOP0ysH5TPPOpRDIR2Dvm/rb29u4nXeyqV/B6ZUj/4RMgyVKOOD0UghBCQecXgohKOGA00shBCUccHophKCEA04vhRCUcMDppRCCEg44vZstBN/AqE1zmnXU7Va90KpXz/v4+DjOO2pGp1eOXAjkI/Dw8DA+vhewqa+RTf0KTq8c+SdkGixRwgGnl0IISjjg9FIIQQkHnF4KISjhgNNLIQQlHHB6KYSghANOL4UQlHDA6d1sIRDXqAOuoZyE26tNGIvhNO9kU/8P2fum/v7+fv74+KDklnWF//WWNQ2WKOGA00shBCUccHophKCEA04vhRCUcMDppRCCEg44vRRCUMIBp5dCCEo44PRuthB8A6M2zWnWUbdb9UKrXj3vFneadZxeOXIhkMPf5+XlZZVLIdOg8/z8fHlZYpp1VA/hVA//k2SagT5XTxq+4tXLMNOss8XD9ZlmnUP9DsH7Q6Z5p9xp1nF65ci3rGmwRAkHnN7WQra406yTQgZSCEEJB5xeCiEo4YDTSyEEJRxweimEoIQDTi+FEJRwwOmlkCvUhcHXNZSTcHt56WSn1Ba+V6YPClhyqFsWXp6Y5p1D3LKAEg44va2FbHGnWSeFDKQQghIOOL0UQlDCAaeXQghKOOD0UghBCQecXgohKOGA07vZQiCugQPiwAx1u63jTbOO6tXzbnGnWcfplYPzmeady/vUIR+B+vv2XsEHA0zbeedQt6xs6gNOb2shW9xp1kkhAymEoIQDTi+FEJRwwOmlEIISDji9FEJQwgGnl0IISjjg9G62EHwDozbNadZRt1v1QqtePa+yh6gZnV45SiGH2tT3/jf15cf5TeSWdQWnV458y5oGS5RwwOmlEIISDji9FEJQwgGnl0IISjjg9FIIQQkHnF4KISjhgNNLIQQlHHB6N1sIxDXqgGsoJ+H2ahNW3oWbTT38IR/xN/BP3LKmwRIlHHB6KYSghANOL4UQlHDA6aUQghIOOL0UQlDCAaeXQghKOOD0UghBCQec3s0Wgn/CXjidfwOJNZK+WhRfKgAAAABJRU5ErkJggg==');\n  /*background-image: url(\"images/Standard/grid_standard.png\");*/\n  background-size: 100px 100px;\n  z-index: 0;\n  /* zoom: 200%;*/\n}\n";
+styleInject(css_248z);
+
+var touchMoveDetected = false;
+var Planner2DGrid = function Planner2DGrid(props) {
+  var viewHandler = useViewHandler();
+  var uiHandler = usePlannerUIHandler();
+  var gridRef = useRef(null);
+  useEffect(function () {
+    if (!gridRef) return;
+    viewHandler.productState.setPlanner2DGridElement(gridRef.current);
+    if (gridRef.current) uiHandler.setGrid2DUIElement(gridRef.current);
+  }, [gridRef]);
+  var on2DPlannerBGClick = function on2DPlannerBGClick(e) {
+    viewHandler.viewPlannerHandler.onClearElementSelection();
+    e.stopPropagation();
+  };
+  return /*#__PURE__*/jsxs("div", {
+    ref: gridRef,
+    className: wcConfiguratorGrid,
+    id: "wcConfigurator-grid-container",
+    style: {
+      width: '100%',
+      height: '100%',
+      zIndex: 2,
+      visibility: viewHandler.productState.doShowGrid ? 'visible' : 'hidden'
+    },
+    onClick: on2DPlannerBGClick,
+    onTouchStart: function onTouchStart() {
+      touchMoveDetected = false;
+    },
+    onTouchMove: function onTouchMove() {
+      touchMoveDetected = true;
+    },
+    onTouchEnd: function onTouchEnd(e) {
+      if (!touchMoveDetected) {
+        on2DPlannerBGClick(e);
+      }
+      touchMoveDetected = false;
+    },
+    children: [/*#__PURE__*/jsx("canvas", {
+      className: wcConfiguratorGrid2DCanvas,
+      id: "wcConfigurator-grid-2D-canvas"
+    }), /*#__PURE__*/jsx("div", {
+      className: grid2DBg,
+      style: {
+        zoom: uiHandler.get2DGridBackgroundState().zoom,
+        backgroundPosition: uiHandler.get2DGridBackgroundState().position.x + 'px ' + uiHandler.get2DGridBackgroundState().position.y + 'px'
+      }
+    })]
+  });
+};
+var Planner2DGrid$1 = observer(Planner2DGrid);
+
+export { Planner2DGrid$1 as default };

package/build/esm/index-7b4deacf.js

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

package/build/esm/index-7beb5814.js

@@ -0,0 +1,68 @@
+import { s as styleInject } from './index-5b30dfe3.js';
+import classnames from 'classnames';
+import 'react';
+import Switch from 'react-switch';
+import { 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 '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';
+
+var toggleText = "toggle-text-xzNMI";
+var yes = "yes-Rq8uh";
+var no = "no-ySZRX";
+var css_248z = ".switch-wrapper-YZN6e {\n  display: flex;\n  font-weight: 300;\n  line-height: 40px;\n  gap: 24px;\n}\n\n.toggle-text-xzNMI {\n  padding-left: 16px;\n  color: white;\n  line-height: 40px;\n  font-weight: 300;\n}\n\n.yes-Rq8uh {\n  padding-left: 16px;\n}\n\n.no-ySZRX {\n  padding-left: 4px;\n}\n";
+styleInject(css_248z);
+
+var Toggle = function Toggle(_ref) {
+  var _docStyle$getProperty;
+  var _onChange = _ref.onChange,
+    val = _ref.val,
+    state = _ref.state,
+    on = _ref.on,
+    off = _ref.off,
+    alwaysActiveColor = _ref.alwaysActiveColor,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? 40 : _ref$height,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 80 : _ref$width,
+    _ref$handleDiameter = _ref.handleDiameter,
+    handleDiameter = _ref$handleDiameter === void 0 ? 32 : _ref$handleDiameter;
+  var docStyle = getComputedStyle(document.documentElement);
+  var myVarVal = (_docStyle$getProperty = docStyle.getPropertyValue('--primaryColor')) === null || _docStyle$getProperty === void 0 ? void 0 : _docStyle$getProperty.replace(/ /g, '');
+  return /*#__PURE__*/jsx(Switch, {
+    checkedIcon: on ? /*#__PURE__*/jsx("div", {
+      className: classnames(toggleText, yes),
+      children: on
+    }) : /*#__PURE__*/jsx(Fragment, {}),
+    uncheckedIcon: off ? /*#__PURE__*/jsx("div", {
+      className: classnames(toggleText, no),
+      children: off
+    }) : /*#__PURE__*/jsx(Fragment, {}),
+    onChange: function onChange() {
+      return _onChange(val !== null && val !== void 0 ? val : !state);
+    },
+    checked: state,
+    onColor: myVarVal,
+    offColor: alwaysActiveColor ? myVarVal : '#CACACA',
+    height: height,
+    width: width,
+    handleDiameter: handleDiameter
+  });
+};
+
+export { Toggle as default };