@crystaldesign/diva-web-planner-react 24.13.0-rc.8 → 24.13.0-rc.9

package/build/esm/index-e024530c.js

@@ -0,0 +1,42 @@
+import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
+import { s as styleInject, u as useViewHandler } from './index-5b33f525.js';
+import { useEffect } from 'react';
+import classnames from 'classnames';
+import { jsx, 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 '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'mobx-react-lite';
+
+var checkoutButtonOne = "checkout-button-one-qwQE0";
+var checkoutButtonTwo = "checkout-button-two-PbR3L";
+var checkoutButtonThree = "checkout-button-three-oLcWo";
+var css_248z = ".checkout-button-one-qwQE0 {\n  background-color: #0e2e5b;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 enable-background%3D%22new 0 0 24 24%22 height%3D%2224px%22 viewBox%3D%220 0 24 24%22 width%3D%2224px%22 fill%3D%22%23FFFFFF%22%3E%3Cg%3E%3Cpath d%3D%22M0%2C0h24v24H0V0z%22 fill%3D%22none%22%2F%3E%3C%2Fg%3E%3Cg%3E%3Cpolygon points%3D%226.23%2C20.23 8%2C22 18%2C12 8%2C2 6.23%2C3.77 14.46%2C12%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  padding-left: 20px;\n  text-align: left;\n  background-position: 97% 50%;\n  background-size: 30px;\n  border-radius: 0;\n  border-radius: initial;\n}\n.checkout-button-two-PbR3L {\n  background-color: #f6a000;\n  background-repeat: no-repeat;\n  text-align: left;\n  padding-left: 20px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 27.891 24%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1 %7B        fill%3A %23fff%3B      %7D    %3C%2Fstyle%3E  %3C%2Fdefs%3E  %3Cg id%3D%22Gruppe_1481%22 data-name%3D%22Gruppe 1481%22 transform%3D%22translate(-610 -3077)%22%3E    %3Cpath id%3D%22Pfad_1150%22 data-name%3D%22Pfad 1150%22 class%3D%22cls-1%22 d%3D%22M27.734%2C3.881a.755.755%2C0%2C0%2C0-.591-.288H6.467L5.69.562A.743.743%2C0%2C0%2C0%2C4.966%2C0H.748a.748.748%2C0%2C0%2C0%2C0%2C1.5H4.389L8.911%2C19.161a.743.743%2C0%2C0%2C0%2C.723.562h14.1a.748.748%2C0%2C1%2C0%2C0-1.5H10.216l-.7-2.723H24.538a.747.747%2C0%2C0%2C0%2C.723-.567L27.866%2C4.521a.733.733%2C0%2C0%2C0-.132-.64M23.956%2C14H9.136L6.853%2C5.084H26.19Z%22 transform%3D%22translate(610 3077)%22%2F%3E    %3Cpath id%3D%22Pfad_1151%22 data-name%3D%22Pfad 1151%22 class%3D%22cls-1%22 d%3D%22M195.712%2C422.906a1.706%2C1.706%2C0%2C1%2C1-1.706-1.706%2C1.7%2C1.7%2C0%2C0%2C1%2C1.706%2C1.706%22 transform%3D%22translate(427.1 2676.388)%22%2F%3E    %3Cpath id%3D%22Pfad_1152%22 data-name%3D%22Pfad 1152%22 class%3D%22cls-1%22 d%3D%22M416.112%2C422.906a1.706%2C1.706%2C0%2C1%2C1-1.706-1.706%2C1.7%2C1.7%2C0%2C0%2C1%2C1.706%2C1.706%22 transform%3D%22translate(217.473 2676.388)%22%2F%3E  %3C%2Fg%3E%3C%2Fsvg%3E\");\n  background-position: 97% 50%;\n  background-size: 30px;\n  border-radius: 0;\n  border-radius: initial;\n}\n.checkout-button-three-oLcWo {\n  background-color: #00787f;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 27.67 24%22%3E  %3Cdefs%3E    %3Cstyle%3E      .cls-1 %7B        fill%3A %23fff%3B      %7D    %3C%2Fstyle%3E  %3C%2Fdefs%3E  %3Cpath id%3D%22Pfad_1783%22 data-name%3D%22Pfad 1783%22 class%3D%22cls-1%22 d%3D%22M27.509%2C9.046%2C25.048.431A.611.611%2C0%2C0%2C0%2C24.432%2C0H3.2a.741.741%2C0%2C0%2C0-.615.431L.124%2C9.046a3.042%2C3.042%2C0%2C0%2C0%2C.431%2C2.646%2C3.215%2C3.215%2C0%2C0%2C0%2C2.215%2C1.231v9.846A1.234%2C1.234%2C0%2C0%2C0%2C4%2C24H9.54a1.234%2C1.234%2C0%2C0%2C0%2C1.231-1.231V16.615h6.154v6.154A1.234%2C1.234%2C0%2C0%2C0%2C18.155%2C24h5.538a1.234%2C1.234%2C0%2C0%2C0%2C1.231-1.231V12.862a3.215%2C3.215%2C0%2C0%2C0%2C2.215-1.231A2.7%2C2.7%2C0%2C0%2C0%2C27.509%2C9.046Zm-7.754.246h0a1.917%2C1.917%2C0%2C0%2C1-.431%2C1.538%2C2.475%2C2.475%2C0%2C0%2C1-2.031.8%2C3.116%2C3.116%2C0%2C0%2C1-2.215-.862%2C2.235%2C2.235%2C0%2C0%2C1-.677-1.6V1.231h4.185l1.169%2C8Zm-6.523-.062a2.465%2C2.465%2C0%2C0%2C1-.677%2C1.6%2C3.116%2C3.116%2C0%2C0%2C1-2.215.862%2C2.68%2C2.68%2C0%2C0%2C1-2.031-.8%2C1.983%2C1.983%2C0%2C0%2C1-.431-1.538L9.048%2C1.231h4.185ZM1.54%2C10.954a1.658%2C1.658%2C0%2C0%2C1-.185-1.538L3.632%2C1.231H7.755L6.648%2C9.169a3.254%2C3.254%2C0%2C0%2C1-3.323%2C2.523A2.3%2C2.3%2C0%2C0%2C1%2C1.54%2C10.954ZM18.155%2C22.769V16.615a1.234%2C1.234%2C0%2C0%2C0-1.231-1.231H10.771A1.234%2C1.234%2C0%2C0%2C0%2C9.54%2C16.615v6.154H4V12.862A5.066%2C5.066%2C0%2C0%2C0%2C7.078%2C11.2c.123.185.185.308.308.492a3.849%2C3.849%2C0%2C0%2C0%2C2.954%2C1.231%2C4.222%2C4.222%2C0%2C0%2C0%2C3.077-1.231%2C3.518%2C3.518%2C0%2C0%2C0%2C.431-.492%2C3.082%2C3.082%2C0%2C0%2C0%2C.431.492%2C4.325%2C4.325%2C0%2C0%2C0%2C3.077%2C1.231%2C3.849%2C3.849%2C0%2C0%2C0%2C2.954-1.231%2C1.34%2C1.34%2C0%2C0%2C0%2C.308-.492%2C4.777%2C4.777%2C0%2C0%2C0%2C3.077%2C1.662v9.908Zm8-11.815a2.239%2C2.239%2C0%2C0%2C1-1.846.738%2C3.3%2C3.3%2C0%2C0%2C1-3.323-2.523L19.878%2C1.231H24L26.34%2C9.415A1.683%2C1.683%2C0%2C0%2C1%2C26.155%2C10.954Z%22 transform%3D%22translate(-0.004)%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  text-align: left;\n  padding-left: 20px;\n  background-position: 97% 50%;\n  background-size: 30px;\n  border-radius: 0;\n  border-radius: initial;\n}\n";
+styleInject(css_248z);
+
+var index = function index(_ref) {
+  _objectDestructuringEmpty(_ref);
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.uiState.setBarrierActions([{
+      className: classnames(checkoutButtonOne)
+    }, {
+      className: classnames(checkoutButtonTwo)
+    }, {
+      className: classnames(checkoutButtonThree)
+    }]);
+  }, []);
+  return /*#__PURE__*/jsx(Fragment, {});
+};
+
+export { index as default };

