@crystaldesign/diva-web-planner-react 25.14.0-beta.9 → 25.15.0-beta.1

package/build/esm/index-ac004ef2.js

@@ -0,0 +1,167 @@
+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-1ac30cc5.js';
+import { useRef, useState, useEffect } from 'react';
+import { observer } from 'mobx-react-lite';
+import JSONEditor from 'jsoneditor';
+import { DivaUtils } 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/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';
+
+var wrapper = "wrapper-6V6Wr";
+var button = "button-VZm94";
+var infoWrapper = "infoWrapper-2WauG";
+var modifiedArticleList = "modifiedArticleList-jWfXL";
+var css_248z = ".wrapper-6V6Wr {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  /* width: 80%; */\n  height: 750px;\n  margin-left: 51px;\n  margin-right: 10px;\n  gap: 10px;\n}\n\n.button-VZm94 {\n  min-height: 45px;\n  min-width: 45px;\n  max-width: 60px;\n  width: auto;\n  margin-bottom: 20px;\n}\n.infoWrapper-2WauG {\n  display: flex;\n  flex-direction: column;\n}\n\n.modifiedArticleList-jWfXL {\n  font-size: 10px;\n}\n";
+styleInject(css_248z);
+
+var JsonEditor = function JsonEditor(_ref) {
+  var json = _ref.json;
+    _ref.plannerArticles;
+    var curBox = _ref.curBox,
+    divaArticles = _ref.divaArticles;
+  var viewHandler = useViewHandler();
+  var container = useRef(null);
+  var jsonEditor = useRef(null);
+  var _useState = useState(json !== null && json !== void 0 ? json : {}),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var _useState3 = useState(true),
+    _useState4 = _slicedToArray(_useState3, 2),
+    validJson = _useState4[0],
+    setValidJson = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    modifiedArticles = _useState6[0],
+    setModifiedArticles = _useState6[1];
+  var actDivaArticle = divaArticles[curBox];
+  var options = {
+    mode: 'code',
+    onChange: function onChange() {
+      try {
+        var current = jsonEditor.current;
+        var e = current.get();
+        var valid = current.validate();
+        setValidJson(valid);
+      } catch (_unused) {
+        setValidJson(false);
+        return;
+      }
+    }
+  };
+  useEffect(function () {
+    setValue(json);
+  });
+  useEffect(function () {
+    if (container.current) {
+      if (!jsonEditor.current) jsonEditor.current = new JSONEditor(container.current, options);
+      if (jsonEditor.current) jsonEditor.current.set(value);
+    }
+  }, [value]);
+  var onClickSave = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var current;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            current = jsonEditor.current;
+            if (!(!current.get() || Object.keys(current.get()).length === 0)) {
+              _context.next = 4;
+              break;
+            }
+            alert('Cannot save empty value');
+            return _context.abrupt("return");
+          case 4:
+            actDivaArticle.catalogArticle.modifiedJ3D = current.get();
+            actDivaArticle.resetShelfPlanner();
+            _context.next = 8;
+            return actDivaArticle.updateShelfPlannerState({});
+          case 8:
+            viewHandler.paletteViewHandler.updateCurPaletteData(false);
+            setModifiedInfo();
+            alert('Saved');
+          case 11:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function onClickSave() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var onClickExport = function onClickExport() {
+    if (!modifiedArticles || modifiedArticles.length === 0) {
+      alert('No modified Article found');
+      return;
+    }
+    for (var i = 0; i < modifiedArticles.length; i++) {
+      DivaUtils.downloadStringAsTxtFile(modifiedArticles[i].j3d, 'text/plain', modifiedArticles[i].articleCodex + '.txt');
+    }
+  };
+  function setModifiedInfo() {
+    var _viewHandler$divaWebP;
+    var articles = (_viewHandler$divaWebP = viewHandler.divaWebPlanner.getCatalogData()) === null || _viewHandler$divaWebP === void 0 ? void 0 : _viewHandler$divaWebP.allCatalogArticles;
+    var arr = [];
+    for (var key in articles) {
+      if (articles[key]['catalogArticle'].modifiedJ3D) arr.push({
+        articleCodex: key,
+        j3d: JSON.stringify(articles[key]['catalogArticle'].modifiedJ3D)
+      });
+    }
+    setModifiedArticles(arr);
+  }
+  return /*#__PURE__*/jsxs("div", {
+    className: wrapper,
+    children: [/*#__PURE__*/jsx("div", {
+      ref: container,
+      id: "jsoneditor",
+      style: {
+        width: '90%',
+        height: '100%'
+      }
+    }), /*#__PURE__*/jsxs("div", {
+      className: infoWrapper,
+      children: [/*#__PURE__*/jsx("button", {
+        className: button,
+        disabled: !validJson,
+        onClick: function onClick() {
+          return onClickSave();
+        },
+        children: "Save"
+      }), /*#__PURE__*/jsx("button", {
+        className: button,
+        onClick: function onClick() {
+          return onClickExport();
+        },
+        children: "Export modified J3D"
+      }), /*#__PURE__*/jsxs("div", {
+        children: [/*#__PURE__*/jsx("h5", {
+          children: "Modified Articles"
+        }), modifiedArticles.map(function (item, index) {
+          return /*#__PURE__*/jsx("p", {
+            className: modifiedArticleList,
+            children: item.articleCodex
+          }, index);
+        })]
+      })]
+    })]
+  });
+};
+var JsonEditor$1 = observer(JsonEditor);
+
+export { JsonEditor$1 as default };

