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

package/build/esm/index-a581ebd2.js

@@ -1,140 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, G as GenericToolTip, P as PricePreview } from './index-e3c8af97.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useState } from 'react';
-import MetaData from './index-3e2666b1.js';
-import InfoIcon from './index-059eebe8.js';
-import { useHover, useLayer } from 'react-laag';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-import 'react-switch';
-import 'react-countup';
-
-var articleItem = "article-item-eh-j4";
-var wcVCodexText = "wcVCodexText-MyIlQ";
-var sel = "sel-84QKb";
-var imageWrapper = "imageWrapper-gvsu5";
-var wcImage = "wcImage-GYOFl";
-var titleWrapper = "titleWrapper-noaB3";
-var title = "title-79bZq";
-var mobile = "mobile-V-kG0";
-var tablet = "tablet-SBmhr";
-var wcArticleSize = "wcArticleSize--au3o";
-var css_248z = "/*Size Normal */\n\n.article-item-eh-j4 {\n  border-radius: calc(var(--globalBorderRadius));\n  position: relative;\n  z-index: 100;\n  transition: all 0.15s ease;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.article-item-eh-j4:active,\n.article-item-eh-j4:hover {\n  z-index: 200;\n  transition: 0.15s ease;\n}\n\n.wcVCodexText-MyIlQ {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 100%;\n  color: white;\n  display: none;\n  text-align: center;\n}\n\n.article-item-eh-j4:hover .wcVCodexText-MyIlQ,\n.sel-84QKb .wcVCodexText-MyIlQ {\n  display: block;\n}\n\n.imageWrapper-gvsu5 {\n  border-radius: calc(var(--globalBorderRadius));\n  border: 1px rgb(230, 230, 230) solid;\n  display: flex;\n  transition: 0.15s ease;\n  position: relative;\n}\n.article-item-eh-j4:hover .imageWrapper-gvsu5 {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n.sel-84QKb.article-item-eh-j4:hover .imageWrapper-gvsu5 {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px rgb(230, 230, 230) solid;\n}\n.sel-84QKb .imageWrapper-gvsu5 {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n}\n\n.wcImage-GYOFl {\n  width: calc(100% - 8px);\n  border: 4px white solid;\n  background-color: #fff;\n  border-radius: calc(var(--globalBorderRadius));\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  -o-object-fit: contain;\n     object-fit: contain;\n  background-color: #fff;\n  transition: border 0.3s ease;\n  aspect-ratio: 1/1;\n}\n.sel-84QKb .wcImage-GYOFl {\n  border: 4px var(--primaryColor) solid;\n  border: 4px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n\n.hexColor-LvQOl {\n  width: 80px;\n  height: 80px;\n}\n\n.titleWrapper-noaB3 {\n  display: flex;\n  justify-content: center;\n  overflow: visible;\n  max-height: 42px;\n}\n\n.title-79bZq {\n  text-align: center;\n  width: 100%;\n  height: 48px;\n  min-height: -moz-fit-content;\n  min-height: fit-content;\n  max-height: -moz-fit-content;\n  max-height: fit-content;\n  font-size: 14px;\n  line-height: 16px;\n  overflow: hidden;\n  display: -webkit-box;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  -webkit-line-clamp: 3;\n  transition: height 0.3s ease-out;\n}\n\n.mobile-V-kG0:not(.tablet-SBmhr) .title-79bZq {\n  font-size: 12px;\n  line-height: 14px;\n}\n\n.article-item-eh-j4:hover .title-79bZq,\n.article-item-eh-j4:focus .title-79bZq {\n  max-height: -moz-fit-content;\n  max-height: fit-content;\n  min-height: -moz-fit-content;\n  min-height: fit-content;\n  -webkit-line-clamp: 30;\n  height: 72px;\n  z-index: 200;\n  background-color: var(--settingsBackgroundColor);\n  border-bottom-left-radius: var(--globalBorderRadius);\n  border-bottom-right-radius: var(--globalBorderRadius);\n  transition: height 0.3s ease-in;\n}\n\n.article-item-eh-j4 .wcArticleSize--au3o {\n  bottom: 0px;\n  padding-bottom: 3px;\n  left: 0px;\n  padding-left: 4px;\n  padding-right: 4px;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  font-size: 11px;\n  line-height: 17px;\n  color: #6f6f6f;\n  z-index: 50;\n  position: absolute;\n  overflow: hidden;\n  display: -webkit-box;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  -webkit-line-clamp: 1;\n  width: calc(100% - 8px);\n  transition: opacity 0.3s ease;\n  background-color: rgba(255, 255, 255, 0.85);\n  border-bottom-left-radius: var(--globalBorderRadius);\n  border-bottom-right-radius: var(--globalBorderRadius);\n}\n\n.mobile-V-kG0:not(.tablet-SBmhr).article-item-eh-j4 .wcArticleSize--au3o {\n  font-size: 10px;\n  line-height: 12px;\n}\n\n.sel-84QKb .wcArticleSize--au3o {\n  bottom: 4px;\n  padding-bottom: 0px;\n  left: 4px;\n  padding-left: 4px;\n  padding-right: 4px;\n  width: calc(100% - 16px);\n  border-bottom-left-radius: calc(var(--globalBorderRadius) - 2px);\n  border-bottom-right-radius: calc(var(--globalBorderRadius) - 2px);\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 Article = function Article(_ref) {
-  var _viewHandler$settings, _renderLayer, _item$longDescription;
-  var itemP = _ref.item,
-    paletteId = _ref.paletteId;
-  var item = itemP;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$state = _useDivaCore.state,
-    _useDivaCore$state$di = _useDivaCore$state.dimensions,
-    isMobile = _useDivaCore$state$di.isMobile,
-    isTablet = _useDivaCore$state$di.isTablet,
-    hidePrices = _useDivaCore$state.hidePrices;
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    metaDataVisible = _useState2[0],
-    setMetaDataVisible = _useState2[1];
-  var onClick = function onClick() {
-    viewHandler.paletteViewHandler.clickedOnPlannerPalette(item, paletteId);
-  };
-
-  /* tool tip stuff*/
-  var triggerProps = {};
-  var layerProps = {};
-  var renderLayer = undefined;
-  var isOver = false;
-  var hoverProps = {};
-  var hover = useHover({
-    delayEnter: 1500,
-    hideOnScroll: true
-  });
-  var tooltip = useLayer({
-    isOpen: hover[0],
-    auto: true,
-    placement: viewHandler.getViewConfig().tooltipPosition || 'left-center'
-  });
-  if (!isMobile && !isTablet && !viewHandler.getViewConfig().hideTooltip && !item.contentItemId) {
-    isOver = hover[0];
-    hoverProps = hover[1];
-    triggerProps = tooltip.triggerProps;
-    layerProps = tooltip.layerProps;
-    renderLayer = tooltip.renderLayer;
-  }
-  var isSelected = item.sel && ((_viewHandler$settings = viewHandler.settingsState.addElementSelected) === null || _viewHandler$settings === void 0 ? void 0 : _viewHandler$settings.mode) != 'add';
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread(_objectSpread({
-    id: item.codex,
-    className: classnames(articleItem, isSelected ? sel : undefined, viewHandler.getIsInMobileView() ? mobile : undefined, viewHandler.uiState.isTablet ? tablet : undefined),
-    onClick: onClick
-  }, triggerProps), hoverProps), {}, {
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classnames(imageWrapper),
-      children: [viewHandler.getViewConfig().showOptionCodexInOptionHeader && /*#__PURE__*/jsx("div", {
-        className: classnames(wcVCodexText),
-        children: item.articleCodex
-      }), item.image && /*#__PURE__*/jsx("img", {
-        className: classnames(wcImage),
-        src: item.image.replace('_gal', '').replace('_low', '')
-      }), item.contentItemId && /*#__PURE__*/jsx(InfoIcon, {
-        item: item,
-        style: {
-          top: -6,
-          bottom: 'unset',
-          right: -7
-        }
-      }, item.codex), /*#__PURE__*/jsx("div", {
-        className: classnames(wcArticleSize),
-        children: item.sizeInfo
-      })]
-    }), /*#__PURE__*/jsx("div", {
-      className: titleWrapper,
-      children: /*#__PURE__*/jsx("div", {
-        className: title,
-        dangerouslySetInnerHTML: {
-          __html: item.title
-        }
-      })
-    }), isOver && ((_renderLayer = renderLayer) === null || _renderLayer === void 0 ? void 0 : _renderLayer(/*#__PURE__*/jsx(GenericToolTip, {
-      text: (_item$longDescription = item.longDescription) !== null && _item$longDescription !== void 0 ? _item$longDescription : item.title,
-      desciption: metaDataVisible,
-      codex: item.articleCodex,
-      image: item.image,
-      layerProps: layerProps,
-      price: item.price
-    }, item.codex))), /*#__PURE__*/jsx(MetaData, {
-      style: {
-        position: 'relative',
-        "float": 'left',
-        display: 'none'
-      },
-      metaData: item.metaData,
-      visible: [metaDataVisible, setMetaDataVisible]
-    }, item.codex), item.priceInfo !== undefined && !hidePrices && /*#__PURE__*/jsx(PricePreview, {
-      price: item.price
-    })]
-  }));
-};
-var FaceLift = observer(Article);
-
-export { FaceLift as default };

