@crystaldesign/diva-web-planner-react 24.12.1 → 24.12.2

package/build/esm/index-6354667a.js

@@ -1,148 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-945074f1.js';
-import 'react';
-import { w as wholeWrapper, n as notExpanded } from './index.module-94a16855.js';
-import TabGroups from './index-97b5d76e.js';
-import TabGroupOptions from './index-ffd95766.js';
-import { observer } from 'mobx-react-lite';
-import ProduktDetails from './index-ce994a26.js';
-import Collapsible from 'react-collapsible';
-import Price from './index-985b34d0.js';
-import classnames from 'classnames';
-import JsonViewer from './index-26fd5353.js';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/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 './index.module-03df1a8f.js';
-import 'react-json-view';
-
-var menuPoint = "menu-point-Bz5zM";
-var collapsibleHeader = "collapsibleHeader-lzT9Y";
-var tabGroupWrapper = "tab-group-wrapper-mSLB-";
-var css_248z = ".menu-point-Bz5zM {\r\n  font-size: 22px;\r\n  padding: 0px 0px;\r\n  padding: 10px 0;\r\n  background-color: var(--primaryColor);\r\n  border-bottom: 1px solid;\r\n  width: 100%;\r\n  text-align: center;\r\n  margin-left: 0px;\r\n  color: white;\r\n  font-weight: 600;\r\n}\r\n.collapsibleHeader-lzT9Y {\r\n  font-family: var(--diva-typography-font-family);\r\n  font-weight: 100;\r\n  text-align: center;\r\n  background-color: #bbbbbb;\r\n  color: black;\r\n  border-radius: 5px;\r\n  margin: 5% 1% 1% 1%;\r\n  transition: background-color 0.3s;\r\n  padding: 1% 0%;\r\n  cursor: pointer;\r\n}\r\n.collapsibleHeader-lzT9Y:hover {\r\n  background-color: var(--primaryColor);\r\n  color: white;\r\n}\r\n.tab-group-wrapper-mSLB- {\r\n  width: 90%;\r\n  margin-left: 4%;\r\n  background-color: white;\r\n}\r\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 OptionTree = function OptionTree(_ref) {
-  var _articles$viewHandler, _hiddenOptions$tabGro, _articles$Object$keys, _articles$Object$keys2;
-  var props = Object.assign({}, (_objectDestructuringEmpty(_ref), _ref));
-  var viewHandler = useViewHandler();
-  var configTree = viewHandler.tabGroupState.allTabGroups;
-  var articles = viewHandler.divaWebPlanner.getDivaArticles();
-  if (!articles) return /*#__PURE__*/jsx(Fragment, {});
-  var hiddenOptions = viewHandler.divaWebPlanner.getHiddenOptions();
-  var article = (_articles$viewHandler = articles[viewHandler.settingsState.getSelectedBasketIds[0]]) !== null && _articles$viewHandler !== void 0 ? _articles$viewHandler : articles[Object.keys(articles)[0]];
-  var tree = Object.values(configTree);
-  var hiddenTree = Object.values((_hiddenOptions$tabGro = hiddenOptions === null || hiddenOptions === void 0 ? void 0 : hiddenOptions.tabGroups) !== null && _hiddenOptions$tabGro !== void 0 ? _hiddenOptions$tabGro : {});
-  var canClick = false;
-  tree = tree.filter(function (item) {
-    return item.type == 'OPTION';
-  });
-  var CollapsibleProps = {
-    open: true,
-    easing: 'ease-in',
-    transitionTime: 200
-  };
-  if (!article) {
-    canClick = true;
-  }
-  var mat3D = (_articles$Object$keys = articles[Object.keys(articles)[0]]) === null || _articles$Object$keys === void 0 || (_articles$Object$keys2 = _articles$Object$keys.getPlannerConfigData) === null || _articles$Object$keys2 === void 0 ? void 0 : _articles$Object$keys2.call(_articles$Object$keys, {}).config;
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
-    className: classnames(wholeWrapper, notExpanded, props.className),
-    children: [/*#__PURE__*/jsx("a", {
-      className: menuPoint,
-      children: "Options \xDCbersicht"
-    }), /*#__PURE__*/jsx(Collapsible, _objectSpread(_objectSpread({
-      trigger: /*#__PURE__*/jsx("div", {
-        className: collapsibleHeader,
-        children: "Produktdetails"
-      })
-    }, CollapsibleProps), {}, {
-      triggerDisabled: canClick,
-      children: !canClick && /*#__PURE__*/jsx(ProduktDetails, {})
-    })), /*#__PURE__*/jsx(Collapsible, _objectSpread(_objectSpread({
-      trigger: /*#__PURE__*/jsx("div", {
-        className: collapsibleHeader,
-        children: "Preise"
-      })
-    }, CollapsibleProps), {}, {
-      triggerDisabled: canClick,
-      children: /*#__PURE__*/jsx(Price, {})
-    })), /*#__PURE__*/jsx(Collapsible, _objectSpread(_objectSpread({
-      trigger: /*#__PURE__*/jsx("div", {
-        className: collapsibleHeader,
-        children: "Optionsbaum"
-      })
-    }, CollapsibleProps), {}, {
-      triggerDisabled: canClick,
-      children: /*#__PURE__*/jsx("div", {
-        className: tabGroupWrapper,
-        children: tree.map(function (tabGroup) {
-          return /*#__PURE__*/jsxs("div", {
-            children: [/*#__PURE__*/jsx(TabGroups, {
-              tabGroup: tabGroup
-            }), /*#__PURE__*/jsx("div", {
-              children: Object.values(tabGroup.options).map(function (options) {
-                return /*#__PURE__*/jsx(TabGroupOptions, {
-                  tabGroupOption: options,
-                  basketId: article.basketId
-                }, options.codex);
-              })
-            })]
-          }, tabGroup.key);
-        })
-      })
-    })), /*#__PURE__*/jsx(Collapsible, _objectSpread(_objectSpread({
-      trigger: /*#__PURE__*/jsx("div", {
-        className: collapsibleHeader,
-        children: "Versteckte Optionen"
-      })
-    }, CollapsibleProps), {}, {
-      triggerDisabled: canClick,
-      children: /*#__PURE__*/jsx("div", {
-        className: tabGroupWrapper,
-        children: hiddenTree.map(function (tabGroup) {
-          return /*#__PURE__*/jsxs("div", {
-            children: [/*#__PURE__*/jsx(TabGroups, {
-              tabGroup: tabGroup
-            }), /*#__PURE__*/jsx("div", {
-              children: Object.values(tabGroup.options).map(function (options) {
-                return /*#__PURE__*/jsx(TabGroupOptions, {
-                  tabGroupOption: options,
-                  basketId: article.basketId
-                }, options.codex);
-              })
-            })]
-          }, tabGroup.key);
-        })
-      })
-    })), /*#__PURE__*/jsx(Collapsible, _objectSpread(_objectSpread({
-      trigger: /*#__PURE__*/jsx("div", {
-        className: collapsibleHeader,
-        children: "3D MAT"
-      })
-    }, CollapsibleProps), {}, {
-      triggerDisabled: canClick,
-      children: mat3D && /*#__PURE__*/jsx(JsonViewer, {
-        isExpanded: true,
-        collapsed: 5,
-        json: mat3D
-      })
-    }))]
-  }));
-};
-var OptionTree$1 = observer(OptionTree);
-
-export { OptionTree$1 as default };

