@crystaldesign/diva-web-planner-react 24.12.0-beta.10 → 24.12.0-beta.17

package/build/esm/index-e3827fee.js

@@ -0,0 +1,102 @@
+import { s as styleInject, u as useViewHandler } from './index-a050eeb5.js';
+import 'react';
+import { observer } from 'mobx-react-lite';
+import ToolContainer from './index-c01dbb65.js';
+import { useDivaCore } from '@crystaldesign/diva-core';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-4ee4cad1.js';
+import './index.module-675cab09.js';
+import './index-2f5ff809.js';
+import './index-f37eb8a5.js';
+import 'classnames';
+import './index-f47a9b7a.js';
+import 'react-collapsible';
+import './index-f8d95287.js';
+import './index-ad78363c.js';
+import './index.module-5cd10497.js';
+import 'react-json-view';
+import './index-5dde4f22.js';
+import './index.module-b6161f25.js';
+import './index-54d84f57.js';
+import 'jsoneditor';
+import './index-add4ba17.js';
+import './index-9ff98b7d.js';
+import './index-25cdca54.js';
+import './index-5035caab.js';
+import './index-e8362f55.js';
+import './index.module-d5cfdd93.js';
+import './index-a930a2d8.js';
+import './index-6bf243c6.js';
+import './index-5cff4270.js';
+import './index-efe5d533.js';
+import 'react-dropdown';
+import './index.module-08967cc2.js';
+import './index-b4040150.js';
+import './index-cc257b12.js';
+import './index-ad2993e7.js';
+import './index-a143fb33.js';
+import './index-f43e0ea9.js';
+import './index-ab7c3850.js';
+import './index-48316698.js';
+import './index-8894bd14.js';
+import './index-7fad3170.js';
+import 'react-switch';
+import './CatalogProperties-31810f8d.js';
+import './ArticleProperties-40780fe8.js';
+import './OptionProperties-aafab857.js';
+import './OptionValueProperties-ce745aa6.js';
+import 'react-select';
+
+var container = "container-43rJg";
+var item = "item-JRY9h";
+var css_248z = ".container-43rJg {\n  display: flex;\n  height: 42px;\n  gap: 12px;\n  justify-content: space-around;\n  overflow: auto;\n  align-items: center;\n  background-color: #f3f3f3;\n}\n\n.item-JRY9h {\n  cursor: pointer;\n  min-width: 80px;\n  padding-left: 12px;\n  padding-right: 12px;\n  text-align: center;\n}\n";
+styleInject(css_248z);
+
+var Toolbar = function Toolbar(props) {
+  var _viewHandler$divaWebP, _viewHandler$divaWebP2;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    wwsClient = _useDivaCore.state.organization.settings.wwsClient;
+  var changeVal = function changeVal(newValue) {
+    var value = newValue === viewHandler.uiState.activeCatalogSection ? '3D/2D' : newValue;
+    localStorage.setItem('lastWindow', value);
+    viewHandler.uiState.setActiveCatalogSection(value);
+  };
+  var partlistsExist = !!Object.values((_viewHandler$divaWebP = (_viewHandler$divaWebP2 = viewHandler.divaWebPlanner.actSet()) === null || _viewHandler$divaWebP2 === void 0 ? void 0 : _viewHandler$divaWebP2.CatalogData.allCatalogArticles) !== null && _viewHandler$divaWebP !== void 0 ? _viewHandler$divaWebP : {}).find(function (a) {
+    return a.partlistArticlesRules;
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [viewHandler.uiState.activeCatalogSection != '3D/2D' && /*#__PURE__*/jsx(ToolContainer, {}), /*#__PURE__*/jsxs("div", {
+      className: container,
+      children: [partlistsExist && /*#__PURE__*/jsx("div", {
+        className: item,
+        onClick: function onClick() {
+          return changeVal('PartList');
+        },
+        children: "St\xFCckliste"
+      }), wwsClient == 'Pfister' && /*#__PURE__*/jsx("div", {
+        className: item,
+        onClick: function onClick() {
+          return changeVal('ekText');
+        },
+        children: "Ek Text"
+      })]
+    })]
+  });
+};
+var Toolbar$1 = observer(Toolbar);
+
+export { Toolbar$1 as default };

package/build/esm/index-e44f4f09.js