package/build/esm/index-a5d11eb0.js

@@ -1,33 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-e3c8af97.js';
-import 'react';
-import DynamicMultiRender from 'react-dynamic-multi-render';
-import { jsx } from 'react/jsx-runtime';
-import '@crystaldesign/diva-core';
-import 'mobx-react-lite';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-import 'react-countup';
-
-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 OrbitInteraction = function OrbitInteraction(props) {
-  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
-    componentName: "Product/ProductCenter/Planner3DImage/OrbitInteraction"
-  }));
-};
-
-export { OrbitInteraction as default };

package/build/esm/index-a6293b8b.js

@@ -1,90 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { s as styleInject, u as useViewHandler } from './index-e3c8af97.js';
-import { observer } from 'mobx-react-lite';
-import { useRef, useEffect } from 'react';
-import classnames from 'classnames';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import TabGroupHorizontal from './index-5a68300d.js';
-import TabGroupVertical from './index-eb264d23.js';
-import TabSearch from './index-7a4c3d69.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-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 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-import './index-f2c41519.js';
-import './index-a8ffc6e6.js';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-
-var wcConfiguratorSteps = "wcConfigurator-steps-1pUS0";
-var portrait = "portrait-uvNtu";
-var horizontal = "horizontal-6TCsO";
-var wcConfiguratorStepsSplit = "wcConfigurator-steps-split-ATmZ8";
-var closeRight = "close-right-rv5xk";
-var closeLeft = "close-left-S5bW1";
-var vertical = "vertical-HLAFY";
-var tabSearchVisibleClass = "tab-search-visible-class-VelST";
-var landscape = "landscape-O7G0i";
-var wcConfigCloseButton = "wcConfigCloseButton-mkHVY";
-var closeButtonHidden = "closeButtonHidden-g1FQc";
-var wcConfiguratorStepsContainer = "wcConfigurator-steps-Container-Yb9mE";
-var css_248z = ".wcConfigurator-steps-1pUS0 {\n  z-index: 1100;\n}\n\n.portrait-uvNtu.wcConfigurator-steps-1pUS0 {\n  overflow: hidden;\n}\n\n.horizontal-6TCsO.wcConfigurator-steps-1pUS0 {\n  background-color: var(--thirdColor);\n}\n.portrait-uvNtu.horizontal-6TCsO.wcConfigurator-steps-1pUS0 {\n  background-color: rgba(238, 238, 238, 0.95);\n}\n.horizontal-6TCsO .wcConfigurator-steps-split-ATmZ8 {\n  height: 100%;\n  width: calc(100% - 4.3rem);\n  float: left;\n  background: var(--tabGroupBackground);\n}\n\n.horizontal-6TCsO.portrait-uvNtu.close-right-rv5xk .wcConfigurator-steps-split-ATmZ8 {\n  width: calc(100% - 3.6rem);\n}\n.horizontal-6TCsO.portrait-uvNtu.close-left-S5bW1 .wcConfigurator-steps-split-ATmZ8 {\n  width: 100%;\n}\n\n.vertical-HLAFY .wcConfigurator-steps-split-ATmZ8 {\n  height: 100%;\n  width: 100%;\n  background: var(--tabGroupBackground);\n}\n\n.tab-search-visible-class-VelST.vertical-HLAFY .wcConfigurator-steps-split-ATmZ8 {\n  height: calc(100% - 46px);\n}\n.horizontal-6TCsO.landscape-O7G0i .wcConfigurator-steps-split-ATmZ8 {\n  width: 100%;\n}\n\n.wcConfigCloseButton-mkHVY {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2220%22 viewBox%3D%220 0 20 20%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M0.5625 0.836182L18.5625 18.8362M18.5625 0.836182L0.5625 18.8362%22 stroke%3D%22%234A4A4A%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  float: left;\n  width: 32px;\n  height: 32px;\n  margin: 12.8px;\n  margin-left: 17.6px;\n  transition: background-color 0.15s ease;\n  border-radius: var(--globalBorderRadius);\n}\n.vertical-HLAFY .wcConfigCloseButton-mkHVY {\n  position: absolute;\n  top: -56px;\n  left: 30px;\n}\n\n.portrait-uvNtu .wcConfigCloseButton-mkHVY {\n  position: absolute;\n  top: 0;\n  margin: 10px;\n}\n\n.portrait-uvNtu.close-right-rv5xk .wcConfigCloseButton-mkHVY {\n  right: 0;\n}\n\n.portrait-uvNtu.close-left-S5bW1 .wcConfigCloseButton-mkHVY {\n  left: -50px;\n}\n\n.wcConfigCloseButton-mkHVY:hover {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n}\n\n.wcConfigCloseButton-mkHVY:active {\n  background-color: rgba(197, 197, 197, 0.1);\n}\n\n.wcTabGroupItem-eqGtC:first-child {\n  border-radius: var(--globalBorderRadius) 0 0 var(--globalBorderRadius);\n}\n\n.portrait-uvNtu .wcTabGroupItem-eqGtC:first-child {\n  border-radius: 0px;\n}\n\n.horizontal-6TCsO.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8 {\n  border-radius: var(--globalBorderRadius);\n  border-width: 0px;\n  overflow-x: auto;\n}\n\n.portrait-uvNtu.horizontal-6TCsO.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8 {\n  border-radius: 0px;\n  height: calc(100% - 3px);\n}\n\n.wcConfigur-xKWej .wcConfiguratorator-steps-Container-FGpNz {\n  width: -moz-max-content;\n  width: max-content;\n  height: 100%;\n}\n\n.horizontal-6TCsO .wcConfigurator-steps-split-ATmZ8 {\n  height: 100%;\n  width: calc(100% - 4.3rem);\n  float: left;\n}\n\n.horizontal-6TCsO.closeButtonHidden-g1FQc .wcConfigurator-steps-split-ATmZ8,\n.horizontal-6TCsO.closeButtonHidden-g1FQc.portrait-uvNtu .wcConfigurator-steps-split-ATmZ8,\n.horizontal-6TCsO.closeButtonHidden-g1FQc.landscape-O7G0i .wcConfigurator-steps-split-ATmZ8 {\n  width: 100%;\n  overscroll-behavior: contain;\n}\n\n.horizontal-6TCsO.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8::-webkit-scrollbar {\n  display: none;\n}\n\n/* Hide scrollbar for IE and Edge */\n.horizontal-6TCsO.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8,\n.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8 {\n  -ms-overflow-style: none;\n  scrollbar-width: none; /* Firefox */\n}\n\n.vertical-HLAFY.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8 {\n  overflow: auto;\n\n  /* Hide scrollbar for IE, Edge add Firefox */\n\n  -ms-overflow-style: none;\n  scrollbar-width: none; /* Firefox */\n}\n\n.vertical-HLAFY.wcConfigurator-steps-1pUS0 .wcConfigurator-steps-split-ATmZ8::-webkit-scrollbar {\n  display: none;\n}\n\n.horizontal-6TCsO .wcConfigurator-steps-Container-Yb9mE {\n  width: -moz-max-content;\n  width: max-content;\n  height: 100%;\n  overscroll-behavior: contain;\n}\n\n.vertical-HLAFY .wcConfigurator-steps-Container-Yb9mE {\n  width: 100%;\n  height: 100%;\n}\n\n/* Dark mode – matches backoffice */\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .horizontal-6TCsO.wcConfigurator-steps-1pUS0,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .horizontal-6TCsO.wcConfigurator-steps-1pUS0 {\n  background-color: rgb(30, 30, 30);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .portrait-uvNtu.horizontal-6TCsO.wcConfigurator-steps-1pUS0,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .portrait-uvNtu.horizontal-6TCsO.wcConfigurator-steps-1pUS0 {\n  background-color: rgb(30, 30, 30);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .horizontal-6TCsO .wcConfigurator-steps-split-ATmZ8,\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .vertical-HLAFY .wcConfigurator-Q0f5q -steps-split,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .horizontal-6TCsO .wcConfigurator-steps-split-ATmZ8,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .vertical-HLAFY .wcConfigurator-steps-split-ATmZ8 {\n  background: rgb(20, 20, 20);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wcConfigCloseButton-mkHVY:hover,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .wcConfigCloseButton-mkHVY:hover {\n  box-shadow: 0px 1px 4px rgba(255, 255, 255, 0.1);\n}\n\n.diva-component-DIVA_BACKOFFICE_NEW .darkmode .wcConfigCloseButton-mkHVY:active,\n.diva-component-DIVA_BACKOFFICE_NEW body.darkmode .wcConfigCloseButton-mkHVY:active {\n  background-color: rgba(255, 255, 255, 0.08);\n}\n";
-styleInject(css_248z);
-
-var _excluded = ["className", "showCloseButtonInMobile", "tabSearchClass"];
-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 TabGroupContainer = function TabGroupContainer(_ref) {
-  var className = _ref.className,
-    showCloseButtonInMobile = _ref.showCloseButtonInMobile,
-    tabSearchClass = _ref.tabSearchClass,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$state = _useDivaCore.state,
-    isFullscreenComponent = _useDivaCore$state.isFullscreenComponent,
-    isMobile = _useDivaCore$state.dimensions.isMobile;
-  var closeButtonVisible = isFullscreenComponent && showCloseButtonInMobile !== 'none' && !viewHandler.uiState.isMobilePortrait || viewHandler.tabGroupState.curTabGroupType != 'vertical' && !viewHandler.uiState.ViewConfig.hideCloseButton && viewHandler.eventIsManagedByClient('onWebPlanerClose') && !((!showCloseButtonInMobile || showCloseButtonInMobile == 'none') && viewHandler.getIsInMobileView());
-  var tabSearchVisible = viewHandler.uiState.ViewConfig.tabGroupSearchVisible;
-  var tabGroupScroller = useRef(null);
-  useEffect(function () {
-    if (tabGroupScroller.current) {
-      viewHandler.tabGroupState.setTabGroupScroller(tabGroupScroller.current);
-    }
-    return function () {};
-  }, [tabGroupScroller]);
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, props), {}, {
-    className: classnames(className, wcConfiguratorSteps, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.tabGroupState.curTabGroupType == 'horizontal' ? horizontal : undefined, viewHandler.tabGroupState.curTabGroupType == 'vertical' ? vertical : undefined, !closeButtonVisible ? closeButtonHidden : undefined, tabSearchVisible ? tabSearchVisibleClass : undefined, isMobile ? showCloseButtonInMobile == 'left' ? closeLeft : closeRight : undefined),
-    children: [tabSearchVisible && /*#__PURE__*/jsx(TabSearch, {
-      className: tabSearchClass
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(wcConfiguratorStepsSplit),
-      ref: tabGroupScroller,
-      children: /*#__PURE__*/jsxs("div", {
-        className: wcConfiguratorStepsContainer,
-        children: [viewHandler.tabGroupState.curTabGroupType == 'horizontal' && /*#__PURE__*/jsx(TabGroupHorizontal, {}), viewHandler.tabGroupState.curTabGroupType == 'vertical' && /*#__PURE__*/jsx(TabGroupVertical, {})]
-      })
-    }), closeButtonVisible && /*#__PURE__*/jsx("div", {
-      className: wcConfigCloseButton,
-      title: t('configurator.ConfigClose'),
-      onClick: viewHandler.onCloseConfigurator
-    })]
-  }));
-};
-var TabGroup = observer(TabGroupContainer);
-
-export { TabGroup as default };