package/build/esm/index-e0ecd541.js

@@ -0,0 +1,144 @@
+import { s as styleInject, u as useViewHandler } from './index-5b33f525.js';
+import { useEffect } from 'react';
+import Inputbox from './index-84da0f82.js';
+import { cssVariables } from './index-dd5e6eff.js';
+import Product from './index-87a900a0.js';
+import Settings from './index-2195404c.js';
+import TabGroup from './index-a0803444.js';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-222d9b19.js';
+import './index-40ac6960.js';
+import 'react-switch';
+import 'react-dropdown';
+import './index-c6d5b42f.js';
+import './index-2722d2d0.js';
+import './index-7e7dd43c.js';
+import './index-37236330.js';
+import './index-34970855.js';
+import './index.module-6ad428dd.js';
+import './index-1baec991.js';
+import './index-384b0e75.js';
+import './index-79b06522.js';
+import './index-3f9b6d11.js';
+import './index-dc5d2511.js';
+import './index-bcb8886e.js';
+import '@crystaldesign/content-box';
+import './index-ea800748.js';
+import './index-c570f7fb.js';
+import '@crystaldesign/content-item';
+import 'react-draggable';
+import './index-003dd4ab.js';
+import './index-75a5186e.js';
+import './index-3af80995.js';
+import './index-aeb5727e.js';
+import './index-6fd6240c.js';
+import 'react-laag';
+import './index-35b1d553.js';
+import './index-ef95955f.js';
+import './index-fda44601.js';
+import 'sift';
+import './index-29834517.js';
+import './index-e70f26b1.js';
+import './index-99c40967.js';
+import './index-8bd5b975.js';
+import './index.module-07053ee3.js';
+import './index-2fe5961a.js';
+import './index-a16bddeb.js';
+import './index-5d0d43d4.js';
+import './index-ee1b8bdf.js';
+import './index-1ba64c92.js';
+import './index-9a4c7b3e.js';
+import './index-9284d795.js';
+import './index-5e37f7f0.js';
+import './index-3e9232bf.js';
+import './index-2de39d6f.js';
+import './index-97b40e06.js';
+import '@crystaldesign/products-component';
+import './index-fd38b571.js';
+import './index-ef87cf8f.js';
+import './index-fea80134.js';
+import './index-e41d56de.js';
+import './index-a274e2fe.js';
+import './index-6a39632a.js';
+import './index-06556a3e.js';
+import './index-5bc6ee2f.js';
+import './index-91e368f1.js';
+import './index-17841b33.js';
+import './index-ffcc4274.js';
+import './index-1f1761fe.js';
+import './index-6e89d010.js';
+import './index.module-75047294.js';
+import './index-9fdeaa1e.js';
+import './index-bfd077b6.js';
+import './index-722930de.js';
+import './index-8a8f1a5b.js';
+import './index-bf5a7176.js';
+import './index-03f28af1.js';
+import './index-842e58ca.js';
+import './index.module-ad7dda95.js';
+import './index-babc2c93.js';
+import './index-d8be514e.js';
+import './index-1e3fde49.js';
+import './index-19a0eec5.js';
+import './index-7e7e54c6.js';
+import './index-41ea744c.js';
+import './index-2874af54.js';
+import './index-6470d626.js';
+
+var wcConfigurator = "wcConfigurator-VvOGT";
+var wcConfiguratorSteps = "wc-configurator-steps-CYXm7";
+var wcConfiguratorProduct = "wc-configurator-product-Z3rOO";
+var productList = "product-list-18YTy";
+var wcConfiguratorSettings = "wc-configurator-Settings-On8Ph";
+var css_248z = "body {\n  margin: 0;\n  overscroll-behavior-x: none;\n}\n\n.wcConfigurator-VvOGT {\n  position: relative;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  -webkit-font-smoothing: antialiased;\n  -webkit-touch-callout: none; /* iOS Safari */\n  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */\n  -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently*/\n\n  position: relative;\n  height: 100%;\n  width: 100%;\n  display: flex;\n}\n\n.wcConfigurator-VvOGT *,\n.wcConfigurator-VvOGT *::before,\n.wcConfigurator-VvOGT *::after {\n  box-sizing: content-box;\n  box-sizing: initial;\n}\n\n.wc-configurator-steps-CYXm7 {\n  width: 75px;\n  position: relative;\n}\n.wc-configurator-product-Z3rOO {\n  width: calc(100% - 501px);\n  position: relative;\n  overflow: auto;\n}\n.wc-configurator-product-Z3rOO.product-list-18YTy {\n  display: none;\n}\n\n.wc-configurator-Settings-On8Ph.product-list-18YTy {\n  flex-grow: 1;\n  position: relative;\n  overflow: auto;\n}\n\n.wc-configurator-Settings-On8Ph {\n  width: 426px;\n  position: relative;\n  border-right: 1px solid #e6e6e6;\n}\n\n::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n::-webkit-scrollbar-track {\n  background: #dfdfdf;\n  border-radius: 3px;\n}\n::-webkit-scrollbar-thumb {\n  background: #b1b1b1;\n  border-radius: 3px;\n}\n";
+styleInject(css_248z);
+
+var Serious = function Serious(props) {
+  var _viewHandler$tabGroup;
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.layoutRendered = true;
+    viewHandler.initCSSVariablesObj(cssVariables);
+  }, []);
+  var currentIsProductList = ((_viewHandler$tabGroup = viewHandler.tabGroupState.curTabGroup) === null || _viewHandler$tabGroup === void 0 ? void 0 : _viewHandler$tabGroup.type) == 'PRODUCTS';
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      ref: function ref(configuratorRef) {
+        return viewHandler.uiState.setConfiguratorRef(configuratorRef);
+      },
+      style: {
+        pointerEvents: viewHandler.uiState.configuratorDisabled ? 'none' : undefined
+      },
+      hidden: viewHandler.uiState.configuratorHidden,
+      id: "wcConfigurator",
+      className: wcConfigurator,
+      children: [/*#__PURE__*/jsx(Product, {
+        className: classnames(wcConfiguratorProduct, currentIsProductList ? productList : undefined),
+        contentItemStartPos: "left"
+      }), /*#__PURE__*/jsx(Settings, {
+        className: classnames(wcConfiguratorSettings, currentIsProductList ? productList : undefined)
+      }), /*#__PURE__*/jsx(TabGroup, {
+        className: wcConfiguratorSteps
+      })]
+    }), viewHandler.settingsState.inputBoxVisible && /*#__PURE__*/jsx(Inputbox, {})]
+  });
+};
+var index = observer(Serious);
+
+export { index as default };