package/build/esm/index-6362a92e.js

@@ -1,154 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-945074f1.js';
-import classnames from 'classnames';
-import DockFilter from './index-6d4449eb.js';
-import RALFilter from './index-7dbf560b.js';
-import { observer } from 'mobx-react-lite';
-import 'react';
-import { useDivaCore, useTranslation } from '@crystaldesign/diva-core';
-import Searchbar from './index-972a9fb1.js';
-import ToggleHeader from './index-7345e4e6.js';
-import NumberInput from './index-7d506eed.js';
-import InfoButton from './index-7447a73f.js';
-import PDFButton from './index-bdb5faba.js';
-import SummaryVariantButton from './index-1f4d58c4.js';
-import SelectedOpv from './index-0ed992e6.js';
-import InfoIcon from './index-55f945c0.js';
-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';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-abcc0f82.js';
-import 'react-dropdown';
-import './index-b34188dc.js';
-import './index-63cce023.js';
-import '@crystaldesign/content-box';
-import './index-2f1a0e04.js';
-import './index-caa33034.js';
-import 'react-switch';
-import './index-0953e946.js';
-import 'react-laag';
-import './index-2b309493.js';
-import './index-e4dd8413.js';
-
-var headerWrapper = "header-wrapper-qVEmI";
-var wcConfiguratorSettingsHeaderTitle = "wcConfigurator-settings-header-title--CcUK";
-var wcConfiguratorSettingsHeaderPrice = "wcConfigurator-settings-header-price-UmViW";
-var scroller = "scroller-jdhnI";
-var wcConfigItemHeader = "wcConfigItem-Header-JEANn";
-var minExpanded = "min-expanded-kEE9N";
-var landscape = "landscape-DHu2r";
-var portrait = "portrait-8Z7gh";
-var quantity = "quantity-GKJLF";
-var iconsContainer = "icons-container-DbfdO";
-var css_248z = ".wcConfigurator-settings-header--UZPU {\r\n  height: 100%;\r\n  position: relative;\r\n  width: 100%;\r\n}\r\n\r\n.header-wrapper-qVEmI {\r\n  display: flex;\r\n  flex-direction: row;\r\n  flex-wrap: wrap;\r\n  justify-content: space-between;\r\n}\r\n\r\n.wcConfigurator-settings-header-title--CcUK {\r\n  width: auto;\r\n  font-weight: 600;\r\n  font-size: 20px;\r\n  line-height: 24px;\r\n  color: var(--secondaryColor);\r\n  margin-top: 10px;\r\n  float: left;\r\n  user-select: none;\r\n  -moz-user-select: none;\r\n  -webkit-user-drag: none;\r\n  -webkit-user-select: none;\r\n  -ms-user-select: none;\r\n}\r\n\r\n.wcConfigurator-settings-header-price-UmViW {\r\n  width: auto;\r\n  font-weight: 600;\r\n  font-size: 20px;\r\n  line-height: 24px;\r\n  color: var(--secondaryColor);\r\n  margin-top: 10px;\r\n  float: right;\r\n}\r\n\r\n.scroller-jdhnI .wcConfigurator-settings-header-title--CcUK {\r\n  max-width: calc(100% - 51.2px);\r\n  margin: 8px 0px;\r\n}\r\n\r\n.scroller-jdhnI .wcConfigurator-settings-header-title--CcUK.wcFilterIsVisible-S9QKu {\r\n  max-width: calc(50% - 19.2px);\r\n}\r\n\r\n.wcConfigurator-settings-header-Filters-Container-hi62D {\r\n  width: 100%;\r\n  float: left;\r\n}\r\n.wcConfigItem-Header-JEANn {\r\n  border-radius: 0 !important;\r\n  border-radius: initial !important;\r\n}\r\n.wcConfigItem-Header-JEANn {\r\n  /* width: calc(100% - 32px); */\r\n  margin-top: 8px;\r\n  margin-right: 8px;\r\n  height: -moz-fit-content;\r\n  height: fit-content;\r\n  min-height: 40px;\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n.min-expanded-kEE9N.wcConfigItem-Header-JEANn {\r\n  overflow: hidden;\r\n}\r\n\r\n:not(.scroller-jdhnI).wcConfigItem-Header-JEANn {\r\n  margin-left: var(--settingsScrollerPaddingLeft);\r\n  margin-right: var(--settingsScrollerPaddingRight);\r\n}\r\n\r\n.landscape-DHu2r.wcConfigItem-Header-JEANn,\r\n.portrait-8Z7gh.wcConfigItem-Header-JEANn {\r\n  min-height: 40px;\r\n}\r\n\r\n.landscape-DHu2r.scroller-jdhnI header,\r\n.portrait-8Z7gh.scroller-jdhnI header {\r\n  min-height: 40px;\r\n}\r\n\r\n.quantity-GKJLF {\r\n  max-width: 200px;\r\n  float: left;\r\n  padding-top: 12px;\r\n  padding-left: 20%;\r\n}\r\n\r\n.icons-container-DbfdO {\r\n  display: flex;\r\n  align-items: center;\r\n  float: right;\r\n  position: relative;\r\n  margin-top: 5px;\r\n  flex-grow: 2;\r\n  justify-content: flex-end;\r\n  max-width: 100%;\r\n}\r\n";
-styleInject(css_248z);
-
-var SettingsItemHeader = function SettingsItemHeader(_ref) {
-  var _viewHandler$getViewC, _item$selectedElement, _item$selectedElement2, _item$selectedElement3;
-  var isSettingsHeader = _ref.isSettingsHeader,
-    specialElement1 = _ref.specialElement1,
-    specialElement2 = _ref.specialElement2,
-    item = _ref.item,
-    isInScroller = _ref.isInScroller,
-    _ref$titleClass = _ref.titleClass,
-    titleClass = _ref$titleClass === void 0 ? wcConfiguratorSettingsHeaderTitle : _ref$titleClass,
-    _ref$containerClass = _ref.containerClass,
-    containerClass = _ref$containerClass === void 0 ? wcConfigItemHeader : _ref$containerClass;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    hidePrices = _useDivaCore.state.hidePrices;
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var FilterTypeComponentMap = {
-    DockFilter: !viewHandler.settingsState.plannerReplaceMode ? DockFilter : function () {
-      return /*#__PURE__*/jsx(Fragment, {});
-    },
-    RAL: !viewHandler.uiState.ViewConfig.hideRalColorFilter ? RALFilter : function () {
-      return /*#__PURE__*/jsx(Fragment, {});
-    },
-    None: function None() {
-      return /*#__PURE__*/jsx(Fragment, {});
-    }
-  };
-  var PaletteComponent = FilterTypeComponentMap[item.filterComponent ? item.filterComponent : 'None'];
-  var doShowSearchbar = item.searchVisible && !isSettingsHeader && !viewHandler.uiState.ViewConfig.hideSearchBar && !item.isRenderedNotInSettingPalette;
-  var doShowFilter = item.filterVisible && !isSettingsHeader && item.filterComponent;
-  var title = isSettingsHeader || item.type == 'TOGGLE' ? t('configurator.' + viewHandler.settingsState.paletteHeaderStepName, viewHandler.settingsState.paletteHeaderStepName) : t('configurator.' + item.name, item.name);
-  if (item.isMultiselect) {
-    title = title + ' (' + t('configurator.isMultiselect') + ')';
-  }
-  if ((_viewHandler$getViewC = viewHandler.getViewConfig()) !== null && _viewHandler$getViewC !== void 0 && _viewHandler$getViewC.showOptionCodexInOptionHeader) title = title + (item.optionCodex ? ' (' + item.optionCodex + ')' : '');
-  return /*#__PURE__*/jsx("div", {
-    className: classnames(containerClass, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.configSettingsIsMinExpanded ? minExpanded : undefined, isInScroller ? scroller : undefined),
-    children: /*#__PURE__*/jsxs("div", {
-      onClick: function onClick(e) {
-        return e.stopPropagation();
-      },
-      className: headerWrapper,
-      children: [/*#__PURE__*/jsxs("div", {
-        className: titleClass,
-        children: [/*#__PURE__*/jsx("span", {
-          "data-test-id": "settingsItemHeaderTitle",
-          children: title
-        }), !isSettingsHeader && item.measureUnit && /*#__PURE__*/jsx(NumberInput, {
-          item: item
-        })]
-      }), item.quantity !== undefined && !isSettingsHeader && /*#__PURE__*/jsxs("div", {
-        className: classnames(quantity),
-        children: [" ", t('configurator.quantity', 'Anzahl') + ': ' + item.quantity, "x"]
-      }), !hidePrices && !isSettingsHeader && item.price !== undefined && /*#__PURE__*/jsx("div", {
-        className: wcConfiguratorSettingsHeaderPrice,
-        children: item.price
-      }), /*#__PURE__*/jsxs("div", {
-        className: iconsContainer,
-        children: [specialElement1, item.type == 'TOGGLE_HEADER' && /*#__PURE__*/jsx(ToggleHeader, {
-          item: item
-        }), doShowSearchbar && /*#__PURE__*/jsx(Searchbar, {
-          isInScroller: isInScroller,
-          item: item,
-          doShowFilter: !!doShowFilter
-        }, item.configStepKey), doShowFilter && /*#__PURE__*/jsx(PaletteComponent, {
-          id: item.id
-        }), /*#__PURE__*/jsx(SummaryVariantButton, {
-          item: item
-        }), !isSettingsHeader && (item === null || item === void 0 || (_item$selectedElement = item.selectedElements) === null || _item$selectedElement === void 0 || (_item$selectedElement = _item$selectedElement[0]) === null || _item$selectedElement === void 0 ? void 0 : _item$selectedElement.pdfUrl) && /*#__PURE__*/jsx(PDFButton, {
-          pdfUrl: item.selectedElements[0].pdfUrl
-        }), !isSettingsHeader && /*#__PURE__*/jsx(Fragment, {
-          children: (_item$selectedElement2 = item.selectedElements) !== null && _item$selectedElement2 !== void 0 && (_item$selectedElement2 = _item$selectedElement2[0]) !== null && _item$selectedElement2 !== void 0 && _item$selectedElement2.url ? /*#__PURE__*/jsx(InfoButton, {
-            id: item.id,
-            selectedElement: item.selectedElements[0],
-            openUrl: true
-          }) : item.optionContentItemId ? /*#__PURE__*/jsx(InfoIcon, {
-            item: {
-              contentItemId: item.optionContentItemId,
-              codex: item.configStepKey
-            },
-            style: {
-              bottom: 'calc(50% - 10px)'
-            },
-            size: 24
-          }) : !isSettingsHeader && viewHandler.uiState.isInMobileView && (item === null || item === void 0 || (_item$selectedElement3 = item.selectedElements) === null || _item$selectedElement3 === void 0 ? void 0 : _item$selectedElement3.length) && viewHandler.getViewConfig().infoButton && /*#__PURE__*/jsx(InfoButton, {
-            id: item.id,
-            selectedElement: item.selectedElements[0]
-          })
-        }), specialElement2]
-      }), item.selectedElements && item.isMultiselect && /*#__PURE__*/jsx(SelectedOpv, {
-        item: item,
-        selectedElements: item.selectedElements
-      })]
-    })
-  });
-};
-var SettingsItemHeader$1 = observer(SettingsItemHeader);
-
-export { SettingsItemHeader$1 as default };