package/build/esm/index-a693bbb2.js

@@ -1,48 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-e3c8af97.js';
-import 'react';
-import classnames from 'classnames';
-import { useTranslation } from '@crystaldesign/diva-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import 'mobx-react-lite';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-import 'react-switch';
-import 'react-countup';
-
-var verticalItem = "verticalItem-EHV6R";
-var openClass = "open-class-cQobQ";
-var visited = "visited-ecPKp";
-var arrow = "arrow-hUG12";
-var css_248z = ".verticalItem-EHV6R {\n  font-size: 12px;\n  padding: 12px 16px;\n  width: calc(100% - 32px);\n  color: #fff;\n  position: relative;\n  cursor: pointer;\n  background-color: #2e4351;\n  display: flex;\n  justify-content: space-between;\n  line-height: 20px;\n  border-bottom: #fdfdfd 1px solid;\n  transition: border 0.3s ease;\n}\n.open-class-cQobQ.verticalItem-EHV6R {\n  border-bottom: none;\n}\n\n.visited-ecPKp {\n  background-color: #142a37;\n}\n\n.arrow-hUG12 {\n  width: 8px;\n  height: 20px;\n  margin-right: 6px;\n  background: center / 100% no-repeat url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2213%22 viewBox%3D%220 0 8 13%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0.947266 1.14893L6.94727 6.29178L0.947266 11.9489%22 stroke%3D%22%23fff%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E %3C%2Fsvg%3E\");\n  transition: transform 0.3s ease;\n}\n\n.open-class-cQobQ .arrow-hUG12 {\n  transform: rotate(90deg);\n}\n";
-styleInject(css_248z);
-
-var Header = function Header(_ref) {
-  var tabGroup = _ref.tabGroup,
-    open = _ref.open;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  return /*#__PURE__*/jsxs("div", {
-    className: classnames(verticalItem, viewHandler.tabGroupAlreadyVisited(tabGroup) ? visited : undefined, open ? openClass : undefined),
-    children: [/*#__PURE__*/jsx("div", {
-      children: t('configurator.' + tabGroup.title, tabGroup.title)
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(arrow)
-    })]
-  });
-};
-
-export { Header as default };

