npm - @crystaldesign/diva-web-planner-react - Versions diffs - 24.11.0 → 24.11.1 - Mend

@crystaldesign/diva-web-planner-react 24.11.0 → 24.11.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1623) hide show

package/build/esm/index-bb303417.js ADDED Viewed

@@ -0,0 +1,106 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-6ae957da.js';
+import { useState, useEffect } from 'react';
+import { observer } from 'mobx-react-lite';
+import { a as wcFunctionsContainer, c as wcIcon } from './index.module-da90a5d7.js';
+import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import Share from './index-4b1b1387.js';
+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/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 '@babel/runtime/helpers/typeof';
+var wcFunctionsToolbar = "wcFunctionsToolbar-l5jaw";
+var wcSaveIcon = "wcSaveIcon-epW6E";
+var wcConsulationIcon = "wcConsulationIcon-MpgkK";
+var wcBookmarkIcon = "wcBookmarkIcon-G2989";
+var wcShareIcon = "wcShareIcon-1G5IF";
+var css_248z = ".wcFunctionsToolbar-l5jaw {\n  position: absolute;\n  top: 0px;\n  right: 0px;\n  margin-top: 0px;\n}\n.wcFunctionsToolbar-l5jaw li {\n  float: left;\n  padding: 4.8px;\n  border-radius: var(--globalBorderRadius);\n  list-style: none;\n  transition: box-shadow 0.15s ease;\n}\n\n.wcSaveIcon-epW6E {\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22 standalone%3D%22no%22%3F%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 width%3D%22100%25%22  height%3D%22100%25%22 viewBox%3D%220 0 9 8%22 version%3D%221.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 xml%3Aspace%3D%22preserve%22 style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.41421%3B%22%3E%3Cpath  d%3D%22M4.104%2C7.2l-0.384%2C-0.24c-1.296%2C-0.768 -3.72%2C-2.208 -3.72%2C-4.56c0%2C-1.32 1.08%2C-2.4 2.4%2C-2.4c0.648%2C0 1.272%2C0.264 1.704%2C0.72c0.456%2C-0.456 1.056%2C-0.72 1.704%2C-0.72c1.32%2C0 2.4%2C1.08 2.4%2C2.4c0%2C2.376 -2.424%2C3.792 -3.72%2C4.56l-0.384%2C0.24Zm-1.704%2C-6.672c-1.032%2C0 -1.872%2C0.84 -1.872%2C1.872c0%2C2.064 2.256%2C3.384 3.456%2C4.104l0.12%2C0.072l0.12%2C-0.072c1.2%2C-0.72 3.456%2C-2.04 3.456%2C-4.104c0%2C-1.032 -0.84%2C-1.872 -1.872%2C-1.872c-0.576%2C0 -1.152%2C0.288 -1.488%2C0.744l-0.216%2C0.288l-0.216%2C-0.288c-0.36%2C-0.48 -0.912%2C-0.744 -1.488%2C-0.744Z%22 style%3D%22fill%3A%23black%3Bfill-rule%3Anonzero%3B%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcConsulationIcon-MpgkK {\n  background-position-y: -6px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M214.461-100q-31.302 0-53.548-22.246-22.246-22.247-22.246-53.549v-537.231q0-31.302 22.246-53.548 22.246-22.247 53.548-22.247h57.385v-80.41h55.539v80.41h308.307v-80.41h52.975v80.41h56.872q31.301 0 53.548 22.247 22.246 22.246 22.246 53.548v537.231q0 31.302-22.246 53.549Q776.84-100 745.539-100H214.461Zm0-51.179h531.078q9.23 0 16.923-7.693 7.692-7.692 7.692-16.923v-376H189.846v376q0 9.231 7.692 16.923 7.692 7.693 16.923 7.693Zm-24.615-451.795h580.308v-110.052q0-9.231-7.692-16.923-7.693-7.692-16.923-7.692H214.461q-9.231 0-16.923 7.692-7.692 7.692-7.692 16.923v110.052Zm0 0v-134.667 134.667Zm290.025 213.128q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526Zm-160 0q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526Zm320 0q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526ZM479.871-236q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q493.461-236 479.871-236Zm-160 0q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q333.461-236 319.871-236Zm320 0q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q653.461-236 639.871-236Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcBookmarkIcon-G2989 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M220-154.667V-750q0-30.905 22.246-53.35 22.247-22.445 53.549-22.445h368.41q31.302 0 53.549 22.445Q740-780.905 740-750v595.333L480-265.744 220-154.667Zm51.179-77.948L480-321.824l208.821 89.209V-750q0-9.231-7.693-16.923-7.692-7.693-16.923-7.693h-368.41q-9.231 0-16.923 7.693-7.693 7.692-7.693 16.923v517.385Zm0-542.001h417.642-417.642Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcShareIcon-1G5IF {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M725.916-88q-45.1 0-76.815-31.352-31.716-31.352-31.716-76.14 0-7.503 1.461-16.574 1.462-9.07 4.898-16.41L314.09-409.641q-15.064 17.359-35.86 26.526-20.796 9.166-42.845 9.166-44.855 0-76.787-31.352-31.931-31.352-31.931-76.141t31.931-76.032q31.932-31.244 76.787-31.244 22.176 0 43.088 8.68 20.912 8.679 35.424 26.038l309.847-180.407q-3.436-7.552-4.898-16.41-1.461-8.857-1.461-16.465 0-44.744 31.569-76.064 31.57-31.321 76.669-31.321 44.377 0 76.121 31.317 31.743 31.317 31.743 76.056 0 45.422-31.931 76.409-31.932 30.987-76.787 30.987-22.952 0-42.963-8.192t-35.588-25.551L337.077-514.732q2.769 7.53 4.231 16.605 1.461 9.074 1.461 16.795 0 7.722-1.461 16.153-1.462 8.432-4.231 15.963l309.141 179.524q15.577-15.872 35.462-24.475 19.884-8.602 43.089-8.602 44.855 0 76.787 30.975 31.931 30.975 31.931 76.141 0 45.166-31.597 76.409Q770.293-88 725.916-88Zm-.519-623.077q23.347 0 40.129-16.743 16.782-16.744 16.782-40.09 0-23.346-16.626-40.129-16.626-16.782-39.798-16.782-23.456 0-40.388 16.626t-16.932 39.798q0 23.456 16.743 40.388 16.744 16.932 40.09 16.932ZM234.679-425.128q23.347 0 40.129-16.743 16.782-16.744 16.782-40.09 0-23.347-16.626-40.129-16.626-16.782-39.798-16.782-23.456 0-40.388 16.626-16.932 16.625-16.932 39.798 0 23.456 16.743 40.388 16.744 16.932 40.09 16.932Zm490.718 285.949q23.347 0 40.129-16.744 16.782-16.743 16.782-40.09 0-23.346-16.626-40.128t-39.798-16.782q-23.456 0-40.388 16.626-16.932 16.625-16.932 39.798 0 23.456 16.743 40.388 16.744 16.932 40.09 16.932Zm.372-629.103ZM235.051-482.333Zm490.718 285.948Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcShareIcon-1G5IF:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M725.916-88q-45.1 0-76.815-31.352-31.716-31.352-31.716-76.14 0-7.503 1.461-16.574 1.462-9.07 4.898-16.41L314.09-409.641q-15.064 17.359-35.86 26.526-20.796 9.166-42.845 9.166-44.855 0-76.787-31.352-31.931-31.352-31.931-76.141t31.931-76.032q31.932-31.244 76.787-31.244 22.176 0 43.088 8.68 20.912 8.679 35.424 26.038l309.847-180.407q-3.436-7.552-4.898-16.41-1.461-8.857-1.461-16.465 0-44.744 31.569-76.064 31.57-31.321 76.669-31.321 44.377 0 76.121 31.317 31.743 31.317 31.743 76.056 0 45.422-31.931 76.409-31.932 30.987-76.787 30.987-22.952 0-42.963-8.192t-35.588-25.551L337.077-514.732q2.769 7.53 4.231 16.605 1.461 9.074 1.461 16.795 0 7.722-1.461 16.153-1.462 8.432-4.231 15.963l309.141 179.524q15.577-15.872 35.462-24.475 19.884-8.602 43.089-8.602 44.855 0 76.787 30.975 31.931 30.975 31.931 76.141 0 45.166-31.597 76.409Q770.293-88 725.916-88Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcBookmarkIcon-G2989:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M220-154.667V-750q0-30.905 22.189-53.35 22.188-22.445 53.606-22.445h368.41q31.418 0 53.606 22.445Q740-780.905 740-750v595.333L480-265.744 220-154.667Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcConsulationIcon-MpgkK:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2240%22 viewBox%3D%220 -960 960 960%22 width%3D%2240%22%3E%3Cpath d%3D%22M479.871-389.846q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526Zm-160 0q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526Zm320 0q-13.589 0-24.115-10.655-10.525-10.654-10.525-24.243 0-13.589 10.654-24.115 10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.589-10.654 24.115-10.654 10.526-24.244 10.526ZM479.871-236q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q493.461-236 479.871-236Zm-160 0q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q333.461-236 319.871-236Zm320 0q-13.589 0-24.115-10.654-10.525-10.655-10.525-24.244t10.654-24.115q10.654-10.526 24.244-10.526 13.589 0 24.115 10.655 10.525 10.654 10.525 24.243 0 13.59-10.654 24.115Q653.461-236 639.871-236Zm-425.41 136q-31.302 0-53.548-22.246-22.246-22.247-22.246-53.549v-537.231q0-31.302 22.246-53.548 22.246-22.247 53.548-22.247h57.385v-80.41h55.539v80.41h308.307v-80.41h52.975v80.41h56.872q31.301 0 53.548 22.247 22.246 22.246 22.246 53.548v537.231q0 31.302-22.246 53.549Q776.84-100 745.539-100H214.461Zm0-51.179h531.078q9.23 0 16.923-7.693 7.692-7.692 7.692-16.923v-376H189.846v376q0 9.231 7.692 16.923 7.692 7.693 16.923 7.693Z%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background 0.4s;\n}\n\n.wcSaveIcon-epW6E:hover {\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22UTF-8%22 standalone%3D%22no%22%3F%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 width%3D%22100%25%22 height%3D%22100%25%22 viewBox%3D%220 0 9 8%22 version%3D%221.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 xml%3Aspace%3D%22preserve%22 style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.41421%3B%22%3E%3Cpath d%3D%22M4.104%2C7.2c1.231%2C-0.757 4.104%2C-2.296 4.104%2C-4.878c0%2C-1.279 -1.026%2C-2.322 -2.283%2C-2.322c-0.744%2C0 -1.411%2C0.365 -1.821%2C0.939c-0.41%2C-0.574 -1.077%2C-0.939 -1.821%2C-0.939c-1.257%2C0 -2.283%2C1.043 -2.283%2C2.322c-0.025%2C2.556 2.847%2C4.095 4.104%2C4.878Z%22 style%3D%22fill%3A%23000%3Bfill-rule%3Anonzero%3B%22%2F%3E%3C%2Fsvg%3E\");\n  cursor: pointer;\n}\n";
+styleInject(css_248z);
+var Wishlist = function Wishlist(props) {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
+  var _useDivaCore = useDivaCore(),
+    openModal = _useDivaCore.actions.openModal;
+    _useDivaCore.state.isMobile;
+  useEffect(function () {
+    var _viewHandler$getViewC;
+    if (!loading) openModal({
+      title: t('configurator.sharetitle'),
+      rejectByIcon: true,
+      content: /*#__PURE__*/jsx(Share, {
+        url: (_viewHandler$getViewC = viewHandler.getViewConfig().shareUrl) !== null && _viewHandler$getViewC !== void 0 ? _viewHandler$getViewC : '',
+        divaNr: viewHandler.divaWebPlanner.divaNr,
+        loading: loading
+      })
+    });
+  }, [loading]);
+  return /*#__PURE__*/jsxs("ul", {
+    className: wcFunctionsToolbar,
+    children: [viewHandler.getIsInMobileView() && /*#__PURE__*/jsxs(Fragment, {
+      children: [viewHandler.eventIsManagedByClient('onRequestConsulation') && /*#__PURE__*/jsx("li", {
+        className: wcFunctionsContainer,
+        children: /*#__PURE__*/jsx("div", {
+          className: classnames(wcIcon, wcConsulationIcon),
+          title: t('configurator.consulation'),
+          onClick: viewHandler.productState.onRequestConsulation
+        })
+      }), viewHandler.eventIsManagedByClient('onSave') && /*#__PURE__*/jsx("li", {
+        className: wcFunctionsContainer,
+        children: /*#__PURE__*/jsx("div", {
+          className: classnames(wcIcon, wcBookmarkIcon),
+          title: t('configurator.bookmark'),
+          onClick: viewHandler.productState.onClickSave2
+        })
+      })]
+    }), /*#__PURE__*/jsx("li", {
+      className: wcFunctionsContainer,
+      children: /*#__PURE__*/jsx("div", {
+        className: classnames(wcIcon, wcSaveIcon),
+        title: t('configurator.wishlist'),
+        onClick: viewHandler.productState.onClickSave
+      })
+    }), viewHandler.getViewConfig().shareUrl && /*#__PURE__*/jsx("li", {
+      className: wcFunctionsContainer,
+      children: /*#__PURE__*/jsx("div", {
+        className: classnames(wcIcon, wcShareIcon),
+        title: t('configurator.share'),
+        onClick: function onClick() {
+          var _viewHandler$getViewC2;
+          setLoading(true);
+          viewHandler.productState.syncOnClickShare().then(function () {
+            return setLoading(false);
+          });
+          openModal({
+            title: t('configurator.sharetitle'),
+            rejectByIcon: true,
+            content: /*#__PURE__*/jsx(Share, {
+              url: (_viewHandler$getViewC2 = viewHandler.getViewConfig().shareUrl) !== null && _viewHandler$getViewC2 !== void 0 ? _viewHandler$getViewC2 : '',
+              divaNr: viewHandler.divaWebPlanner.divaNr,
+              loading: true
+            })
+          });
+        }
+      })
+    })]
+  });
+};
+var index = observer(Wishlist);
+export { index as default };