package/build/esm/index-ad9f1a33.js

@@ -0,0 +1,46 @@
+import { s as styleInject, u as useViewHandler } from './index-1ac30cc5.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import classnames from 'classnames';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@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';
+
+var imageItem = "image-item-NA3C7";
+var sel = "sel-gUlno";
+var css_248z = ".image-item-NA3C7 {\n  width: 30px;\n  height: 30px;\n  border-radius: 50%;\n  background-position: center;\n  background-size: cover;\n  background-repeat: no-repeat;\n  border: solid #f0f0f0 var(--galleryItemBorder);\n  margin: 10px 0;\n}\n\n.sel-gUlno {\n  margin: 8px 0;\n\n  border: solid var(--secondaryColor) 4px;\n}\n";
+styleInject(css_248z);
+
+var FilterItem = function FilterItem(_ref) {
+  var _viewHandler$settings;
+  var item = _ref.item,
+    id = _ref.id;
+  var viewHandler = useViewHandler();
+  var actValue = (_viewHandler$settings = viewHandler.settingsState.itemPalettes.get(id)) === null || _viewHandler$settings === void 0 ? void 0 : _viewHandler$settings.filterValue;
+  return /*#__PURE__*/jsx("span", {
+    onClick: function onClick() {
+      return viewHandler.paletteViewHandler.onSelectFilter(id, item.text, 'RAL');
+    },
+    style: {
+      backgroundColor: item.rgb
+    },
+    className: classnames(imageItem, actValue === item.text ? sel : undefined)
+  });
+};
+var FilterItem$1 = observer(FilterItem);
+
+export { FilterItem$1 as default };

package/build/esm/index-ade587c3.js