package/build/esm/index-a6ea0c3b.js

@@ -1,220 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-e3c8af97.js';
-import 'react';
-import { s as shelfPlannerContainerRtv, a as shelfPlannerContainerHorizontal, b as shelfPlannerContainerVertical, e as expanded, c as shelfGrid, d as shelfGridBorder, w as warning, f as accessoires, g as configHeaderWrapper, h as closeButton, n as name, S as SelectedAcc, i as accessoireContainer } from './index-3fb20380.js';
-import { c as collapsableInner } from './index-0897f49a.js';
-import ShelfAccessoires from './index-21a0c019.js';
-import ShelfAccessoiresOld from './index-19976705.js';
-import GridList from './index-a428ff7c.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import SettingsItemsWrapper from './index-c0e095e2.js';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-import 'react-switch';
-import 'react-countup';
-import 'sift';
-import './index-1e79569b.js';
-import './index-da324a16.js';
-import './index-4c58c3c2.js';
-import './index-41c30ca2.js';
-import './index.module-28f2c902.js';
-import './index-059eebe8.js';
-import './index-e5636a52.js';
-import '@mui/icons-material/Block';
-import '@mui/icons-material/Warning';
-import './index-36e06757.js';
-import 'react-dropdown';
-import './index-72df8b5c.js';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-f6a50c4f.js';
-import './index-d22897d6.js';
-import './index-771985a5.js';
-import '@crystaldesign/content-box';
-import './index-e53d3866.js';
-import './index-0debf9a8.js';
-import './index-9d15e58b.js';
-import './index-c10b0795.js';
-import 'swiper/react';
-import 'swiper/modules';
-import './UnlockCard-08d4e77e.js';
-import './index-7af3fe57.js';
-import './index-db7e51e1.js';
-import './index-c5d98e72.js';
-import './index-7309f1af.js';
-import './index-519f1f0a.js';
-import './index-f68f4168.js';
-import 'react-laag';
-import './index.module-0cfc3909.js';
-import './index-5cac6c46.js';
-import './index-7841d60c.js';
-import './index-e843e92b.js';
-import './index-6df70720.js';
-import './index-ff466299.js';
-import './index.module-cc6d0a28.js';
-import './index-4f31e170.js';
-import './index-b7bc6a7d.js';
-import './index-9a1526b4.js';
-import './index-3ac8b214.js';
-import './index-66480609.js';
-import './index-3e2666b1.js';
-import './index-3cb57ae3.js';
-import './index-a581ebd2.js';
-import './index-cec84505.js';
-import './index-b91b62aa.js';
-import './index-125d5005.js';
-import './index-390e9d25.js';
-import './index-18b06c55.js';
-import 'rc-slider';
-import './index-d9027bed.js';
-import './index-aa1122c4.js';
-import './index-e371c413.js';
-import './index-500e611f.js';
-import './index-a47c915b.js';
-import 'react-confetti-explosion';
-import './index-8f61f3e8.js';
-import './index-b0a4d684.js';
-import './index-9a042b65.js';
-import 'react-qr-code';
-import './index-e287ac5c.js';
-import './useCustomDimensions-98495203.js';
-import './index-81a926bd.js';
-import './ussIsSticky-479c83b3.js';
-import './index-aa60dc29.js';
-import './index-31b9052d.js';
-import './index-77cb34b6.js';
-import './index.module-e5a455df.js';
-import './index-640b5058.js';
-import './index-b450eb39.js';
-import './index-225a3ece.js';
-import './index-c8656ebf.js';
-import 'react-beautiful-dnd';
-import './index-96058b06.js';
-import './index-c6afce04.js';
-import './index-39689b59.js';
-
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var ShelfPlanner = function ShelfPlanner(_ref) {
-  var _viewHandler$settings, _viewHandler$settings2, _viewHandler$settings3, _viewHandler$settings4, _item$shelfPlannerGri, _item$shelfPlannerGri2, _item$shelfPlannerGri3, _filteredGroups$0$ite, _filteredGroups$, _selAccItem, _selAccItem2;
-  var item = _ref.item,
-    style = _ref.style,
-    filteredGroups = _ref.filteredGroups;
-  var viewHandler = useViewHandler();
-  var height = ((_viewHandler$settings = (_viewHandler$settings2 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings2 === void 0 ? void 0 : _viewHandler$settings2.getBoundingClientRect().height) !== null && _viewHandler$settings !== void 0 ? _viewHandler$settings : 0) - 10;
-  var width = ((_viewHandler$settings3 = (_viewHandler$settings4 = viewHandler.settingsState.settingsScrollerElement) === null || _viewHandler$settings4 === void 0 ? void 0 : _viewHandler$settings4.getBoundingClientRect().width) !== null && _viewHandler$settings3 !== void 0 ? _viewHandler$settings3 : 0) - 16;
-  var grid = (_item$shelfPlannerGri = item === null || item === void 0 || (_item$shelfPlannerGri2 = item.shelfPlannerGrids) === null || _item$shelfPlannerGri2 === void 0 ? void 0 : _item$shelfPlannerGri2.find(function (g) {
-    return g.ActAccessoire;
-  })) !== null && _item$shelfPlannerGri !== void 0 ? _item$shelfPlannerGri : item === null || item === void 0 || (_item$shelfPlannerGri3 = item.shelfPlannerGrids) === null || _item$shelfPlannerGri3 === void 0 ? void 0 : _item$shelfPlannerGri3[0];
-  if (!grid) return /*#__PURE__*/jsx(Fragment, {});
-  var items = (_filteredGroups$0$ite = (_filteredGroups$ = filteredGroups[0]) === null || _filteredGroups$ === void 0 ? void 0 : _filteredGroups$.items) !== null && _filteredGroups$0$ite !== void 0 ? _filteredGroups$0$ite : [];
-  var selAcc = grid.ActAccessoire;
-  var selAccItem = undefined;
-  if (selAcc) {
-    selAccItem = items.find(function (item) {
-      return item.articleCodex == selAcc;
-    });
-  }
-  var requiredWarning = grid.getRequiredWarning(viewHandler.configState.lang);
-  var palettesOfSelectedAcc = [];
-  if ((_selAccItem = selAccItem) !== null && _selAccItem !== void 0 && (_selAccItem = _selAccItem.configStepKeys) !== null && _selAccItem !== void 0 && _selAccItem.length) {
-    var _loop = function _loop() {
-      var stepKey = selAccItem.configStepKeys[i];
-      var itemPalette = viewHandler.settingsState.itemPaletteArr.find(function (_ref2) {
-        var _ref3 = _slicedToArray(_ref2, 2);
-          _ref3[0];
-          var itemPalette = _ref3[1];
-        return itemPalette.configStepKey == stepKey.key;
-      });
-      if (!itemPalette) return 1; // continue
-      if (viewHandler.settingsState.selectedShelfAccessoire == stepKey.basketId) palettesOfSelectedAcc.push(itemPalette[1]);
-    };
-    for (var i = 0; i < selAccItem.configStepKeys.length; i++) {
-      if (_loop()) continue;
-    }
-  }
-  var mobileRTV = viewHandler.getIsInMobileView() && viewHandler.productState.shelfPlannerRTV;
-  return /*#__PURE__*/jsxs("div", {
-    ref: function ref(_ref4) {
-      return item.htmlRef = _ref4;
-    },
-    className: classnames(viewHandler.productState.shelfPlannerRTV ? shelfPlannerContainerRtv : undefined, grid.Direction == 'horizontal' ? shelfPlannerContainerHorizontal : shelfPlannerContainerVertical, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined),
-    style: _objectSpread({
-      height: height
-    }, style),
-    children: [!viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx("div", {
-      className: shelfGrid,
-      children: /*#__PURE__*/jsx("div", {
-        className: shelfGridBorder,
-        children: /*#__PURE__*/jsx(GridList, {
-          item: item,
-          direction: grid.Direction,
-          width: width,
-          height: height - 16 - 16
-        })
-      })
-    }), requiredWarning && /*#__PURE__*/jsx("div", {
-      className: warning,
-      dangerouslySetInnerHTML: {
-        __html: requiredWarning
-      }
-    }), /*#__PURE__*/jsxs("div", {
-      className: accessoires,
-      children: [!!palettesOfSelectedAcc.length && /*#__PURE__*/jsxs(Fragment, {
-        children: [/*#__PURE__*/jsxs("div", {
-          className: configHeaderWrapper,
-          onClick: function onClick() {
-            return viewHandler.paletteViewHandler.setSelectedShelfAccessoire();
-          },
-          children: [/*#__PURE__*/jsx("div", {
-            className: closeButton
-          }), /*#__PURE__*/jsx("div", {
-            className: name,
-            children: (_selAccItem2 = selAccItem) === null || _selAccItem2 === void 0 ? void 0 : _selAccItem2.name
-          })]
-        }), /*#__PURE__*/jsx(SettingsItemsWrapper, {
-          itemPalettesArr: palettesOfSelectedAcc
-        })]
-      }), !palettesOfSelectedAcc.length && /*#__PURE__*/jsxs(Fragment, {
-        children: [!mobileRTV && /*#__PURE__*/jsx(SelectedAcc, {
-          selAccItem: selAccItem
-        }), /*#__PURE__*/jsx("div", {
-          className: classnames(accessoireContainer, collapsableInner),
-          style: {
-            height: grid.Direction == 'horizontal' ? height - 80 : '',
-            overflow: mobileRTV ? 'visible' : undefined
-          },
-          children: items.map(function (acc, key) {
-            return /*#__PURE__*/jsxs(Fragment, {
-              children: [viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx(ShelfAccessoires, {
-                grids: item.shelfPlannerGrids,
-                item: acc,
-                sel: acc.articleCodex == selAcc
-              }, key), !viewHandler.productState.shelfPlannerRTV && /*#__PURE__*/jsx(ShelfAccessoiresOld, {
-                grids: item.shelfPlannerGrids,
-                item: acc
-              }, key)]
-            });
-          })
-        })]
-      })]
-    })]
-  });
-};
-var index = observer(ShelfPlanner);
-
-export { index as default };

package/build/esm/index-a8ffc6e6.js

@@ -1,33 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-e3c8af97.js';
-import 'react';
-import DynamicMultiRender from 'react-dynamic-multi-render';
-import { jsx } from 'react/jsx-runtime';
-import '@crystaldesign/diva-core';
-import 'mobx-react-lite';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-import 'react-countup';
-
-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 ItemVariant = function ItemVariant(props) {
-  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
-    componentName: "TabGroup/TabGroupVertical/ItemVariants"
-  }));
-};
-
-export { ItemVariant as default };