package/build/esm/index-e2ba8af2.js

@@ -0,0 +1,62 @@
+import { s as styleInject, u as useViewHandler } from './index-5b33f525.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import '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 header = "header-88iFZ";
+var wrapper = "wrapper-zFPaP";
+var title = "title-Mime-";
+var sel = "sel--F5X-";
+var collapseArrow = "collapseArrow-iq67x";
+var open = "open-t8G5n";
+var mobile = "mobile-Ksq3e";
+var css_248z = ".header-88iFZ {\n  height: 48px;\n  position: relative;\n  background-color: #f8f8f8;\n  border-bottom: 2px solid #f0f0f0;\n}\n\n.wrapper-zFPaP {\n  margin-left: 16px;\n  margin-right: 16px;\n  display: flex;\n}\n.title-Mime- {\n  padding: 11px;\n  font-weight: 100;\n  font-size: 18px;\n  position: relative;\n}\n\ntitle:hover,\n.sel--F5X- {\n  border: none;\n  color: var(--diva-theme-palette-primary-main);\n}\n\n.title-Mime-::after {\n  content: '';\n  position: absolute;\n  width: 0px;\n  height: 3px;\n  left: 50%;\n  bottom: 0;\n  background-color: var(--diva-theme-palette-primary-main);\n  transition: all ease-in-out 0.2s;\n}\n.title-Mime-:hover::after,\n.sel--F5X-::after {\n  width: 100%;\n  left: 0;\n}\n\n.collapseArrow-iq67x {\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\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 16.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Capa_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 width%3D%22960px%22 height%3D%22560px%22 viewBox%3D%220 0 960 560%22 enable-background%3D%22new 0 0 960 560%22 xml%3Aspace%3D%22preserve%22%3E%3Cg id%3D%22Rounded_Rectangle_33_copy_4_1_%22%3E%09%3Cpath d%3D%22M480%2C344.181L268.869%2C131.889c-15.756-15.859-41.3-15.859-57.054%2C0c-15.754%2C15.857-15.754%2C41.57%2C0%2C57.431l237.632%2C238.937%09%09c8.395%2C8.451%2C19.562%2C12.254%2C30.553%2C11.698c10.993%2C0.556%2C22.159-3.247%2C30.555-11.698l237.631-238.937%09%09c15.756-15.86%2C15.756-41.571%2C0-57.431s-41.299-15.859-57.051%2C0L480%2C344.181z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  transform: rotate(90deg);\n  transition: all 0.35s ease;\n  width: 40px;\n  height: 40px;\n  position: absolute;\n  right: 8px;\n  top: 5px;\n}\n.open-t8G5n .collapseArrow-iq67x {\n  transform: rotate(0deg);\n}\n\n.header-88iFZ.mobile-Ksq3e {\n  height: 38px;\n}\n\n.mobile-Ksq3e .title-Mime- {\n  padding: 8px;\n  font-weight: 300;\n  font-size: 14px;\n}\n\n.mobile-Ksq3e .collapseArrow-iq67x {\n  width: 34px;\n  height: 34px;\n  position: absolute;\n  right: 8px;\n  top: 0px;\n}\n";
+styleInject(css_248z);
+
+var SubTabGroupHeader = function SubTabGroupHeader(_ref) {
+  var openState = _ref.openState,
+    curState = _ref.curState,
+    tabs = _ref.tabs;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsxs("div", {
+    onClick: function onClick() {
+      return openState[1](!openState[0]);
+    },
+    className: classnames(header, openState[0] ? open : undefined, viewHandler.uiState.isInMobileView ? mobile : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      className: wrapper,
+      children: tabs.map(function (b, index) {
+        return /*#__PURE__*/jsxs("div", {
+          className: classnames(title, curState[0] === b && openState[0] ? sel : undefined),
+          onClick: function onClick(e) {
+            curState[1](b);
+            if (!openState[0]) openState[1](true);
+            e.stopPropagation();
+          },
+          children: [b === 'ALL' && tabs.length !== 1 && t('configurator.config_all'), tabs.length === 1 && t('configurator.config_accessoire'), tabs.length > 1 && b !== 'ALL' && index + '.']
+        }, b);
+      })
+    }), /*#__PURE__*/jsx("div", {
+      className: classnames(collapseArrow)
+    })]
+  });
+};
+var SubTabGroupHeader$1 = observer(SubTabGroupHeader);
+
+export { SubTabGroupHeader$1 as default };