@@ -0,0 +1,118 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { s as styleInject, u as useViewHandler } from './index-1ac30cc5.js';
+import 'react';
+import InfoIcon from './index-8633d2e3.js';
+import { useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
+import { observer } from 'mobx-react-lite';
+import SummaryOptionTree from './index-b3cebd82.js';
+import classnames from 'classnames';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var tabgroupWrapper = "tabgroup-wrapper-4aobO";
+var mobile = "mobile-WRdEu";
+var tablet = "tablet-hQxkY";
+var tabgroupTitle = "tabgroup-title-1R284";
+var optionWrapper = "option-wrapper-pmVYq";
+var optionItem = "option-item-zmiHX";
+var subItemsWrapper = "sub-items-wrapper-B8kl2";
+var imageWrapper = "image-wrapper-egqGk";
+var image = "image-jeC--";
+var imagePlaceholder = "image-placeholder-gM-z9";
+var isDefined = "is-defined-d2h6S";
+var optionContent = "option-content-j3aZy";
+var optionTitleWrapper = "option-title-wrapper-9zVs5";
+var posNrClass = "pos-nr-class-Cbb-Q";
+var big = "big-zXYUG";
+var posNrWrapper = "pos-nr-wrapper-h63sR";
+var optionTitle = "option-title-ErJ-u";
+var optionDescription = "option-description-WL9GJ";
+var optionButton = "option-button-0C2Fa";
+var priceWrapper = "price-wrapper-mlLK5";
+var css_248z = ".tabgroup-wrapper-4aobO {\n  display: flex;\n  flex-direction: column;\n  border-radius: calc(var(--globalBorderRadius) * 4);\n  padding: 8px;\n  margin-bottom: 10px;\n  color: var(--secondaryColor);\n  border: 1px solid rgb(230, 230, 230);\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY).tabgroup-wrapper-4aobO {\n  gap: 6px;\n  padding: 6px;\n  margin-bottom: 8px;\n}\n\n.tabgroup-title-1R284 {\n  font-weight: 300;\n  font-size: 14px;\n  margin-left: 6px;\n}\n\n.option-wrapper-pmVYq {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.option-item-zmiHX {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 8px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .option-item-zmiHX {\n  gap: 12px;\n  padding: 6px;\n}\n\n.sub-items-wrapper-B8kl2 {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  border: 1px solid #e5e7eb;\n  border-radius: calc(var(--globalBorderRadius) * 2);\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .sub-items-wrapper-B8kl2 {\n  gap: 8px;\n}\n\n.sub-items-wrapper-B8kl2 .sub-items-wrapper-B8kl2 {\n  padding: 8px;\n  border-radius: calc(var(--globalBorderRadius));\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .sub-items-wrapper-B8kl2 .sub-items-wrapper-B8kl2 {\n  padding: 6px;\n}\n\n.sub-items-wrapper-B8kl2 .tabgroup-wrapper-4aobO {\n  margin-bottom: 0px;\n  border: 0px solid transparent;\n  padding-top: 0px;\n}\n\n.image-wrapper-egqGk {\n  width: 48px;\n  height: 48px;\n  position: relative;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .image-wrapper-egqGk {\n  width: 40px;\n  height: 40px;\n}\n\n.image-jeC-- {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: contain;\n     object-fit: contain;\n  border-radius: var(--globalBorderRadius);\n}\n\n.image-placeholder-gM-z9 {\n  width: 100%;\n  height: 100%;\n  background-color: #f3f4f6;\n  border-radius: var(--globalBorderRadius);\n}\n\n.is-defined-d2h6S {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2212%22 height%3D%2212%22 viewBox%3D%220 0 12 12%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Ccircle cx%3D%226%22 cy%3D%226%22 r%3D%226%22 fill%3D%22%2310B981%22%2F%3E  %3Cpath d%3D%22M3.5 6L5 7.5L8.5 4%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-size: 14px;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-color: transparent;\n  width: 14px;\n  height: 14px;\n  position: absolute;\n  bottom: -5px;\n  right: -8px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .is-defined-d2h6S {\n  width: 12px;\n  height: 12px;\n  background-size: 12px;\n  bottom: -4px;\n  right: -7px;\n}\n\n.option-content-j3aZy {\n  flex: 1;\n}\n\n.option-title-wrapper-9zVs5 {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin-bottom: 6px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .option-title-wrapper-9zVs5 {\n  gap: 4px;\n  margin-bottom: 4px;\n}\n\n.pos-nr-class-Cbb-Q {\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 16px;\n  border: 1px solid var(--primaryColor);\n  color: var(--secondaryColor);\n  width: 14px;\n  height: 14px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--primaryColor);\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .pos-nr-class-Cbb-Q {\n  font-size: 8px;\n  width: 12px;\n  height: 12px;\n}\n\n.pos-nr-class-Cbb-Q.big-zXYUG {\n  width: 24px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .pos-nr-class-Cbb-Q.big-zXYUG {\n  width: 20px;\n}\n\n.pos-nr-wrapper-h63sR {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .pos-nr-class-Cbb-Q {\n  gap: 2px;\n}\n\n.option-title-ErJ-u {\n  font-weight: 300;\n  font-size: 14px;\n}\n\n.option-description-WL9GJ {\n  color: #6b7280;\n  font-size: 14px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .option-title-ErJ-u,\n.mobile-WRdEu:not(.tablet-hQxkY) .option-description-WL9GJ {\n  font-size: 12px;\n}\n\n.option-button-0C2Fa {\n  padding: 6px;\n  border-radius: 6px;\n  border: 1px solid transparent;\n  cursor: pointer;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2217%22 height%3D%2218%22 viewBox%3D%220 0 17 18%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M16.043 2.6653L14.9536 1.5645C14.0535 0.654099 12.5866 0.654099 11.6856 1.5645L1.88323 11.4709C1.82148 11.5333 1.77635 11.6101 1.7526 11.6949L0.300686 16.8317C0.249228 17.0133 0.299895 17.2077 0.431311 17.3413C0.529478 17.4405 0.660103 17.4933 0.794686 17.4933C0.842186 17.4933 0.889686 17.4869 0.935603 17.4733L6.0189 16.0053C6.10281 15.9813 6.1796 15.9357 6.24135 15.8733L16.043 5.9677C16.48 5.5269 16.7199 4.9405 16.7199 4.3165C16.7199 3.6925 16.48 3.1061 16.043 2.6653ZM5.60802 15.0453L1.54123 16.2189L2.70339 12.1101L10.5971 4.1333L13.5017 7.0685L5.60802 15.0453ZM15.317 5.2341L14.2277 6.3349L11.3231 3.3997L12.4124 2.2989C12.9127 1.7933 13.7274 1.7941 14.2285 2.2989L15.3178 3.3997C15.5609 3.6445 15.6939 3.9709 15.6939 4.3173C15.6931 4.6629 15.5593 4.9885 15.317 5.2341Z%22 fill%3D%22%236F6F6F%22%2F%3E%3C%2Fsvg%3E\");\n  background-size: 16px;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-color: transparent;\n  width: 16px;\n  height: 16px;\n  transition: border 0.2s ease-in-out;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .option-button-0C2Fa {\n  padding: 4px;\n  border-radius: 4px;\n  width: 14px;\n  height: 14px;\n}\n\n.option-button-0C2Fa:hover {\n  border: 1px solid #e5e7eb;\n}\n\n.price-wrapper-mlLK5 {\n  display: flex;\n  align-items: center;\n  font-size: 12px;\n}\n\n.mobile-WRdEu:not(.tablet-hQxkY) .price-wrapper-mlLK5 {\n  font-size: 10px;\n}\n";
+styleInject(css_248z);
+
+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 OptionItem = function OptionItem(_ref) {
+  var _option$summaryItems, _option$targetArticle;
+  var option = _ref.option;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  var subItems = Object.values((_option$summaryItems = option.summaryItems) !== null && _option$summaryItems !== void 0 ? _option$summaryItems : {});
+  return /*#__PURE__*/jsxs("div", {
+    className: subItemsWrapper,
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classnames(optionItem),
+      children: [/*#__PURE__*/jsxs("div", {
+        className: imageWrapper,
+        children: [option.image ? /*#__PURE__*/jsx("img", {
+          src: option.image,
+          alt: option.title,
+          className: image
+        }) : /*#__PURE__*/jsx("div", {
+          className: imagePlaceholder
+        }), option.isDefined && /*#__PURE__*/jsx("div", {
+          className: isDefined
+        }), (option.contentItemId || option.optionContentItemId) && /*#__PURE__*/jsx(InfoIcon, {
+          style: {
+            position: 'absolute',
+            top: -7,
+            right: -7,
+            '--infoIconSize': '14px'
+          },
+          item: _objectSpread(_objectSpread({}, option), {}, {
+            contentItemId: option.contentItemId || option.optionContentItemId
+          })
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: optionContent,
+        children: [/*#__PURE__*/jsx("div", {
+          className: optionTitleWrapper,
+          children: /*#__PURE__*/jsx("div", {
+            className: optionTitle,
+            dangerouslySetInnerHTML: {
+              __html: (option.quantity ? option.quantity + 'x ' : '') + option.title
+            }
+          })
+        }), /*#__PURE__*/jsx("div", {
+          className: optionDescription,
+          dangerouslySetInnerHTML: {
+            __html: option.description
+          }
+        }), !!option.price && !hidePrices && /*#__PURE__*/jsx("div", {
+          className: priceWrapper,
+          children: /*#__PURE__*/jsx("div", {
+            children: DivaUtils.formatPrice(option.price, viewHandler.productState.priceFormat)
+          })
+        })]
+      }), /*#__PURE__*/jsx("div", {
+        className: posNrWrapper,
+        children: !!((_option$targetArticle = option.targetArticlePosNrs) !== null && _option$targetArticle !== void 0 && _option$targetArticle.length) && !option.includesAllPosNrs && option.targetArticlePosNrs.map(function (posNr) {
+          return /*#__PURE__*/jsx("div", {
+            className: classnames(posNrClass, posNr.toString().length >= 2 && big),
+            children: posNr
+          });
+        })
+      }), /*#__PURE__*/jsx("button", {
+        className: optionButton,
+        onClick: function onClick() {
+          window.lastNavigationType = 'SUMMARY_PALETTE';
+          viewHandler.paletteViewHandler.clickedOnSummaryPalette(option);
+        }
+      })]
+    }), !!subItems.length && subItems.map(function (item, index) {
+      return /*#__PURE__*/jsx(SummaryOptionTree, {
+        item: item
+      }, index);
+    })]
+  });
+};
+var OptionItem$1 = observer(OptionItem);
+
+var index = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  'default': OptionItem$1
+});
+
+export { OptionItem$1 as O, tablet as a, tabgroupTitle as b, index as i, mobile as m, optionWrapper as o, tabgroupWrapper as t };