@@ -0,0 +1,31 @@
+import { u as useViewHandler } from './index-a050eeb5.js';
+import 'react';
+import { j as wcPlanner3DGrid } from './index.module-07f32d38.js';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'mobx-react-lite';
+
+var Planner3DGrid = function Planner3DGrid(props) {
+  var viewHandler = useViewHandler();
+  return /*#__PURE__*/jsx("div", {
+    ref: function ref(_ref) {
+      return viewHandler.productState.setPlanner3DGridElement(_ref);
+    },
+    id: "diva3dImg_3DGrid",
+    className: wcPlanner3DGrid
+  });
+};
+
+export { Planner3DGrid as default };

package/build/esm/index-e46d13dd.js

@@ -0,0 +1,37 @@
+import { s as styleInject } from './index-a050eeb5.js';
+import ProductHeader from './index-a3edb457.js';
+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';
+import 'mobx-react-lite';
+import 'classnames';
+import './index-0b274061.js';
+import '@crystaldesign/content-box';
+import './index-78df739b.js';
+import '@crystaldesign/content-item';
+import 'react-draggable';
+
+var productHeader = "productHeader-19YtG";
+var css_248z = ".productHeader-19YtG h1 {\n  font-weight: 700;\n}\n";
+styleInject(css_248z);
+
+var ProductHeaderRalph = function ProductHeaderRalph(props) {
+  return /*#__PURE__*/jsx(ProductHeader, {
+    hidePrice: true,
+    productClass: productHeader
+  });
+};
+
+export { ProductHeaderRalph as default };

package/build/esm/index-e8362f55.js