package/build/esm/index-63bb26d8.js

@@ -1,82 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-945074f1.js';
-import classnames from 'classnames';
-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/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 wcConfiguratorProductFooter = "wcConfigurator-product-footer-ygF4L";
-var portrait = "portrait-FCw3Q";
-var settingsHidden = "settings-hidden-PBWln";
-var landscape = "landscape-KhTSA";
-var expanded = "expanded-pQR-c";
-var wcButton = "wcButton-s5DtR";
-var sel = "sel-1Qm3v";
-var wcViewAs = "wc_ViewAs-y1Kh8";
-var css_248z = "/* footer */\r\n\r\n.wcConfigurator-product-footer-ygF4L {\r\n  text-align: center;\r\n  z-index: 350;\r\n}\r\n\r\n.wcConfigurator-product-footer-ygF4L {\r\n  position: absolute;\r\n  bottom: 0px;\r\n  left: 50%;\r\n  transform: translate(-50%, 0);\r\n}\r\n\r\n.portrait-FCw3Q.wcConfigurator-product-footer-ygF4L {\r\n  display: none;\r\n}\r\n\r\n.portrait-FCw3Q.settings-hidden-PBWln.wcConfigurator-product-footer-ygF4L {\r\n  position: absolute;\r\n  display: block;\r\n  height: 40px;\r\n}\r\n\r\n.portrait-FCw3Q.settings-hidden-PBWln.wcConfigurator-product-footer-ygF4L {\r\n  bottom: 0px;\r\n}\r\n\r\n.landscape-KhTSA.wcConfigurator-product-footer-ygF4L {\r\n  display: none;\r\n}\r\n\r\n.landscape-KhTSA.settings-hidden-PBWln.wcConfigurator-product-footer-ygF4L {\r\n  position: absolute;\r\n  display: block;\r\n  bottom: 0;\r\n  height: 40px;\r\n}\r\n\r\n.expanded-pQR-c.wcConfigurator-product-footer-ygF4L {\r\n  left: 20%;\r\n  transform: translate(-40%, 0);\r\n}\r\n\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR.sel-1Qm3v,\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR.sel-1Qm3v:hover {\r\n  background: var(--secondaryColor);\r\n  color: white;\r\n}\r\n\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR:active,\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR.sel-1Qm3v:active {\r\n  background: #616161;\r\n  color: white;\r\n}\r\n\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR {\r\n  background: white;\r\n  border: 1px solid var(--secondaryColor);\r\n\r\n  box-sizing: border-box;\r\n  -webkit-text-stroke: 0.6px;\r\n  min-width: 160px;\r\n  width: auto;\r\n  height: 38.4px;\r\n  line-height: 35.8px;\r\n  color: var(--secondaryColor);\r\n  border-right: 0px;\r\n  border-radius: 0px 0px 0px 0px;\r\n}\r\n.wcConfigurator-product-footer-ygF4L .wcButton-s5DtR:hover {\r\n  color: var(--secondaryColor);\r\n  background: white;\r\n  box-shadow: var(--boxShadowHover);\r\n}\r\n\r\n.wc_ViewAs-y1Kh8 .wcButton-s5DtR:last-child {\r\n  border-top-right-radius: var(--globalBorderRadius);\r\n  border-bottom-right-radius: var(--globalBorderRadius);\r\n  border-right: 1px solid var(--secondaryColor);\r\n}\r\n\r\n.wc_ViewAs-y1Kh8 .wcButton-s5DtR:first-child {\r\n  border-top-left-radius: var(--globalBorderRadius);\r\n  border-bottom-left-radius: var(--globalBorderRadius);\r\n}\r\n\r\n/* ViewAs  */\r\n.wc_ViewAs-y1Kh8 {\r\n  text-align: center;\r\n  z-index: 10;\r\n  margin: 0;\r\n  padding: 0;\r\n  border-width: 0;\r\n  list-style: none;\r\n  white-space: nowrap;\r\n  display: inline-flex;\r\n  flex-direction: row;\r\n  vertical-align: middle;\r\n  position: relative;\r\n  flex-wrap: nowrap;\r\n}\r\n\r\n.wc_ViewAs-y1Kh8 li {\r\n  display: block;\r\n  float: left;\r\n}\r\n";
-styleInject(css_248z);
-
-var ProductFooter = function ProductFooter(props) {
-  var _viewHandler$divaWebP, _viewHandler$tabGroup;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var renderings = (_viewHandler$divaWebP = viewHandler.divaWebPlanner.getAlternateRenderingsForSummary()) !== null && _viewHandler$divaWebP !== void 0 ? _viewHandler$divaWebP : [];
-  return /*#__PURE__*/jsx("div", {
-    className: classnames(wcConfiguratorProductFooter, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.configSettingsIsHidden ? settingsHidden : undefined, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined),
-    children: /*#__PURE__*/jsxs("ul", {
-      className: wcViewAs,
-      children: [viewHandler.productState.allow3DComb && /*#__PURE__*/jsx("li", {
-        className: classnames(wcButton, viewHandler.productState.doShow3DComb ? sel : undefined),
-        onClick: function onClick() {
-          return viewHandler.productState.onChangePlannerView('3DCOMB');
-        },
-        children: t('configurator.Foto')
-      }), viewHandler.productState.allowRendering && /*#__PURE__*/jsxs(Fragment, {
-        children: [/*#__PURE__*/jsx("li", {
-          className: classnames(wcButton, viewHandler.productState.doShowRenderImage && viewHandler.productState.curAlternateRendering === undefined ? sel : undefined),
-          onClick: function onClick() {
-            return viewHandler.productState.onChangePlannerView('3D');
-          },
-          children: t('configurator.Foto')
-        }), ((_viewHandler$tabGroup = viewHandler.tabGroupState.curTabGroup) === null || _viewHandler$tabGroup === void 0 ? void 0 : _viewHandler$tabGroup.type) == 'SUMMARY' && renderings.map(function (rendering) {
-          var _viewHandler$productS;
-          return /*#__PURE__*/jsx("li", {
-            className: classnames(wcButton, viewHandler.productState.doShowRenderImage && ((_viewHandler$productS = viewHandler.productState.curAlternateRendering) === null || _viewHandler$productS === void 0 ? void 0 : _viewHandler$productS.imageCodex) === rendering.imageCodex ? sel : undefined),
-            onClick: function onClick() {
-              return viewHandler.productState.onChangePlannerView('3D', rendering);
-            },
-            children: rendering.title
-          });
-        })]
-      }), viewHandler.productState.allowGrid && /*#__PURE__*/jsx("li", {
-        className: classnames(wcButton, viewHandler.productState.doShowGrid ? sel : undefined),
-        onClick: function onClick() {
-          return viewHandler.productState.onChangePlannerView('2D');
-        },
-        children: t('configurator.Grundriss')
-      }), viewHandler.productState.allowRTV && /*#__PURE__*/jsx("li", {
-        className: classnames(wcButton, viewHandler.productState.doShowRTV ? sel : undefined),
-        onClick: function onClick() {
-          return viewHandler.productState.onChangePlannerView('RTV');
-        },
-        children: t('configurator.RTV')
-      })]
-    })
-  });
-};
-var index = observer(ProductFooter);
-
-export { index as default };