package/build/esm/index-bb7a42a4.js ADDED Viewed

@@ -0,0 +1,132 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-6ae957da.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useState, useEffect } from 'react';
+import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import ProductHeaderFunction from './index-87a2246f.js';
+import { ContentBoxComponent } from '@crystaldesign/content-box';
+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/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+var wrapper = "wrapper-y4VmL";
+var wcConfiguratorProductHeader = "wcConfiguratorProductHeader-W1oWZ";
+var expanded = "expanded-rNRc-";
+var functionWrapper = "functionWrapper-3sgkI";
+var landscape = "landscape-TuCY-";
+var contentBoxWrapper = "content-box-wrapper-KgSZb";
+var maxExpanded = "max-Expanded-4m94C";
+var textbackground = "textbackground-F3b8W";
+var portrait = "portrait-Otsjq";
+var wcPriceinfo = "wcPriceinfo-Zmaer";
+var wcFormattedprice = "wcFormattedprice-sdLxf";
+var wcFormattedBruttoPrice = "wc-formatted-brutto-price-MDFl1";
+var fullscreen = "fullscreen-94axf";
+var room = "room-NxmMf";
+var css_248z = "/* Productdaten */\n\n.wrapper-y4VmL {\n  display: flex;\n  flex-direction: row;\n  height: 70px;\n  z-index: 112;\n  transition: width 0.2s ease-in-out, opacity 0.5s ease-in-out;\n  opacity: 1;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 50%;\n  justify-self: flex-start;\n  z-index: 300;\n  margin: 16px 0 16px 16px;\n}\n.expanded-rNRc- .wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 100%;\n}\n.functionWrapper-3sgkI {\n  flex-basis: 50%;\n}\n\n.functionWrapper-3sgkI {\n  flex-basis: 100%;\n  position: relative;\n  z-index: 112;\n  margin: 16px;\n}\n\n.landscape-TuCY- .functionWrapper-3sgkI {\n  margin: 8px 24px 0px 0px;\n}\n\n.content-box-wrapper-KgSZb {\n  z-index: 112;\n}\n\n.expanded-rNRc-.wrapper-y4VmL {\n  width: calc(55% - 40px - 24px);\n}\n\n.max-Expanded-4m94C.wrapper-y4VmL,\n.settings-Foldedup-HM7JT.wrapper-y4VmL {\n  opacity: 0;\n}\n\n.wrapper-y4VmL h1 {\n  font-weight: 300;\n  font-size: 24px;\n  line-height: 27.2px;\n  text-transform: uppercase;\n  letter-spacing: 0.2px;\n  color: var(--secondaryColor);\n  margin: 0 0 10px;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  white-space: nowrap;\n\n  border-radius: 100px;\n  width: -moz-fit-content;\n  width: fit-content;\n}\n.textbackground-F3b8W {\n  border-radius: 0px 0px 12px 0px;\n  padding: 0px 12px 6px 16px;\n  position: absolute;\n  width: -moz-fit-content;\n  width: fit-content;\n  white-space: nowrap;\n  left: 0px;\n  background-color: #fff;\n}\n\n.portrait-Otsjq .textbackground-F3b8W {\n  margin-top: 5px;\n\n  background-color: transparent;\n}\n\n.expanded-rNRc-.wrapper-y4VmL h1 {\n  max-width: 300px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.wcPriceinfo-Zmaer {\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  font-weight: 300;\n  -webkit-text-stroke: 0.4px;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n}\n\n.wcFormattedprice-sdLxf {\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  -webkit-text-stroke: 0.4px;\n  margin: 0px;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n}\n\n.wc-formatted-brutto-price-MDFl1 {\n  position: relative;\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n  -webkit-text-stroke: 0.4px;\n  margin: 0px 10px;\n}\n\n.wc-formatted-brutto-price-MDFl1:before {\n  position: absolute;\n  content: '';\n  left: 0;\n  top: 50%;\n  right: 0;\n  border-top: 1px solid;\n  border-color: inherit;\n\n  transform: rotate(5deg);\n}\n\n.landscape-TuCY-.wrapper-y4VmL {\n  margin-left: 2rem;\n  width: calc(100% - 1rem);\n  height: 54.4px;\n}\n\n.fullscreen-94axf.landscape-TuCY-.wrapper-y4VmL {\n  left: 50px;\n  top: 0px;\n  margin-left: 0.5rem;\n  margin-top: 4px;\n  width: calc(100% - 1rem);\n  height: 24.4px;\n}\n\n.landscape-TuCY- h1 {\n  margin: 0px;\n  margin-top: 14.4px;\n  font-size: 22.4px;\n  line-height: 18px;\n  width: 67%;\n}\n.landscape-TuCY- h2 {\n  margin: 0;\n  margin: initial;\n  font-weight: 100;\n  width: 67%;\n  line-height: 0.65;\n  -webkit-text-stroke: 0.3px;\n}\n.landscape-TuCY- .wcPriceinfo-Zmaer {\n  font-size: 15.6px;\n}\n\n.landscape-TuCY- .wcFormattedprice-sdLxf {\n  font-size: 15.6px;\n}\n\n.portrait-Otsjq.wrapper-y4VmL {\n  height: 54.4px;\n  width: calc(100% - 4px);\n}\n\n.portrait-Otsjq h1 {\n  margin: 0px;\n  font-size: 17px;\n  line-height: 20px;\n}\n\n.portrait-Otsjq.room-NxmMf h1,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf h1 {\n  color: var(--secondaryColor);\n  text-shadow: 3px 4px 15px #000000;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n}\n\n.portrait-Otsjq.room-NxmMf .wcPriceinfo-Zmaer,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf .wcPriceinfo-Zmaer,\n.portrait-Otsjq.room-NxmMf .wcFormattedprice-sdLxf,\n.landscape-TuCY-.fullscreen-94axf.room-NxmMf .wcFormattedprice-sdLxf {\n  color: white;\n}\n\n.portrait-Otsjq h2 {\n  margin: 0;\n  margin: initial;\n  font-weight: 100;\n  width: 67%;\n  line-height: 0.65;\n}\n";
+styleInject(css_248z);
+var ProductHeader = function ProductHeader(_ref) {
+  var hidePrice = _ref.hidePrice,
+    productClass = _ref.productClass;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useDivaCore = useDivaCore(),
+    _useDivaCore$state = _useDivaCore.state,
+    hidePrices = _useDivaCore$state.hidePrices,
+    _useDivaCore$state$di = _useDivaCore$state.dimensions,
+    isMobile = _useDivaCore$state$di.isMobile,
+    isTablet = _useDivaCore$state$di.isTablet;
+  var headerContentBoxProps = viewHandler.getViewConfig().productHeaderContentBox;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    dimensions = _useState2[0],
+    setDimensions = _useState2[1];
+  var hideWebConfiguratorTitle = viewHandler.getViewConfig().hideWebConfiguratorTitle || viewHandler.getViewConfig().hideWebConfiguratorTitleInMobile && viewHandler.getIsInMobileView();
+  useEffect(function () {
+    if (isMobile && !isTablet || !viewHandler.divaWebPlanner.actSet()) return;
+    viewHandler.divaWebPlanner.getDimension().then(function (res) {
+      if ((!res || res.length == 0) && dimensions.length > 0) setDimensions([]);
+      if (!res || res.every(function (r, idx) {
+        var _dimensions$idx, _dimensions$idx2;
+        return (dimensions === null || dimensions === void 0 || (_dimensions$idx = dimensions[idx]) === null || _dimensions$idx === void 0 ? void 0 : _dimensions$idx.elementIds.includes(r === null || r === void 0 ? void 0 : r.elementId)) && (r === null || r === void 0 ? void 0 : r.dimension) == (dimensions === null || dimensions === void 0 || (_dimensions$idx2 = dimensions[idx]) === null || _dimensions$idx2 === void 0 ? void 0 : _dimensions$idx2.dimension);
+      })) return;
+      var cleanedDimensions = [];
+      res.forEach(function (r) {
+        if (r.dimension == 0) return;
+        var foundDimensionIdx = cleanedDimensions.findIndex(function (cd) {
+          return cd.dimension == r.dimension && cd.dimensionId == r.dimensionId;
+        });
+        if (foundDimensionIdx != -1) cleanedDimensions[foundDimensionIdx].elementIds.push(r.elementId);else cleanedDimensions.push({
+          dimensionId: r.dimensionId,
+          elementIds: [r.elementId],
+          dimension: r.dimension
+        });
+      });
+      setDimensions(cleanedDimensions);
+    });
+  }, [viewHandler.divaWebPlanner.actSet(), viewHandler.settingsState.configChanged]);
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wrapper, productClass, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? maxExpanded : undefined, viewHandler.productState.plannerRenderingIsStaticBG ? room : undefined, viewHandler.uiState.ViewConfig.landscapeProductNotFullscreen ? undefined : fullscreen),
+    children: [/*#__PURE__*/jsxs("div", {
+      className: wcConfiguratorProductHeader,
+      "data-test-id": "configProductHeader",
+      children: [!hideWebConfiguratorTitle && /*#__PURE__*/jsx("h1", {
+        "data-test-id": "productHeaderTitle",
+        children: viewHandler.productState.webConifguratorTitle
+      }), /*#__PURE__*/jsxs("div", {
+        className: textbackground,
+        children: [!hidePrices && !hidePrice && /*#__PURE__*/jsxs("div", {
+          children: [/*#__PURE__*/jsxs("span", {
+            className: wcPriceinfo,
+            "data-test-id": "productHeaderPriceInfo",
+            children: [' ', t('configurator.PRICE_INFO')]
+          }), /*#__PURE__*/jsxs("span", {
+            className: wcFormattedprice,
+            "data-test-id": "productHeaderFormattedPrice",
+            children: [' ', viewHandler.productState.formatedCurSetPrice]
+          }), viewHandler.productState.formatedBruttoPrice && /*#__PURE__*/jsxs("span", {
+            className: wcFormattedBruttoPrice,
+            "data-test-id": "productHeaderFormattedBruttoPrice",
+            children: [' ', viewHandler.productState.formatedBruttoPrice]
+          })]
+        }), dimensions.map(function (dimension) {
+          var _dimension$dimension;
+          return /*#__PURE__*/jsxs("div", {
+            children: [/*#__PURE__*/jsxs("span", {
+              className: wcPriceinfo,
+              children: [t('configurator.headerdimension.' + dimension.dimensionId), " ", dimensions.length > 1 && '(' + dimension.elementIds.join(',') + ')', ":", ' ']
+            }), /*#__PURE__*/jsxs("span", {
+              className: wcFormattedprice,
+              children: [(_dimension$dimension = dimension.dimension) !== null && _dimension$dimension !== void 0 ? _dimension$dimension : 0, " cm"]
+            })]
+          });
+        })]
+      })]
+    }), (!viewHandler.uiState.isMobileLandscape || viewHandler.uiState.ViewConfig.landscapeProductNotFullscreen) && /*#__PURE__*/jsx("div", {
+      className: functionWrapper,
+      children: /*#__PURE__*/jsx(ProductHeaderFunction, {})
+    }), headerContentBoxProps && !viewHandler.uiState.isMobileLandscape && /*#__PURE__*/jsx("div", {
+      className: contentBoxWrapper,
+      children: /*#__PURE__*/jsx(ContentBoxComponent, {
+        settings: {
+          contentBoxProps: headerContentBoxProps
+        }
+      })
+    })]
+  });
+};
+var ProductHeader$1 = observer(ProductHeader);
+export { ProductHeader$1 as default };