@@ -0,0 +1,177 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { u as useViewHandler } from './index-a050eeb5.js';
+import { useState } from 'react';
+import { observer } from 'mobx-react-lite';
+import { s as svgWrapper, t as table, c as column, a as selected } from './index.module-d5cfdd93.js';
+import classnames from 'classnames';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+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 _excluded = ["plannerArticles", "curBox", "isExpanded"];
+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 SVGOverview = function SVGOverview(_ref) {
+  var plannerArticles = _ref.plannerArticles,
+    curBox = _ref.curBox;
+    _ref.isExpanded;
+    var props = _objectWithoutProperties(_ref, _excluded);
+  var viewHandler = useViewHandler();
+  var _useState = useState('None'),
+    _useState2 = _slicedToArray(_useState, 2),
+    text = _useState2[0],
+    setText = _useState2[1];
+  var articlesLoaded = viewHandler.divaWebPlanner.getDivaArticles();
+  if (!articlesLoaded) return /*#__PURE__*/jsx(Fragment, {});
+  var articles = Object.values(articlesLoaded);
+  var filteredArticles = articles.filter(function (article) {
+    return article.hasCatalogPlannerArticle;
+  });
+  // _> Matche curSVG mit topSVG wenn gleich im Array dann grünes dropdown
+  // _> Pro Artikel Dropdown pro SVG mit aktuell noch allen Informationen
+
+  var curElement = plannerArticles[curBox];
+  var article = filteredArticles[curBox];
+  var svgCur = '';
+  var svgURL = '';
+  var svgObjs = [];
+  if (curElement === undefined) return /*#__PURE__*/jsx(Fragment, {});
+  if (curElement.topSvgsWithFormula) {
+    var _article$plannerData;
+    (_article$plannerData = article.plannerData) === null || _article$plannerData === void 0 || _article$plannerData.curSVG;
+    var curSVG = curElement.topSvgsWithFormula.find(function (item) {
+      var _article$plannerData2;
+      return item.SVG === ((_article$plannerData2 = article.plannerData) === null || _article$plannerData2 === void 0 ? void 0 : _article$plannerData2.curSVG);
+    });
+    if (curSVG) {
+      for (var i = 0; i < curElement.topSvgsWithFormula.length; i++) {
+        svgObjs.push(curElement.topSvgsWithFormula[i]);
+      }
+      svgURL = article.CatalogData.getCatImageURL(curSVG === null || curSVG === void 0 ? void 0 : curSVG.SVG, '');
+      svgCur = curSVG.SVG;
+      curSVG === null || curSVG === void 0 || curSVG.JsFormula;
+    }
+  }
+  if (!svgURL) {
+    svgURL = article.CatalogData.getCatImageURL(curElement.topSvg, '');
+    svgObjs.push({
+      SVG: svgURL,
+      Layer: curElement.topLayer,
+      AVC: curElement.topAVC,
+      AVO: curElement.topAVO,
+      AVU: curElement.topAVU,
+      AVN: curElement.topAVN,
+      AVS: curElement.topAVS,
+      HasAVL: curElement.topHasAVL,
+      HasAVR: curElement.topHasAVR,
+      JsFormula: ''
+    });
+  }
+  if (svgURL !== '') {
+    var getSVG = /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(topSVGUrl) {
+        var response;
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              _context.next = 2;
+              return fetch(topSVGUrl);
+            case 2:
+              response = _context.sent;
+              _context.t0 = setText;
+              _context.next = 6;
+              return response.text();
+            case 6:
+              _context.t1 = _context.sent;
+              (0, _context.t0)(_context.t1);
+            case 8:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function getSVG(_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    getSVG(svgURL);
+  } else if (text != 'None') setText('None');
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(svgWrapper),
+    children: /*#__PURE__*/jsxs("table", {
+      className: table,
+      children: [/*#__PURE__*/jsx("thead", {
+        children: /*#__PURE__*/jsxs("tr", {
+          className: column,
+          children: [/*#__PURE__*/jsx("th", {
+            children: "Nr"
+          }), /*#__PURE__*/jsx("th", {
+            children: "SVG"
+          }), /*#__PURE__*/jsx("th", {
+            children: "Layer"
+          }), /*#__PURE__*/jsx("th", {
+            children: "AVC"
+          }), /*#__PURE__*/jsx("th", {
+            children: "AVO"
+          }), /*#__PURE__*/jsx("th", {
+            children: "AVU "
+          }), /*#__PURE__*/jsx("th", {
+            children: "AVN "
+          }), /*#__PURE__*/jsx("th", {
+            children: "AVS "
+          }), /*#__PURE__*/jsx("th", {
+            children: "HasAVL "
+          }), /*#__PURE__*/jsx("th", {
+            children: "HasAVR "
+          }), /*#__PURE__*/jsx("th", {
+            children: "JSFormula "
+          })]
+        })
+      }), /*#__PURE__*/jsx("tbody", {
+        children: Object.values(svgObjs).map(function (svgObj, index) {
+          return /*#__PURE__*/jsxs("tr", {
+            className: svgObj.SVG === svgCur ? selected : undefined,
+            children: [/*#__PURE__*/jsx("th", {
+              children: index + 1
+            }), /*#__PURE__*/jsx("th", {
+              children: /*#__PURE__*/jsx("img", {
+                src: article.CatalogData.getCatImageURL(svgObj.SVG, '')
+              })
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.Layer
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.AVC
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.AVO
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.AVU
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.AVN
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.AVS
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.HasAVL
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.HasAVR
+            }), /*#__PURE__*/jsx("th", {
+              children: svgObj.JsFormula
+            })]
+          }, svgObj.JsFormula);
+        })
+      })]
+    })
+  }));
+};
+var SVGOverview$1 = observer(SVGOverview);
+
+export { SVGOverview$1 as default };

package/build/esm/index-eac69418.js