package/build/esm/index-afd04570.js

@@ -0,0 +1,62 @@
+import { s as styleInject, u as useViewHandler } from './index-1ac30cc5.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+
+var wcConfiguratorAiRoom = "wc-configurator-ai-room-BITO0";
+var aiRoomImage = "ai-room-image-seKys";
+var aiWarningBadge = "ai-warning-badge-VRwxc";
+var css_248z = ".wc-configurator-ai-room-BITO0 {\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  z-index: 990;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.ai-room-image-seKys {\n  max-width: 100%;\n  max-height: 100%;\n  width: auto;\n  height: auto;\n  -o-object-fit: contain;\n     object-fit: contain;\n}\n\n.ai-warning-badge-VRwxc {\n  position: absolute;\n  bottom: 16px;\n  right: 16px;\n  padding: 6px 12px;\n  background-color: rgba(0, 0, 0, 0.4);\n  color: rgba(255, 255, 255, 0.9);\n  font-size: 12px;\n  border-radius: 4px;\n  pointer-events: none;\n  -webkit-backdrop-filter: blur(4px);\n          backdrop-filter: blur(4px);\n  font-weight: 500;\n}\n\n.mobile .ai-warning-badge-VRwxc {\n  font-size: 11px;\n}\n";
+styleInject(css_248z);
+
+var PlannerAIRoom = function PlannerAIRoom(props) {
+  var viewHandler = useViewHandler();
+  var handleClick = function handleClick() {
+    // Clear the AI display and restore previous view
+    viewHandler.aiState.clearAiDisplayImage();
+  };
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsx("div", {
+    className: wcConfiguratorAiRoom,
+    id: "ai-room-container",
+    style: {
+      visibility: viewHandler.productState.doShowAIRoom ? 'visible' : 'hidden',
+      cursor: viewHandler.productState.doShowAIRoom ? 'pointer' : 'default',
+      pointerEvents: viewHandler.productState.doShowAIRoom ? 'auto' : 'none'
+    },
+    onClick: handleClick,
+    children: viewHandler.aiState.aiDisplayImageSrc && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx("img", {
+        className: aiRoomImage,
+        id: "aiRoomImg",
+        draggable: "false",
+        src: viewHandler.aiState.aiDisplayImageSrc,
+        alt: "AI Generated Room"
+      }), /*#__PURE__*/jsx("div", {
+        className: aiWarningBadge,
+        children: t('configurator.roomRendering.aiGenerated')
+      })]
+    })
+  });
+};
+var PlannerAIRoom$1 = observer(PlannerAIRoom);
+
+export { PlannerAIRoom$1 as default };