package/build/esm/index-63c5453a.js

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

package/build/esm/index-63cce023.js

@@ -1,86 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-945074f1.js';
-import 'react';
-import { ContentBoxComponent } from '@crystaldesign/content-box';
-import { observer } from 'mobx-react-lite';
-import FilterItem from './index-2f1a0e04.js';
-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/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 'classnames';
-
-var colorFilterIcon = "data:image/jpeg;base64,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";
-
-var container = "container-UEbzL";
-var colorFilter = "colorFilter-CK-4p";
-var deselectColor = "deselectColor-vefuo";
-var css_248z = ".container-UEbzL {\r\n  position: relative;\r\n}\r\n\r\n.colorFilter-CK-4p {\r\n  border-radius: 50%;\r\n  border: solid 2px var(--secondaryColor);\r\n  width: 26px;\r\n  height: 26px;\r\n  cursor: pointer;\r\n}\r\n\r\n.deselectColor-vefuo {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  cursor: pointer;\r\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%226%22 height%3D%226%22 viewBox%3D%220 0 6 6%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0D%3Cpath d%3D%22M5 1L3 3M3 3L5 5M3 3L1 5M3 3L1 1%22 stroke%3D%22white%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%0D%3C%2Fsvg%3E\");\r\n  background-color: var(--secondaryColor);\r\n  border-radius: 50%;\r\n  background-repeat: no-repeat;\r\n  background-position: center center;\r\n  background-size: 70%;\r\n  width: 12px;\r\n  height: 12px;\r\n}\r\n";
-styleInject(css_248z);
-
-var SlideFilter = function SlideFilter(_ref) {
-  var _viewHandler$settings;
-  var visibleColorItems = _ref.visibleColorItems,
-    id = _ref.id,
-    deleteCurValue = _ref.deleteCurValue;
-  var viewHandler = useViewHandler();
-  var contents = visibleColorItems.map(function (item) {
-    return {
-      swiperSlideStyle: {
-        backgroundColor: 'transparent',
-        width: 60
-      },
-      content: /*#__PURE__*/jsx(FilterItem, {
-        id: id,
-        item: item
-      })
-    };
-  });
-  var jsXFilter = /*#__PURE__*/jsx(ContentBoxComponent, {
-    settings: {
-      contentBoxProps: {
-        type: 'SliderContainer',
-        sliderType: 'slideX',
-        resistanceRatio: 0,
-        height: 'auto',
-        slidesPerView: 7,
-        contents: contents,
-        centeredSlides: true
-
-        // autoPlay: 3,
-      }
-    }
-  });
-  var onClick = function onClick() {
-    var boxContent = viewHandler.settingsState.infoBoxContent;
-    if (boxContent && boxContent.id === id && boxContent.type === 'filter') viewHandler.settingsState.updateInfoBox();else viewHandler.settingsState.updateInfoBox({
-      type: 'filter',
-      id: id,
-      content: jsXFilter
-    });
-  };
-  return /*#__PURE__*/jsxs("div", {
-    className: container,
-    "data-test-id": "slide-filter",
-    children: [((_viewHandler$settings = viewHandler.settingsState.itemPalettes.get(id)) === null || _viewHandler$settings === void 0 ? void 0 : _viewHandler$settings.filterValue) && /*#__PURE__*/jsx("div", {
-      className: deselectColor,
-      onClick: deleteCurValue
-    }), /*#__PURE__*/jsx("img", {
-      className: colorFilter,
-      src: colorFilterIcon,
-      onClick: onClick
-    })]
-  });
-};
-var SlideFilter$1 = observer(SlideFilter);
-
-export { SlideFilter$1 as default };