@@ -0,0 +1,127 @@
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-a050eeb5.js';
+import { useState, useEffect } from 'react';
+import Collapsible from 'react-collapsible';
+import SubTabGroupHeader from './index-50b727f6.js';
+import { S as SettingsItem } from './index-aae64c15.js';
+import { observer } from 'mobx-react-lite';
+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 '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'sift';
+import './index-d228cbf6.js';
+import './index-21d0bcc4.js';
+import './index-2149fa4b.js';
+import './index-0dc9d2a6.js';
+import './index-8209ce6b.js';
+import './index.module-b36fb7e2.js';
+import './index-7fad3170.js';
+import 'react-switch';
+import './index-85041242.js';
+import './index-84ba5a20.js';
+import 'react-dropdown';
+import './index-5199b8fb.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-28e58c06.js';
+import './index-b4040150.js';
+import './index-65496d36.js';
+import '@crystaldesign/content-box';
+import './index-4b4f00b8.js';
+import './index-105fa487.js';
+import './index-860bedf4.js';
+import './index-a976b4f5.js';
+import './index-dea5625e.js';
+import '@crystaldesign/products-component';
+import './index-8854b3b4.js';
+import './index-6f28a681.js';
+import './index-d3ef0ffa.js';
+import 'react-laag';
+import './index-0da450c3.js';
+import './index-2cf73325.js';
+import './index-7de373e0.js';
+import './index-eec882e7.js';
+import './index-3c064d3f.js';
+import './index-9ed7db0c.js';
+import './index-8430e9b3.js';
+import './index-fc40f412.js';
+import './index-03410a87.js';
+import './index-5adc15d3.js';
+import './index.module-019e2681.js';
+import './index-9587b7db.js';
+import './index-0e9013d4.js';
+import './index-0660b129.js';
+import './index-a88dbbcb.js';
+import './index-8c5dee25.js';
+import './index-9a9f7953.js';
+import './index-94f937cc.js';
+import './index.module-29ef88c5.js';
+import './index-f85e43c6.js';
+import './index-3ee168ec.js';
+
+var collapsableOuter = "collapsable-outer-udXIP";
+var css_248z = ".collapsable-outer-udXIP {\n  overflow: visible !important;\n}\n.collapsable-outer-udXIP {\n  height: auto;\n  transition: none 0s ease 0s;\n}\n";
+styleInject(css_248z);
+
+var SubTabgroup = function SubTabgroup(_ref) {
+  var _viewHandler$getViewC, _viewHandler$getViewC2;
+  var itemPalettesOfArticle = _ref.itemPalettesOfArticle;
+  var viewHandler = useViewHandler();
+  var _useState = useState(!!((_viewHandler$getViewC = viewHandler.getViewConfig()) !== null && _viewHandler$getViewC !== void 0 && _viewHandler$getViewC.selectAccessoiresWithToggle)),
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
+  var basketIds = Object.keys(itemPalettesOfArticle);
+  var _useState3 = useState('ALL'),
+    _useState4 = _slicedToArray(_useState3, 2),
+    curTab = _useState4[0],
+    setCurTab = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    tabs = _useState6[0],
+    setTabs = _useState6[1];
+  var _useState7 = useState(itemPalettesOfArticle[basketIds[0]]),
+    _useState8 = _slicedToArray(_useState7, 2),
+    itemPalettes = _useState8[0],
+    setItemPalettes = _useState8[1];
+  useEffect(function () {
+    var _itemPalettesOfArticl;
+    var actPalettes = (_itemPalettesOfArticl = itemPalettesOfArticle[curTab == 'ALL' ? basketIds[0] : curTab]) !== null && _itemPalettesOfArticl !== void 0 ? _itemPalettesOfArticl : {};
+    Object.values(actPalettes).map(function (p) {
+      return p.configAllMode = curTab == 'ALL' ? basketIds : undefined;
+    });
+    setItemPalettes(actPalettes);
+    setTabs(['ALL'].concat(_toConsumableArray(basketIds.length > 1 ? basketIds : [])));
+    if (!tabs.includes(curTab)) setCurTab(tabs[0]);
+  }, [itemPalettesOfArticle, curTab]);
+  return /*#__PURE__*/jsx(Collapsible, {
+    trigger: (_viewHandler$getViewC2 = viewHandler.getViewConfig()) !== null && _viewHandler$getViewC2 !== void 0 && _viewHandler$getViewC2.selectAccessoiresWithToggle ? /*#__PURE__*/jsx(Fragment, {}) : /*#__PURE__*/jsx(SubTabGroupHeader, {
+      tabs: tabs,
+      openState: [isOpen, setIsOpen],
+      curState: [curTab, setCurTab]
+    }),
+    contentOuterClassName: isOpen ? collapsableOuter : undefined,
+    easing: "ease",
+    open: isOpen,
+    triggerDisabled: isOpen,
+    children: Object.values(itemPalettes).map(function (item, index) {
+      return /*#__PURE__*/jsx(SettingsItem, {
+        item: item,
+        id: item.id
+      }, index);
+    })
+  });
+};
+var SubTabGroup = observer(SubTabgroup);
+
+export { SubTabGroup as default };

package/build/esm/index-ec40f17b.js