package/build/esm/index-bbfc7452.js ADDED Viewed

@@ -0,0 +1,146 @@
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject, u as useViewHandler } from './index-6ae957da.js';
+import { useState, useEffect } from 'react';
+import OrbitControlElement from 'react-3d-cube-interaction';
+import { observer } from 'mobx-react-lite';
+import { useTranslation } from '@crystaldesign/diva-core';
+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/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+var orbitInteractionContainer = "orbit-interaction-container-BHDEA";
+var cubeText = "cubeText-rsimr";
+var mobile = "mobile-YALCk";
+var css_248z = ".orbit-interaction-container-BHDEA {\n  position: absolute;\n  bottom: 20px;\n  right: 20px;\n  z-index: 350;\n}\n\n.cubeText-rsimr {\n  font-size: max(12px, min(2vw, 20px));\n}\n\n.mobile-YALCk.orbit-interaction-container-BHDEA {\n  position: absolute;\n  bottom: 10px;\n  left: 20px;\n  right: auto;\n  right: initial;\n  z-index: 350;\n}\n";
+styleInject(css_248z);
+var camRotHorizontal_LastFrame = undefined;
+var camRotVertical_LastFrame = undefined;
+var AUTO_HIDE_IN_MS = 2000;
+var timeOut = undefined;
+var OrbitInteractionStandard = function OrbitInteractionStandard(_ref) {
+  var _viewHandler$productS;
+  var _ref$orbitInteraction = _ref.orbitInteractionContainerClass,
+    orbitInteractionContainerClass = _ref$orbitInteraction === void 0 ? orbitInteractionContainer : _ref$orbitInteraction;
+  var viewHandler = useViewHandler();
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    isHidden = _useState2[0],
+    setHidden = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  useEffect(function () {
+    if (timeOut) clearTimeout(timeOut);
+    if (isHidden) {
+      timeOut = setTimeout(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              viewHandler.productState.setOrbitIsHidden(true);
+            case 1:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      })), AUTO_HIDE_IN_MS);
+    } else {
+      viewHandler.productState.setOrbitIsHidden(false);
+    }
+  }, [isHidden]);
+  if (viewHandler.productState.plannerRenderingIsStaticBG) return /*#__PURE__*/jsx(Fragment, {});
+  var initParams = viewHandler.viewPlannerHandler.getOrbitCubeInitParams();
+  var onRotationChange = function onRotationChange(p) {
+    if (camRotHorizontal_LastFrame != undefined && camRotVertical_LastFrame != undefined && p.horizontal == camRotHorizontal_LastFrame && p.vertical == camRotVertical_LastFrame) return;
+    var rotHori = p.horizontal;
+    var rotVert = p.vertical;
+    camRotHorizontal_LastFrame = p.horizontal;
+    camRotVertical_LastFrame = p.vertical;
+    viewHandler.viewPlannerHandler.updateOrbitCubeInitParams(p.horizontal, p.vertical);
+    viewHandler.divaWebPlanner.handle3DVisualizationChanged('Nav3DSetVPByVal', {
+      nav3DSetVPByVal: {
+        rotX: rotHori,
+        rotY: rotVert
+      }
+    });
+  };
+  /**
+   *
+   * @param p form 10 (max zoom) to -10 (min zoom)
+   */
+  var onZoomChange = function onZoomChange(zoom) {
+    var p = Math.round(zoom.absoluteZoom);
+    viewHandler.divaWebPlanner.handle3DVisualizationChanged('Nav3DZoom', {
+      nav3DZoom: {
+        zoomVal: p
+      }
+    });
+  };
+  if (viewHandler.uiState.isLoading) {
+    camRotHorizontal_LastFrame = undefined;
+    camRotVertical_LastFrame = undefined;
+  }
+  return /*#__PURE__*/jsx("div", {
+    className: classnames(orbitInteractionContainerClass, viewHandler.uiState.isInMobileView ? mobile : undefined),
+    children: /*#__PURE__*/jsx(OrbitControlElement, {
+      hiddenState: [isHidden, setHidden],
+      ref: function ref(_ref3) {
+        return viewHandler.productState.setOrbitCubeElement(_ref3);
+      },
+      size: viewHandler.uiState.isInMobileView ? '50px' : '80px',
+      interactionElement: (_viewHandler$productS = viewHandler.productState.planner3DImageSvgArea) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : undefined,
+      onRotationChange: onRotationChange,
+      onZoomChange: onZoomChange,
+      autoHide: AUTO_HIDE_IN_MS //Default 0
+      ,
+      initialRotation: initParams != undefined ? {
+        horizontal: initParams.rotHorizontal,
+        vertical: initParams.rotVertical
+      } : undefined,
+      zoomFactorResetDelay: 500,
+      minCssScale: 0.5,
+      maxCssScale: 1.5,
+      disableDefaultScrollBehaviour: true,
+      cubeFaceChildren: {
+        back: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.back')
+        }),
+        bottom: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.bottom')
+        }),
+        front: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.front')
+        }),
+        left: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.left')
+        }),
+        right: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.right')
+        }),
+        top: /*#__PURE__*/jsx("div", {
+          className: cubeText,
+          children: t('cube.top')
+        })
+      }
+      //interactionMoveElement={body} //default document.body
+    })
+  });
+};
+var OrbitInteractionStandard$1 = observer(OrbitInteractionStandard);
+export { OrbitInteractionStandard$1 as default };