package/build/esm/index-e3937d3d.js

@@ -0,0 +1,42 @@
+import './index-5b33f525.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var ElementCopy = function ElementCopy(_ref) {
+  var item = _ref.item,
+    rect = _ref.rect,
+    onElement = _ref.onElement,
+    plannerUIProps = _ref.plannerUIProps;
+  return /*#__PURE__*/jsx("div", {
+    ref: function ref(elem) {
+      return onElement(elem);
+    },
+    onClick: function onClick() {
+      var _item$clickFunction;
+      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId));
+    },
+    style: {
+      left: rect.doUseCalc ? rect.leftCalc : item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px',
+      top: rect.doUseCalc ? rect.topCalc : item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px'
+    },
+    className: classnames(plannerUIProps.classes.copy.ElementCopy, plannerUIProps.classes.buttonGeneral)
+  });
+};
+var ElementCopy$1 = observer(ElementCopy);
+
+export { ElementCopy$1 as default };

package/build/esm/index-e3b3bd43.js

@@ -0,0 +1,53 @@
+import { u as useViewHandler } from './index-5b33f525.js';
+import 'react';
+import { observer } from 'mobx-react-lite';
+import { w as wcFunctionsToolbar, a as wcFunctionsContainer, c as wcIcon, k as wcResetIcon } from './index.module-363e1700.js';
+import { useTranslation } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+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 '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+
+var NewPlanning = function NewPlanning(props) {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var onReset = function onReset() {
+    var _viewHandler$actions;
+    return (_viewHandler$actions = viewHandler.actions) === null || _viewHandler$actions === void 0 ? void 0 : _viewHandler$actions.openModal({
+      title: t('modals.reset'),
+      accept: true,
+      reject: true,
+      text: t('modals.are_you_sure_to_reset'),
+      callback: function callback(accepted) {
+        if (accepted) {
+          viewHandler.productState.onClickReset();
+        }
+      }
+    });
+  };
+  return /*#__PURE__*/jsx("ul", {
+    className: wcFunctionsToolbar,
+    children: /*#__PURE__*/jsx("li", {
+      className: wcFunctionsContainer,
+      onClick: onReset,
+      children: /*#__PURE__*/jsx("div", {
+        className: classnames(wcIcon, wcResetIcon),
+        title: t('configurator.start_new_planning')
+      })
+    })
+  });
+};
+var index = observer(NewPlanning);
+
+export { index as default };