package/build/esm/index-b06727fe.js

@@ -0,0 +1,70 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { u as useViewHandler } from './index-1ac30cc5.js';
+import 'react';
+import Toggle from './index-0b0f510d.js';
+import { DivaUtils } from '@crystaldesign/diva-core';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import 'react-dynamic-multi-render';
+import 'mobx-react-lite';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+
+var SummaryVariantButton = function SummaryVariantButton(_ref) {
+  var _variantPalette$1$gro;
+  _ref.item;
+  var viewHandler = useViewHandler();
+  var variantPalette = viewHandler.settingsState.itemPaletteArr.find(function (item) {
+    return item[1].type === 'VARIANTS' && item[1].visible;
+  });
+  if (!variantPalette) return /*#__PURE__*/jsx(Fragment, {});
+  var variants = (_variantPalette$1$gro = variantPalette[1].groups) === null || _variantPalette$1$gro === void 0 || (_variantPalette$1$gro = _variantPalette$1$gro[0]) === null || _variantPalette$1$gro === void 0 ? void 0 : _variantPalette$1$gro.items;
+  if (!(variants !== null && variants !== void 0 && variants.length)) return /*#__PURE__*/jsx(Fragment, {});
+  var copyTableToClipboard = function copyTableToClipboard() {
+    var html = '<h3>' + viewHandler.productState.webConifguratorTitle + ' - ' + Object.values(viewHandler.settingsState.articleInfos).map(function (article) {
+      return article.name;
+    }).join(', ') + '</h3>' + '<table>' + variants.map(function (variant) {
+      if (variant.index === undefined) return '';
+      return '<tr>' + '<td>' + 'index: ' + variant.index + '</td>' + variant.variantValues.map(function (values) {
+        return (values.optionValueImage ? '<td>' + '<img src="' + values.optionValueImage + '"/>' + '</td>' : '') +
+        //::::
+        '<td>' + (values.optionName + ' (' + values.opt.substring(3) + '):') + '<br/>' + (values.optionValueName + ' (' + values.opv.substring(3) + ')') + '</td>';
+      }).join('') + '<td>' + DivaUtils.formatPrice(variant.price) + '</td>' + '</tr>';
+    }).join('') + '</table>';
+    var blob = new Blob([html], {
+      type: 'text/html'
+    });
+    navigator.clipboard.write([new ClipboardItem(_defineProperty({}, blob.type, blob))]);
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("button", {
+      onClick: copyTableToClipboard,
+      children: "als Tabelle kopieren"
+    }), /*#__PURE__*/jsx(Toggle, {
+      height: 32,
+      handleDiameter: 22,
+      width: 60,
+      onChange: function onChange() {
+        variants[0].onToggle(true);
+        viewHandler.paletteViewHandler.updateCurPaletteData(true);
+      },
+      state: !variants.find(function (variant) {
+        return variant.disabled;
+      })
+    })]
+  });
+};
+
+export { SummaryVariantButton as default };