@@ -0,0 +1,32 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
+import { u as useViewHandler } from './index-a050eeb5.js';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'mobx-react-lite';
+
+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 BasketMobile = function BasketMobile(_ref) {
+  var props = Object.assign({}, (_objectDestructuringEmpty(_ref), _ref));
+  var viewHandler = useViewHandler();
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, props), {}, {
+    onClick: function onClick() {
+      return viewHandler.actionButtonState.onClickAddToBasket();
+    }
+  }));
+};
+
+export { BasketMobile as default };

package/build/esm/index-ed1b691d.js

@@ -0,0 +1,99 @@
+import { s as styleInject, u as useViewHandler } from './index-a050eeb5.js';
+import 'react';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsx, Fragment, 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/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 wcToolbarFilter = "wcToolbarFilter-Gz4PK";
+var wcPlToolIcon = "wcPlToolIcon-UBaTH";
+var wcToolbarFilterExpanded = "wcToolbarFilterExpanded-Yi0L8";
+var wcToolbarFilterMaxExpanded = "wcToolbarFilterMaxExpanded-7XK-7";
+var wcToolbarCatalogItem = "wcToolbarCatalogItem-PuT3F";
+var mobile = "mobile-Bp3bL";
+var dockL = "DockL-2XY68";
+var isActive = "is-active-Ta3Um";
+var dockLr = "DockLR-PVa10";
+var dockR = "DockR-uK2j5";
+var dockNone = "DockNone-KdE70";
+var accessoire = "Accessoire-ZN7LO";
+var css_248z = "/*DOCKFilter*/\n.wcToolbarFilter-Gz4PK {\n  margin: 0;\n  padding: 0;\n  padding: initial;\n}\n\n@media all and (max-width: 730px) and (orientation: landscape) {\n  .wcToolbarFilter-Gz4PK {\n    display: none;\n  }\n}\n\n.wcPlToolIcon-UBaTH {\n  height: 25px;\n  width: 25px;\n  background-repeat: no-repeat;\n  background-size: auto 20px;\n  display: inline-block;\n  font-size: 0;\n  text-align: center;\n  z-index: 99;\n  margin-top: 5px;\n  cursor: pointer;\n  transition: 0.35s ease;\n}\n\n.wcToolbarFilterExpanded-Yi0L8 .wcPlToolIcon-UBaTH,\n.wcToolbarFilterMaxExpanded-7XK-7 .wcPlToolIcon-UBaTH {\n  height: 30px;\n  width: 30px;\n  background-size: auto 25px;\n}\n.wcToolbarCatalogItem-PuT3F {\n  display: inline-block;\n  list-style: none outside none;\n  padding: 0 0.3em;\n  cursor: pointer;\n  height: 32px;\n}\n.mobile-Bp3bL .wcPlToolIcon-UBaTH {\n  height: 22px;\n  width: 22px;\n  background-size: auto 18px;\n}\n\n.mobile-Bp3bL .wcToolbarCatalogItem-PuT3F {\n  height: 30px;\n  padding: 0 4px;\n}\n\n.DockL-2XY68 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockL%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(45.5 45.5) rotate(180)%22%2F%3E%3Cpolygon points%3D%2235 6.5 51.13 22.63 35 38.75 35 22.63 35 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockL-2XY68.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockL%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(45.5 45.5) rotate(180)%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2235 6.5 51.13 22.63 35 38.75 35 22.63 35 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockLR-PVa10 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 57.25 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockLR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.62%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(57.75 45.5) rotate(180)%22%2F%3E%3Cpolygon points%3D%2216.13 38.75 0 22.63 16.13 6.5 16.13 22.63 16.13 38.75%22%2F%3E%3Cpolygon points%3D%2241.13 6.5 57.25 22.63 41.13 38.75 41.13 22.63 41.13 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockLR-PVa10.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 57.25 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockLR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.62%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22 transform%3D%22translate(57.75 45.5) rotate(180)%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2216.13 38.75 0 22.63 16.13 6.5 16.13 22.63 16.13 38.75%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2241.13 6.5 57.25 22.63 41.13 38.75 41.13 22.63 41.13 6.5%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockR-uK2j5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.12%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Cpolygon points%3D%2216.13 39.25 0 23.13 16.13 7 16.13 23.13 16.13 39.25%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockR-uK2j5.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 51.12 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockR%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%229.12%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Cpolygon class%3D%22cls-2%22 points%3D%2216.13 39.25 0 23.13 16.13 7 16.13 23.13 16.13 39.25%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.DockNone-KdE70 {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 45.5 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockNone%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Crect x%3D%2211.5%22 y%3D%2211%22 width%3D%2223%22 height%3D%2223%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.DockNone-KdE70.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 45.5 45.5%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23d3d3d3%3Bstroke%3A%23d3d3d3%3Bstroke-miterlimit%3A10%3Bstroke-width%3A7px%3B%7D.cls-2%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EDockNoneOrange%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_6%22 data-name%3D%22Ebene 6%22%3E%3Crect class%3D%22cls-1%22 x%3D%223.5%22 y%3D%223.5%22 width%3D%2238.5%22 height%3D%2238.5%22%2F%3E%3Crect class%3D%22cls-2%22 x%3D%2211.5%22 y%3D%2211%22 width%3D%2223%22 height%3D%2223%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.Accessoire-ZN7LO {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 43.05 43.1%22%3E%3Ctitle%3EPlus%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_3%22 data-name%3D%22Ebene 3%22%3E%3Cpath d%3D%22M24.79%2C24.79V43.1H18.18V24.79H0V18.18H18.18V0h6.61V18.18H43.05v6.61Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n.Accessoire-ZN7LO.is-active-Ta3Um {\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 43.05 43.1%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23e77031%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EAddAccessoireOrange%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_2-2%22 data-name%3D%22Ebene 2%22%3E%3Cpath class%3D%22cls-1%22 d%3D%22M24.79%2C24.79V43.1H18.18V24.79H0V18.18H18.18V0h6.61V18.18H43.05v6.61Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n";
+styleInject(css_248z);
+
+var DockFilter = function DockFilter() {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var plannerItems = viewHandler.paletteViewHandler.plannerItems;
+  if (!plannerItems.doShowFilterTypes()) return /*#__PURE__*/jsx(Fragment, {});
+  var onSelectConfigFilter = function onSelectConfigFilter(paletteId, codex, filterType) {
+    viewHandler.paletteViewHandler.onSelectFilter(paletteId, codex, filterType);
+  };
+  return /*#__PURE__*/jsxs("ul", {
+    style: {
+      "float": viewHandler.getIsInMobileView() ? 'left' : 'none'
+    },
+    className: classnames(wcToolbarFilter, viewHandler.uiState.configSettingsIsExpanded ? wcToolbarFilterExpanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? wcToolbarFilterMaxExpanded : undefined, viewHandler.getIsInMobileView() ? mobile : undefined),
+    children: [viewHandler.settingsState.plannerFilter.curFilteredTypes['DockL'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockL', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockL, viewHandler.settingsState.plannerFilter.dockFilter['DockL'] ? isActive : undefined),
+        title: t('configurator.LEFT_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockLR'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockLR', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockLr, viewHandler.settingsState.plannerFilter.dockFilter['DockLR'] ? isActive : undefined),
+        title: t('configurator.MIDDLE_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockR'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockR', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockR, viewHandler.settingsState.plannerFilter.dockFilter['DockR'] ? isActive : undefined),
+        title: t('configurator.RIGHT_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['DockNone'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'DockNone', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, dockNone, viewHandler.settingsState.plannerFilter.dockFilter['DockNone'] ? isActive : undefined),
+        title: t('configurator.SOLO_ELEMENTS')
+      })
+    }), viewHandler.settingsState.plannerFilter.curFilteredTypes['Accessoire'] && /*#__PURE__*/jsx("li", {
+      className: wcToolbarCatalogItem,
+      onClick: function onClick() {
+        return onSelectConfigFilter(1, 'Accessoire', 'DockFilter');
+      },
+      children: /*#__PURE__*/jsx("span", {
+        className: classnames(wcPlToolIcon, accessoire, viewHandler.settingsState.plannerFilter.dockFilter['Accessoire'] ? isActive : undefined),
+        title: t('configurator.ACCESSOIRE_ELEMENTS')
+      })
+    })]
+  });
+};
+var DockFilter$1 = observer(DockFilter);
+
+export { DockFilter$1 as default };