package/build/esm/index-e41d56de.js

@@ -0,0 +1,68 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-5b33f525.js';
+import { useState, useEffect } from 'react';
+import { jsx, 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/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';
+
+var metaData = "meta-data-kJbmQ";
+var css_248z = ".meta-data-kJbmQ {\n  display: -webkit-box;\n  max-height: 64px;\n  min-height: 16px;\n  color: var(--secondaryColor);\n  overflow: hidden;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 1;\n  position: relative;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  z-index: 100;\n  font-size: 13px;\n  line-height: 16px;\n  color: var(--secondaryColor);\n  width: 100%;\n}\n";
+styleInject(css_248z);
+
+var MetaData = function MetaData(_ref) {
+  var style = _ref.style,
+    metaData$1 = _ref.metaData,
+    _ref$visible = _ref.visible,
+    _ref$visible2 = _ref$visible === void 0 ? useState('') : _ref$visible,
+    _ref$visible3 = _slicedToArray(_ref$visible2, 2),
+    metaDataVisible = _ref$visible3[0],
+    setMetaDataVisible = _ref$visible3[1];
+  var viewHandler = useViewHandler();
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    text = _useState2[0],
+    setText = _useState2[1];
+  var displayMetaDatas = viewHandler.getViewConfig().displayMetaDatas;
+  var firstItem = metaData$1 === null || metaData$1 === void 0 ? void 0 : metaData$1.find(function (data) {
+    return displayMetaDatas === null || displayMetaDatas === void 0 ? void 0 : displayMetaDatas.includes(data.codex);
+  });
+  useEffect(function () {
+    if (!firstItem) return;
+    var textTmp = '';
+    for (var i = 0; i < firstItem.values.length; i++) {
+      if (textTmp !== '') textTmp = textTmp + ', ';
+      var _loop = function _loop(j) {
+        var data = metaData$1 === null || metaData$1 === void 0 ? void 0 : metaData$1.find(function (data) {
+          return data.codex === displayMetaDatas[j];
+        });
+        if (!data) return 1; // continue
+        if (textTmp !== '') textTmp = textTmp + ' ';
+        textTmp = textTmp + (data.name ? data.name + ': ' : '') + data.values[i];
+      };
+      for (var j = 0; j < displayMetaDatas.length; j++) {
+        if (_loop(j)) continue;
+      }
+    }
+    setText(textTmp);
+    setMetaDataVisible(textTmp);
+  }, []);
+  if (!metaDataVisible) return /*#__PURE__*/jsx(Fragment, {});
+  return /*#__PURE__*/jsx("div", {
+    style: style,
+    className: metaData,
+    children: text
+  });
+};
+
+export { MetaData as default };

package/build/esm/index-e556010c.js

@@ -0,0 +1,187 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { u as useViewHandler } from './index-5b33f525.js';
+import 'react';
+import { s as shelfPlannerContainerRtv, a as shelfPlannerContainerHorizontal, b as shelfPlannerContainerVertical, e as expanded, c as shelfGrid, d as shelfGridBorder, w as warning, f as accessoires, g as configHeaderWrapper, h as closeButton, n as name, S as SelectedAcc, i as accessoireContainer } from './index-a15c9d1d.js';
+import { S as SettingsItem, c as collapsableInner } from './index-fda44601.js';
+import ShelfAccessoires from './index-0d7d03a3.js';
+import ShelfAccessoiresOld from './index-e8be38d0.js';
+import GridList from './index-afb4e2f9.js';
+import classnames from 'classnames';
+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/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 'sift';
+import './index-29834517.js';
+import './index-75a5186e.js';
+import './index-e70f26b1.js';
+import './index-99c40967.js';
+import './index-8bd5b975.js';
+import './index.module-07053ee3.js';
+import './index-40ac6960.js';
+import 'react-switch';
+import './index-2fe5961a.js';
+import './index-a16bddeb.js';
+import 'react-dropdown';
+import './index-5d0d43d4.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-ee1b8bdf.js';
+import './index-1ba64c92.js';
+import './index-9a4c7b3e.js';
+import '@crystaldesign/content-box';
+import './index-9284d795.js';
+import './index-5e37f7f0.js';
+import './index-3e9232bf.js';
+import './index-2de39d6f.js';
+import './index-97b40e06.js';
+import '@crystaldesign/products-component';
+import './index-fd38b571.js';
+import './index-ef87cf8f.js';
+import './index-fea80134.js';
+import 'react-laag';
+import './index-e41d56de.js';
+import './index-a274e2fe.js';
+import './index-6a39632a.js';
+import './index-06556a3e.js';
+import './index-5bc6ee2f.js';
+import './index-91e368f1.js';
+import './index-17841b33.js';
+import './index-ffcc4274.js';
+import './index-1f1761fe.js';
+import './index-6e89d010.js';
+import './index.module-75047294.js';
+import './index-9fdeaa1e.js';
+import './index-bfd077b6.js';
+import './index-722930de.js';
+import './index-8a8f1a5b.js';
+import './index-bf5a7176.js';
+import './index-03f28af1.js';
+import './index-842e58ca.js';
+import './index.module-ad7dda95.js';
+import './index-babc2c93.js';
+import './index-d8be514e.js';
+import 'react-beautiful-dnd';
+import './index-be00c612.js';
+
+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 ShelfPlanner = function ShelfPlanner(_ref) {
+  var _viewHandler$settings, _viewHandler$settings2, _viewHandler$settings3, _viewHandler$settings4, _item$shelfPlannerGri, _item$shelfPlannerGri2, _item$shelfPlannerGri3, _filteredGroups$0$ite, _filteredGroups$, _selAccItem, _selAccItem2;
+  var item = _ref.item,
+    style = _ref.style,
+    filteredGroups = _ref.filteredGroups;
+  var viewHandler = useViewHandler();
+  var height = ((_viewHandler$settings = (_viewHandler$settings2 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings2 === void 0 ? void 0 : _viewHandler$settings2.getBoundingClientRect().height) !== null && _viewHandler$settings !== void 0 ? _viewHandler$settings : 0) - 10;
+  var width = ((_viewHandler$settings3 = (_viewHandler$settings4 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings4 === void 0 ? void 0 : _viewHandler$settings4.getBoundingClientRect().width) !== null && _viewHandler$settings3 !== void 0 ? _viewHandler$settings3 : 0) - 16;
+  var grid = (_item$shelfPlannerGri = item === null || item === void 0 || (_item$shelfPlannerGri2 = item.shelfPlannerGrids) === null || _item$shelfPlannerGri2 === void 0 ? void 0 : _item$shelfPlannerGri2.find(function (g) {
+    return g.ActAccessoire;
+  })) !== null && _item$shelfPlannerGri !== void 0 ? _item$shelfPlannerGri : item === null || item === void 0 || (_item$shelfPlannerGri3 = item.shelfPlannerGrids) === null || _item$shelfPlannerGri3 === void 0 ? void 0 : _item$shelfPlannerGri3[0];
+  if (!grid) return /*#__PURE__*/jsx(Fragment, {});
+  var items = (_filteredGroups$0$ite = (_filteredGroups$ = filteredGroups[0]) === null || _filteredGroups$ === void 0 ? void 0 : _filteredGroups$.items) !== null && _filteredGroups$0$ite !== void 0 ? _filteredGroups$0$ite : [];
+  var selAcc = grid.ActAccessoire;
+  var selAccItem = undefined;
+  if (selAcc) {
+    selAccItem = items.find(function (item) {
+      return item.articleCodex == selAcc;
+    });
+  }
+  var requiredWarning = grid.getRequiredWarning(viewHandler.configState.lang);
+  var palettesOfSelectedAcc = [];
+  if ((_selAccItem = selAccItem) !== null && _selAccItem !== void 0 && (_selAccItem = _selAccItem.configStepKeys) !== null && _selAccItem !== void 0 && _selAccItem.length) {
+    var _loop = function _loop() {
+      var stepKey = selAccItem.configStepKeys[i];
+      var itemPalette = viewHandler.settingsState.itemPaletteArr.find(function (_ref2) {
+        var _ref3 = _slicedToArray(_ref2, 2);
+          _ref3[0];
+          var itemPalette = _ref3[1];
+        return itemPalette.configStepKey == stepKey.key;
+      });
+      if (!itemPalette) return 1; // continue
+      if (viewHandler.settingsState.selectedShelfAccessoire == stepKey.basketId) palettesOfSelectedAcc.push(itemPalette[1]);
+    };
+    for (var i = 0; i < selAccItem.configStepKeys.length; i++) {
+      if (_loop()) continue;
+    }
+  }
+  return /*#__PURE__*/jsxs("div", {
+    ref: function ref(_ref4) {
+      return item.htmlRef = _ref4;
+    },
+    className: classnames(viewHandler.productState.shelfPlannerRTV ? shelfPlannerContainerRtv : undefined, grid.Direction == 'horizontal' ? shelfPlannerContainerHorizontal : shelfPlannerContainerVertical, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined),
+    style: _objectSpread({
+      height: height
+    }, style),
+    children: [!viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx("div", {
+      className: shelfGrid,
+      children: /*#__PURE__*/jsx("div", {
+        className: shelfGridBorder,
+        children: /*#__PURE__*/jsx(GridList, {
+          item: item,
+          direction: grid.Direction,
+          width: width,
+          height: height - 16 - 16
+        })
+      })
+    }), requiredWarning && /*#__PURE__*/jsx("div", {
+      className: warning,
+      dangerouslySetInnerHTML: {
+        __html: requiredWarning
+      }
+    }), /*#__PURE__*/jsxs("div", {
+      className: accessoires,
+      children: [!!palettesOfSelectedAcc.length && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsxs("div", {
+          className: configHeaderWrapper,
+          onClick: function onClick() {
+            return viewHandler.settingsState.setSelectedShelfAccessoire();
+          },
+          children: [/*#__PURE__*/jsx("div", {
+            className: closeButton
+          }), /*#__PURE__*/jsx("div", {
+            className: name,
+            children: (_selAccItem2 = selAccItem) === null || _selAccItem2 === void 0 ? void 0 : _selAccItem2.name
+          })]
+        }), palettesOfSelectedAcc.map(function (item, index) {
+          return /*#__PURE__*/jsx(SettingsItem, {
+            item: item,
+            id: item.id
+          }, index);
+        })]
+      }), !palettesOfSelectedAcc.length && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(SelectedAcc, {
+          selAccItem: selAccItem
+        }), /*#__PURE__*/jsx("div", {
+          className: classnames(accessoireContainer, collapsableInner),
+          style: {
+            height: grid.Direction == 'horizontal' ? height - 80 : ''
+          },
+          children: items.map(function (acc, key) {
+            return /*#__PURE__*/jsxs(Fragment, {
+              children: [viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx(ShelfAccessoires, {
+                grids: item.shelfPlannerGrids,
+                item: acc,
+                sel: acc.articleCodex == selAcc
+              }, key), !viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx(ShelfAccessoiresOld, {
+                grids: item.shelfPlannerGrids,
+                item: acc
+              }, key)]
+            });
+          })
+        })]
+      })]
+    })]
+  });
+};
+var index = observer(ShelfPlanner);
+
+export { index as default };