package/build/esm/index-bd81394e.js ADDED Viewed

@@ -0,0 +1,107 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-6ae957da.js';
+import { useState, useEffect } from 'react';
+import { useTranslation, DivaUtils } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import Collapsible from 'react-collapsible';
+import { observer } from 'mobx-react-lite';
+import { jsx, jsxs } 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 '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+var wrapper = "wrapper--ib5A";
+var wcGroupedContainer = "wcGroupedContainer-PIV-1";
+var wcPaletteHeader = "wcPaletteHeader-743rE";
+var wcSizeGroupHeader = "wcSizeGroupHeader-qNjZR";
+var wcGroupHeaderTitle = "wcGroupHeaderTitle-vGDWm";
+var deltaPriceVisible = "deltaPriceVisible-yzRB0";
+var wcFoldingArrow = "wcFoldingArrow-Ta8kT";
+var wcGroupOpen = "wcGroupOpen-oAf0q";
+var wcDeltaPrice = "wcDeltaPrice-7E6Jg";
+var css_248z = ".wrapper--ib5A {\n  width: 100%;\n}\n\n.wcConfigurator-settings-Jey-L .wcGroupedContainer-PIV-1 {\n  transition: all 0.35s ease;\n  box-sizing: content-box;\n  overflow: visible;\n  display: inline-block;\n  width: 100%;\n}\n\n.wcPaletteHeader-743rE.wcSizeGroupHeader-qNjZR {\n  border-radius: 0 !important;\n  border-radius: initial !important;\n}\n\n.wcPaletteHeader-743rE.wcSizeGroupHeader-qNjZR {\n  width: 98%;\n  height: 24px;\n  padding-top: 9.6px;\n  border-bottom: 1px solid #dfdfdf;\n  position: relative;\n  display: flex;\n  z-index: 100;\n  margin-left: 1%;\n  margin-right: 1%;\n}\n.wcPaletteHeader-743rE.wcSizeGroupHeader-qNjZR:hover {\n  z-index: 200;\n}\n\n.wcGroupHeaderTitle-vGDWm {\n  font-size: 17.6px;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  -webkit-text-stroke: 0.4px;\n  width: calc(100% - 32px);\n  margin-left: 32px;\n  overflow: hidden;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  position: relative;\n}\n\n.deltaPriceVisible-yzRB0.wcGroupHeaderTitle-vGDWm {\n  width: calc(100% - 132px);\n  height: 100%;\n}\n.wcGroupHeaderTitle-vGDWm:hover {\n  z-index: 200;\n}\n\n.wcPaletteHeader-743rE .wcFoldingArrow-Ta8kT {\n  position: absolute;\n  margin: 6.4px;\n  top: 0px;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2211%22 height%3D%227%22 viewBox%3D%220 0 11 7%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M10.4375 0.688354L6.15179 5.68835L1.4375 0.688354%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;\n  background-size: contain;\n  transform: rotateZ(0deg);\n  transition: all 0.35s ease;\n  width: 20.8px;\n  height: 22.4px;\n}\n\n.wcGroupOpen-oAf0q .wcPaletteHeader-743rE .wcFoldingArrow-Ta8kT {\n  transform: rotateZ(180deg);\n}\n\n.wcDeltaPrice-7E6Jg {\n  position: absolute;\n  right: 16px;\n}\n";
+styleInject(css_248z);
+var Group = function Group(_ref) {
+  var _group$items$;
+  var group = _ref.group,
+    PaletteComponent = _ref.PaletteComponent,
+    itemPalette = _ref.itemPalette,
+    contentInnerClassName = _ref.contentInnerClassName;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var viewHandler = useViewHandler();
+  var _useState = useState(group.isFolded),
+    _useState2 = _slicedToArray(_useState, 2),
+    contentHidden = _useState2[0],
+    setContentHidden = _useState2[1];
+  var _useState3 = useState(!group.isFolded),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isOpen = _useState4[0],
+    setIsOpen = _useState4[1];
+  useEffect(function () {
+    if (!isOpen && !group.isFolded) {
+      setTimeout(function () {
+        return setIsOpen(!group.isFolded);
+      }, 400);
+    } else {
+      setIsOpen(!group.isFolded);
+    }
+    if (!contentHidden && group.isFolded) {
+      setTimeout(function () {
+        return setContentHidden(group.isFolded);
+      }, 200);
+    } else {
+      setContentHidden(group.isFolded);
+    }
+  }, [group.isFolded]);
+  var deltaPrice = (_group$items$ = group.items[0]) === null || _group$items$ === void 0 ? void 0 : _group$items$.deltaPrice;
+  var name = group.name !== 'none' ? group.name : t('configurator.other');
+  var title = name + (group.parentName && group.parentName != itemPalette.name ? ' (' + group.parentName + ')' : '');
+  return /*#__PURE__*/jsx("div", {
+    className: wrapper,
+    id: title,
+    children: /*#__PURE__*/jsx(Collapsible, {
+      className: wcGroupedContainer,
+      open: isOpen,
+      contentInnerClassName: contentInnerClassName,
+      handleTriggerClick: function handleTriggerClick() {
+        if (group.isFolded) viewHandler.settingsState.openGroup(itemPalette.id, group.key, viewHandler.paletteViewHandler.isGroupFolded(itemPalette.id));else {
+          viewHandler.settingsState.closeGroup(itemPalette.id, group.key);
+        }
+      },
+      triggerOpenedClassName: wcGroupOpen,
+      trigger: /*#__PURE__*/jsxs("div", {
+        className: classnames(wcPaletteHeader, wcSizeGroupHeader),
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(wcGroupHeaderTitle, deltaPrice !== undefined ? deltaPriceVisible : undefined),
+          children: title
+        }), deltaPrice !== undefined && /*#__PURE__*/jsx("div", {
+          className: classnames(wcDeltaPrice),
+          children: (deltaPrice >= 0 ? '+' : '-') + ' ' + DivaUtils.formatPrice(Math.abs(deltaPrice))
+        }), /*#__PURE__*/jsx("div", {
+          className: classnames(wcFoldingArrow)
+        })]
+      }),
+      easing: "ease",
+      children: !contentHidden && group.items.map(function (item, i) {
+        return /*#__PURE__*/jsx(PaletteComponent, {
+          paletteType: itemPalette.type,
+          paletteId: itemPalette.id,
+          item: item
+        }, i);
+      })
+    })
+  }, title);
+};
+var Group$1 = observer(Group);
+export { Group$1 as default };

package/build/esm/index-bf9a3d74.js ADDED Viewed

@@ -0,0 +1,53 @@
+import { u as useViewHandler } from './index-6ae957da.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-da90a5d7.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 };