package/build/esm/index-68797320.js

@@ -1,25 +0,0 @@
-import './index-945074f1.js';
-import 'react';
-import DynamicMultiRender from 'react-dynamic-multi-render';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-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 PlannerUIVariant = function PlannerUIVariant() {
-  return /*#__PURE__*/jsx(DynamicMultiRender, {
-    componentName: "Product/ProductCenter/PlannerUI/PlannerUIVariants"
-  });
-};
-
-export { PlannerUIVariant as default };

package/build/esm/index-6891af5f.js

@@ -1,75 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-945074f1.js';
-import 'react';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useDivaCore, 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/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 container = "container-GW5iG";
-var mobile = "mobile-PkDVb";
-var image = "image-afs5h";
-var textContainer = "textContainer-eYs6D";
-var expanded = "expanded-0VaOS";
-var articleName = "articleName-YT5oo";
-var posNrContainer = "posNrContainer-sis0e";
-var posNrHeightFitter = "posNrHeightFitter-LVv74";
-var quantity = "quantity-nayMq";
-var price = "price-ZyMfu";
-var css_248z = ".container-GW5iG {\r\n  position: relative;\r\n  border-top: 1px solid #c6c6c6;\r\n  margin: 0 16px;\r\n  padding: 16px 0;\r\n  display: flex;\r\n  flex-direction: row;\r\n}\r\n\r\n.container-GW5iG.mobile-PkDVb {\r\n  margin: 0;\r\n}\r\n\r\n.image-afs5h {\r\n  max-height: 5rem;\r\n  max-width: 30%;\r\n  -o-object-fit: contain;\r\n     object-fit: contain;\r\n}\r\n\r\n.textContainer-eYs6D {\r\n  position: relative;\r\n  height: 80px;\r\n  width: calc(70% - 80px);\r\n  overflow: auto;\r\n  margin-left: 16px;\r\n}\r\n.mobile-PkDVb .textContainer-eYs6D {\r\n  word-break: break-word;\r\n}\r\n.expanded-0VaOS .textContainer-eYs6D {\r\n  width: calc(50% - 80px);\r\n}\r\n\r\n.articleName-YT5oo {\r\n  font-weight: 300;\r\n}\r\n\r\n.posNrContainer-sis0e {\r\n  margin-left: 16px;\r\n  text-align: center;\r\n  height: 5rem;\r\n  width: calc(20% - 16px);\r\n  position: relative;\r\n}\r\n.posNrHeightFitter-LVv74 {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  width: 100%;\r\n}\r\n\r\n.posNrContainer-sis0e span {\r\n  background: var(--thirdColor);\r\n  border-radius: var(--articlePosNrRadius);\r\n  color: var(--secondaryColor);\r\n  font-size: 16px;\r\n  line-height: 1.27rem;\r\n  min-width: 1.27rem;\r\n  width: 2rem;\r\n  width: -moz-fit-content;\r\n  width: fit-content;\r\n  text-align: center;\r\n  display: inline-block;\r\n  padding: 0 1px;\r\n  -webkit-text-stroke: 0.5px;\r\n  margin-bottom: 0.2rem;\r\n}\r\n\r\n.quantity-nayMq {\r\n  margin-left: 16px;\r\n  width: calc(10% - 16px);\r\n  height: 5rem;\r\n  font-style: italic;\r\n  font-weight: 600;\r\n  text-align: center;\r\n  line-height: 5rem;\r\n}\r\n.price-ZyMfu {\r\n  margin-left: 16px;\r\n  width: calc(20% - 16px);\r\n  height: 5rem;\r\n  font-weight: 600;\r\n  line-height: 5rem;\r\n  text-align: center;\r\n  white-space: nowrap;\r\n}\r\n";
-styleInject(css_248z);
-
-var Articles = function Articles(_ref) {
-  var _item$targetArticlePo;
-  var itemP = _ref.item;
-  var item = itemP;
-  var viewHandler = useViewHandler();
-  var isExpanded = viewHandler.uiState.configSettingsIsExpanded || viewHandler.uiState.configSettingsIsMaxExpanded;
-  var _useDivaCore = useDivaCore(),
-    isMobile = _useDivaCore.state.dimensions.isMobile;
-  return /*#__PURE__*/jsxs("div", {
-    className: classnames(container, isExpanded ? expanded : undefined, isMobile ? mobile : undefined),
-    children: [/*#__PURE__*/jsx("img", {
-      className: classnames(image),
-      src: item.image
-    }), /*#__PURE__*/jsxs("div", {
-      className: classnames(textContainer),
-      children: [/*#__PURE__*/jsx("span", {
-        className: classnames(articleName),
-        children: item.title
-      }), item.description && /*#__PURE__*/jsx("span", {
-        children: item.description
-      })]
-    }), isExpanded && !isMobile && /*#__PURE__*/jsx("div", {
-      className: classnames(posNrContainer),
-      children: /*#__PURE__*/jsx("div", {
-        className: classnames(posNrHeightFitter),
-        children: (_item$targetArticlePo = item.targetArticlePosNrs) === null || _item$targetArticlePo === void 0 ? void 0 : _item$targetArticlePo.map(function (posNr, key) {
-          return /*#__PURE__*/jsx("span", {
-            children: posNr
-          }, key);
-        })
-      })
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(quantity),
-      children: item.quantity + 'x'
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(price),
-      children: DivaUtils.formatPrice(item.price)
-    })]
-  });
-};
-var SummaryArticles = observer(Articles);
-
-export { SummaryArticles as default };