@crystaldesign/diva-web-planner-react 26.3.0-beta.4 → 26.3.0-beta.40

package/build/esm/index-b563817f.js

@@ -0,0 +1,80 @@
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { useRef, useEffect } from 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+
+var wrapper = "wrapper-CXHC0";
+var wcTabGroupItem = "wcTabGroupItem-byqO6";
+var portrait = "portrait--dsxg";
+var tablet = "tablet-xCDe-";
+var wcActiveStep = "wcActiveStep-06tW4";
+var chevron = "chevron-a7ixM";
+var css_248z = ".wrapper-CXHC0 {\n  display: flex;\n  align-items: center;\n  float: left;\n  height: 100%;\n}\n\n.wcTabGroupItem-byqO6 {\n  height: 100%;\n  width: -moz-fit-content;\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 12px;\n  font-size: 14px;\n  font-weight: 300;\n  white-space: nowrap;\n  color: var(--diva-theme-palette-text-secondary);\n  cursor: pointer;\n  transition:\n    color 0.2s ease-out,\n    background-color 0.2s ease-out;\n  line-height: 1;\n  border: none;\n  background: none;\n}\n\n.portrait--dsxg:not(.tablet-xCDe-) .wcTabGroupItem-byqO6 {\n  font-size: 12px;\n  padding: 0 8px;\n}\n\n.wcTabGroupItem-byqO6:hover {\n  color: var(--diva-theme-palette-primary-main);\n}\n\n.wcActiveStep-06tW4 .wcTabGroupItem-byqO6 {\n  color: var(--diva-theme-palette-primary-main);\n  background-color: color-mix(in srgb, var(--diva-theme-palette-primary-main) 5%, transparent);\n  border-radius: 2px;\n}\n\n.chevron-a7ixM {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: 12px;\n  height: 12px;\n  color: color-mix(in srgb, var(--diva-theme-palette-text-primary) 15%, transparent);\n}\n\n.portrait--dsxg:not(.tablet-xCDe-) .chevron-a7ixM {\n  width: 10px;\n  height: 10px;\n}\n";
+styleInject(css_248z);
+
+var TabGroupItemHorizontalInspiration = function TabGroupItemHorizontalInspiration(_ref) {
+  var tabGroup = _ref.tabGroup;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var tabGroupItemRef = useRef(null);
+  var curTabGroup = viewHandler.tabGroupState.curTabGroup;
+  useEffect(function () {
+    viewHandler.tabGroupState.setTabGroupItems(tabGroup.key, tabGroupItemRef.current);
+  }, [tabGroupItemRef]);
+  var onTabGroupClick = function onTabGroupClick(tabGroup) {
+    window.lastNavigationType = 'TABGROUP_BY_POS_NR';
+    viewHandler.tabGroupState.navigateToTabgroupByPosNr(+tabGroup.posNr);
+  };
+  var keys = Object.keys(viewHandler.tabGroupState.allTabGroups);
+  var isActive = tabGroup.posNr == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.posNr);
+  var isLastItem = keys[keys.length - 1] == tabGroup.key;
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wrapper, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isTablet ? tablet : undefined, tabGroup.title == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.title) && isActive ? wcActiveStep : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      ref: tabGroupItemRef,
+      onClick: function onClick(e) {
+        e.stopPropagation();
+        onTabGroupClick(tabGroup);
+      },
+      className: classnames(wcTabGroupItem),
+      children: t('configurator.' + tabGroup.title, tabGroup.title)
+    }), !isLastItem && /*#__PURE__*/jsx("div", {
+      className: chevron,
+      children: /*#__PURE__*/jsx("svg", {
+        width: "12",
+        height: "12",
+        viewBox: "0 0 12 12",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/jsx("path", {
+          d: "M4 2L8 6L4 10",
+          stroke: "currentColor",
+          strokeWidth: "0.75",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        })
+      })
+    })]
+  });
+};
+var index = observer(TabGroupItemHorizontalInspiration);
+
+export { index as default };

package/build/esm/{index-cd4baa3c.js → index-b6ae2935.js}

@@ -1,7 +1,7 @@
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-3d6251d6.js';
 import 'react';
 import { DivaUtils } from '@crystaldesign/diva-core';
-import Toggle from './index-d7b9d494.js';
+import Toggle from './index-745045d6.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/index-b9831e68.js

@@ -0,0 +1,109 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { s as styleInject, u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon } from './index-3d6251d6.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import classnames from 'classnames';
+import { useDivaCore, useTranslation } from '@crystaldesign/diva-core';
+import { c as checkoutButton } from './index.module-c3a58bf1.js';
+import PriceCounter from './index-4fd9025b.js';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-countup';
+
+var wcConfiguratorAction = "wcConfigurator-action-1kRvz";
+var wcConfiguratorActionButton = "wcConfigurator-action-Button-uCk2M";
+var wcCheckoutButtonPrice = "wcCheckoutButtonPrice-S5Uqm";
+var wcCheckoutButtonText = "wcCheckoutButtonText-AKaeu";
+var bruttoPrice = "brutto-price-yaDwF";
+var canceled = "canceled-J6Faa";
+var hidden = "hidden-sa4Pc";
+var css_248z = ".wcConfigurator-action-1kRvz {\n  background: rgba(242.2, 242.2, 242.2, 0.9);\n  transition: width 0.2s ease-in-out;\n  display: flex;\n}\n\n.wcConfigurator-action-Button-uCk2M {\n  background-color: var(--primaryColor);\n  background-color: var(--saveButton, var(--primaryColor));\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--saveButton, var(--primaryColor)) solid;\n  border-radius: var(--globalBorderRadius);\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  line-height: 20.8px;\n  font-weight: var(--fontWeight1);\n  height: calc(100% - 2px);\n  font-size: 14px;\n  color: white;\n  flex-grow: 1;\n  -webkit-text-stroke: 0px;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.wcConfigurator-settings-actions-isOnFirstStepDisabled-4PqCh .wcConfigurator-action-Button-uCk2M {\n  pointer-events: none;\n  background-color: #c25353;\n  border-color: #c25353;\n}\n\n.wcConfigurator-action-Button-uCk2M:hover {\n  background-color: var(--diva-theme-palette-primary-dark);\n  border-color: var(--diva-theme-palette-primary-dark);\n  cursor: pointer;\n  transition:\n    box-shadow 0.3s ease,\n    background-color 0.3s ease,\n    border-color 0.3s ease;\n\n  box-shadow: 0px 1px 4px #707070;\n}\n\n.wcCheckoutButtonPrice-S5Uqm {\n  float: right;\n  margin-right: 10%;\n}\n.wcCheckoutButtonIcon-6TJQ5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2222%22 viewBox%3D%220 0 24 22%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M1 1H3.70647C4.17122 1 4.57471 1.32018 4.68031 1.77277L5.66667 6M5.66667 6L7.81969 15.2272C7.92529 15.6798 8.32878 16 8.79353 16H19.7192C20.1781 16 20.5781 15.6877 20.6894 15.2425L22.6894 7.24253C22.8472 6.61139 22.3698 6 21.7192 6H5.66667Z%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2210%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2218%22 cy%3D%2220%22 r%3D%221.25%22 stroke%3D%22white%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  width: 50%;\n  height: 50%;\n  transform: translate(-50%, -50%);\n  left: 50%;\n  top: 50%;\n  position: absolute;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz {\n  /*auser In die Zusammenfassung wird ausgeblendet*/\n  display: none;\n}\n.landscape-1LGy8 .wcConfigurator-Settings-hidden-kvVds.wcConfigurator-settings-actions-isOnLastStep-BV9rP .wcConfigurator-action-1kRvz {\n  display: none;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-1kRvz .wcConfigurator-action-Button-uCk2M {\n  line-height: var(--configuratorActionHeight);\n}\n.wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.landscape-1LGy8 .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu,\n.portrait-ySRAg .wcConfigurator-action-Button-uCk2M .wcCheckoutButtonText-AKaeu {\n  margin-top: 0px;\n}\n\n.wcCheckoutButtonText-AKaeu {\n  float: left;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n}\n\n.brutto-price-yaDwF {\n  float: right;\n  position: relative;\n  margin-right: 20px;\n  font-size: 14px;\n  -webkit-font-smoothing: antialiased;\n  -webkit-text-stroke: 0px;\n  line-height: 36.8px;\n  min-width: 64px;\n  text-align: right;\n  font-weight: 300;\n}\n\n.brutto-price-yaDwF.canceled-J6Faa {\n  color: #eee;\n  opacity: 1;\n  transition:\n    opacity 0.3s ease-in-out,\n    max-width 0.3s ease-in-out;\n  max-width: 110px;\n}\n.brutto-price-yaDwF.canceled-J6Faa.hidden-sa4Pc {\n  opacity: 0;\n  max-width: 0px;\n}\n\n.brutto-price-yaDwF.canceled-J6Faa:before {\n  position: absolute;\n  content: '';\n  left: -6px;\n  top: 44%;\n  right: 0;\n  border-top: 2px solid;\n  border-color: grey;\n  transform: rotate(-7deg);\n}\n\n.is-mobile-Zx3zd .brutto-price-yaDwF.canceled-J6Faa:before {\n  top: 45%;\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 BasketActionStandard = function BasketActionStandard(_ref) {
+  var _viewHandler$uiState$, _viewHandler$uiState$2, _viewHandler$productS, _viewHandler$productS2;
+  var _ref$buttonTextClassN = _ref.buttonTextClassName,
+    buttonTextClassName = _ref$buttonTextClassN === void 0 ? wcCheckoutButtonText : _ref$buttonTextClassN,
+    _ref$buttonPriceClass = _ref.buttonPriceClassName,
+    buttonPriceClassName = _ref$buttonPriceClass === void 0 ? wcCheckoutButtonPrice : _ref$buttonPriceClass,
+    containerClassName = _ref.containerClassName,
+    price = _ref.price,
+    showCheckoutButtons = _ref.showCheckoutButtons;
+  var viewHandler = useViewHandler();
+  var _useDivaCore = useDivaCore(),
+    hidePrices = _useDivaCore.state.hidePrices;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var addToBasketButton = (_viewHandler$uiState$ = viewHandler.uiState.checkoutConfig) === null || _viewHandler$uiState$ === void 0 ? void 0 : _viewHandler$uiState$.buttons.find(function (b) {
+    return b.type === 'ADD_TO_BASKET';
+  });
+  var onClick = function onClick() {
+    if (addToBasketButton) {
+      _onClickCheckout(addToBasketButton, viewHandler, addToBasketButton.index, t);
+    } else {
+      viewHandler.actionButtonState.onClickAddToBasket(viewHandler);
+    }
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: classnames(wcConfiguratorAction, containerClassName),
+    children: [showCheckoutButtons && ((_viewHandler$uiState$2 = viewHandler.uiState.checkoutConfig) === null || _viewHandler$uiState$2 === void 0 ? void 0 : _viewHandler$uiState$2.buttons.filter(function (b) {
+      return evalVisible(b, viewHandler, 'navigator');
+    }).map(function (b) {
+      return /*#__PURE__*/jsx("div", {
+        className: checkoutButton,
+        onClick: function onClick() {
+          return _onClickCheckout(b, viewHandler, b.index, t);
+        },
+        children: /*#__PURE__*/jsx(Icon, {
+          checkoutButton: _objectSpread(_objectSpread({}, b), {}, {
+            isPrimary: false
+          }),
+          size: 32
+        })
+      }, b.index);
+    })), /*#__PURE__*/jsxs("div", {
+      className: wcConfiguratorActionButton,
+      onClick: onClick,
+      id: "wcConfigurator-action-tobasket",
+      children: [addToBasketButton ? /*#__PURE__*/jsx(Icon, {
+        checkoutButton: _objectSpread({
+          isPrimary: true
+        }, addToBasketButton),
+        size: 40
+      }) : /*#__PURE__*/jsx("div", {
+        className: buttonTextClassName,
+        children: t('configurator.ADD_TO_BASKET')
+      }), !hidePrices && price !== undefined && viewHandler.tabGroupState.curTabGroupType == 'horizontal' && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(bruttoPrice, canceled, !viewHandler.productState.formatedBruttoPrice ? hidden : undefined),
+          children: /*#__PURE__*/jsx(PriceCounter, {
+            price: (_viewHandler$productS = viewHandler.productState.formatedBruttoPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0
+          })
+        }), /*#__PURE__*/jsx("div", {
+          className: buttonPriceClassName,
+          children: /*#__PURE__*/jsx(PriceCounter, {
+            price: (_viewHandler$productS2 = viewHandler.productState.formatedCurSetPrice) !== null && _viewHandler$productS2 !== void 0 ? _viewHandler$productS2 : 0
+          })
+        })]
+      })]
+    })]
+  });
+};
+var BasketAction = observer(BasketActionStandard);
+
+export { BasketAction as default };

package/build/esm/{index-4a4920c1.js → index-b9a08374.js}

@@ -1,28 +1,29 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import React, { useState, useRef, useEffect, Suspense, lazy, useMemo } from 'react';
 import { observer } from 'mobx-react-lite';
 import sift from 'sift';
-import TextBox from './index-bb9c255b.js';
-import ItemVariant from './index-690ec566.js';
-import SettingsPaletteGroup from './index-4c3350f8.js';
-import ToggleOption from './index-8cfa9496.js';
-import GroupDropdown from './index-29f5b2d0.js';
-import PromotedProducts from './index-4f1bfdab.js';
-import ToggleName from './index-d6330abc.js';
-import itemPaletteTypeComponentMap from './index-cb2a0cd1.js';
+import TextBox from './index-dda8786d.js';
+import ItemVariant from './index-540d3ba6.js';
+import SettingsPaletteGroup from './index-c55d02a7.js';
+import ToggleOption from './index-455fcb30.js';
+import GroupDropdown from './index-004b447c.js';
+import PromotedProducts from './index-be1508a5.js';
+import StyleConsultant from './index-333e8017.js';
+import ToggleName from './index-29798f44.js';
+import itemPaletteTypeComponentMap from './index-8a430faf.js';
 import classnames from 'classnames';
-import StepInfo from './index-2052475c.js';
-import SettingsHeader from './index-9c685201.js';
-import ReplaceSwitch from './index-6f08238e.js';
+import StepInfo from './index-67b93891.js';
+import SettingsHeader from './index-3d410951.js';
+import ReplaceSwitch from './index-a4fa889e.js';
 import { Swiper, SwiperSlide } from 'swiper/react';
 import { Navigation } from 'swiper/modules';
-import Slider from './index-05c216ca.js';
-import MultiToggle from './index-4b637a92.js';
-import Radio from './index-beb8eee3.js';
+import Slider from './index-7850c4e3.js';
+import MultiToggle from './index-2ce98b11.js';
+import Radio from './index-2b5e9ade.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import SummaryOverview from './index-f4bc312a.js';
+import SummaryOverview from './index-c6a8ae18.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
 var collapsableInner = "collapsable-inner-YPvJa";
@@ -30,7 +31,8 @@ var css_248z$3 = ".collapsable-outer-J0amo {\n  overflow: visible !important;\n}
 styleInject(css_248z$3);
 
 var wcConfiguratorConfigPaletteContainer = "wcConfigurator-ConfigPaletteContainer-uKDCv";
-var css_248z$2 = ".wcConfigurator-ConfigPaletteContainer-uKDCv {\n  width: 100%;\n  margin-bottom: 24px;\n  position: relative;\n}\n";
+var description = "description-zBhwu";
+var css_248z$2 = ".wcConfigurator-ConfigPaletteContainer-uKDCv {\n  width: 100%;\n  margin-bottom: 24px;\n  position: relative;\n}\n\n.description-zBhwu {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.5;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 12px;\n}\n";
 styleInject(css_248z$2);
 
 var horizontalGroup = "horizontal-group-394E3";
@@ -144,7 +146,7 @@ var index$2 = /*#__PURE__*/Object.freeze({
 function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ConceptFilter = /*#__PURE__*/lazy(function () {
-  return import('./index-0d2ccd4c.js');
+  return import('./index-56b909bb.js');
 });
 var ItemWrapper = function ItemWrapper(_ref) {
   var _item$conceptFilter;
@@ -179,7 +181,12 @@ var ItemWrapper = function ItemWrapper(_ref) {
         additionalGroupFilter: item.conceptFilter,
         paletteId: item.id
       })
-    }), !planner2Dot0 && Header, planner2Dot0 && /*#__PURE__*/jsx(ArticleOverviewWrapper$1, {}), plannerArticles && !planner2Dot0 && viewHandler.settingsState.doShowReplaceMode && (!viewHandler.paletteViewHandler.plannerItems.DoShowAdditionalPlannerElements || item.id == 2) && /*#__PURE__*/jsx(ReplaceSwitch, {}), planner2Dot0 && Header, children]
+    }), !planner2Dot0 && Header, planner2Dot0 && /*#__PURE__*/jsx(ArticleOverviewWrapper$1, {}), item.description && /*#__PURE__*/jsx("div", {
+      className: description,
+      dangerouslySetInnerHTML: {
+        __html: item.description
+      }
+    }), plannerArticles && !planner2Dot0 && viewHandler.settingsState.doShowReplaceMode && (!viewHandler.paletteViewHandler.plannerItems.DoShowAdditionalPlannerElements || item.id == 2) && /*#__PURE__*/jsx(ReplaceSwitch, {}), planner2Dot0 && Header, children]
   });
 };
 var ItemWrapper$1 = observer(ItemWrapper);
@@ -266,14 +273,18 @@ var useGridVariables = function useGridVariables(item) {
 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 = /*#__PURE__*/React.lazy(function () {
-  return import('./index-1d5c1c10.js');
+  return import('./index-64017d08.js');
 });
 var DoorPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-8dcdabc7.js');
+  return import('./index-1a77b67e.js');
 });
 var ProductList = /*#__PURE__*/React.lazy(function () {
-  return import('./index-506895ea.js');
+  return import('./index-83ccb175.js');
+});
+var InspectModeTables = /*#__PURE__*/React.lazy(function () {
+  return import('./index-43f4cdb7.js');
 });
+var INSPECT_MODE_EXCEPTIONS = ['SHELFPLANNER', 'PLANNER_2.0', 'CHECKOUT', 'PRODUCTS', 'PROMOTED', 'STYLE_CONSULTANT', 'DOOR_PLANNER', 'SUMMARY', 'SUMMARY_OPTIONTREE', 'SUMMARY_ARTICLES', 'VARIANTS'];
 var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
   var _item$groups$;
   var item = _ref.item,
@@ -308,12 +319,16 @@ var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
   var doNotRenderGroups = filteredGroups.length === 1 && filteredGroups[0].name === 'none';
   var innerGridClass = item.type.startsWith('SUMMARY') ? '' : collapsableInner;
   if (!item.visible) return /*#__PURE__*/jsx(Fragment, {});
+  var inspectMode = viewHandler.wysiwygDebugState.wysiwygInspectView;
+  if (inspectMode && !INSPECT_MODE_EXCEPTIONS.includes(item.type)) {
+    return /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx(Fragment, {}),
+      children: /*#__PURE__*/jsx(InspectModeTables, {
+        item: item
+      })
+    });
+  }
   switch (item.type) {
-    case 'PLANNER_2.0':
-      //is rendered with the articleoverviewwrapper
-      return /*#__PURE__*/jsx(Fragment, {});
-    case 'CHECKOUT':
-      return /*#__PURE__*/jsx(SummaryOverview, {}, item.id);
     case 'TOGGLE':
       return /*#__PURE__*/jsx(ToggleOption, {
         style: variables,
@@ -376,6 +391,11 @@ var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
           style: variables
         }, item.id)
       });
+    case 'PLANNER_2.0':
+      //is rendered with the articleoverviewwrapper
+      return /*#__PURE__*/jsx(Fragment, {});
+    case 'CHECKOUT':
+      return /*#__PURE__*/jsx(SummaryOverview, {}, item.id);
     case 'PRODUCTS':
       return /*#__PURE__*/jsx(ProductList, {
         item: item
@@ -384,6 +404,10 @@ var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
       return /*#__PURE__*/jsx(PromotedProducts, {
         item: item
       });
+    case 'STYLE_CONSULTANT':
+      return /*#__PURE__*/jsx(StyleConsultant, {
+        item: item
+      });
     case 'DOOR_PLANNER':
       return /*#__PURE__*/jsx(Suspense, {
         fallback: /*#__PURE__*/jsx(Fragment, {}),

package/build/esm/index-bb0c21f1.js

@@ -0,0 +1,65 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
+import { useMemo } from 'react';
+import Select from 'react-select';
+import { observer } from 'mobx-react-lite';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+
+var select = "select-8bXXP";
+var css_248z = ".select-8bXXP {\n  width: 200px;\n  font-size: 12px;\n  position: absolute;\n  z-index: 100;\n  top: 16px;\n}\n.select-8bXXP div {\n  border-color: grey !important;\n}\n.select-8bXXP div {\n  box-shadow: none;\n  box-shadow: initial;\n}\n\n/* Dark mode - article-select prefix scopes to this component (menu is portaled to body) */\n.darkmode .article-select__control,\nbody.darkmode .article-select__control {\n  background-color: rgba(30, 41, 59, 0.95) !important;\n  border-color: rgba(71, 85, 105, 0.8) !important;\n  box-shadow: none !important;\n}\n\n.darkmode .article-select__single-value,\nbody.darkmode .article-select__single-value {\n  color: #e2e8f0 !important;\n}\n\n.darkmode .article-select__input-container,\nbody.darkmode .article-select__input-container {\n  color: #e2e8f0 !important;\n}\n\n.darkmode .article-select__input,\nbody.darkmode .article-select__input {\n  color: #e2e8f0 !important;\n}\n\n.darkmode .article-select__placeholder,\nbody.darkmode .article-select__placeholder {\n  color: #94a3b8 !important;\n}\n\n.darkmode .article-select__menu,\nbody.darkmode .article-select__menu {\n  background-color: rgba(30, 41, 59, 0.98) !important;\n  border: 1px solid rgba(71, 85, 105, 0.8) !important;\n}\n\n.darkmode .article-select__menu-list,\nbody.darkmode .article-select__menu-list {\n  background-color: transparent !important;\n}\n\n.darkmode .article-select__option,\nbody.darkmode .article-select__option {\n  color: #e2e8f0 !important;\n}\n\n.darkmode .article-select__option--is-focused,\nbody.darkmode .article-select__option--is-focused {\n  background-color: rgba(51, 65, 85, 0.8) !important;\n}\n\n.darkmode .article-select__option--is-selected,\nbody.darkmode .article-select__option--is-selected {\n  background-color: rgba(59, 130, 246, 0.4) !important;\n  color: #93c5fd !important;\n}\n\n.darkmode .article-select__indicator-separator,\nbody.darkmode .article-select__indicator-separator {\n  background-color: rgba(71, 85, 105, 0.8) !important;\n}\n\n.darkmode .article-select__dropdown-indicator,\nbody.darkmode .article-select__dropdown-indicator {\n  color: #94a3b8 !important;\n}\n\n.darkmode .article-select__dropdown-indicator:hover,\nbody.darkmode .article-select__dropdown-indicator:hover {\n  color: #e2e8f0 !important;\n}\n";
+styleInject(css_248z);
+
+var ArticleSelector = function ArticleSelector(_ref) {
+  var _ref$articleState = _slicedToArray(_ref.articleState, 2),
+    article = _ref$articleState[0],
+    setArticle = _ref$articleState[1],
+    rerender = _ref.rerender,
+    articlesProp = _ref.articles,
+    filter = _ref.filter;
+  var viewHandler = useViewHandler();
+  var fromPlanner = useMemo(function () {
+    var _viewHandler$divaWebP;
+    return Object.values((_viewHandler$divaWebP = viewHandler.divaWebPlanner.getDivaArticles(undefined, true)) !== null && _viewHandler$divaWebP !== void 0 ? _viewHandler$divaWebP : {});
+  }, [viewHandler, rerender]);
+  var articles = articlesProp !== null && articlesProp !== void 0 ? articlesProp : filter ? fromPlanner.filter(filter) : fromPlanner;
+  var options = articles.map(function (a) {
+    return {
+      value: a.basketId,
+      label: a.name + ' ' + a.posNr
+    };
+  });
+  var onChange = function onChange(a) {
+    setArticle(articles.find(function (p) {
+      return p.basketId == a.value;
+    }));
+  };
+  if (options.length === 0) return null;
+  return /*#__PURE__*/jsx(Select, {
+    value: options.find(function (o) {
+      return o.value === (article === null || article === void 0 ? void 0 : article.basketId);
+    }),
+    options: options,
+    onChange: onChange,
+    className: select,
+    classNamePrefix: "article-select"
+  });
+};
+var ArticleSelector$1 = observer(ArticleSelector);
+
+export { ArticleSelector$1 as default };

package/build/esm/{index-4fef9047.js → index-bc30b964.js}

@@ -1,14 +1,14 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-3d6251d6.js';
 import { observer } from 'mobx-react-lite';
 import { useState, useRef, useEffect } from 'react';
 import { useLayer } from 'react-laag';
-import Tooltip from './index-f4e4bf34.js';
+import Tooltip from './index-653b7969.js';
 import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
 import classnames from 'classnames';
-import FullscreenAr, { FullscreenArHeader } from './index-7c638818.js';
+import FullscreenAr, { FullscreenArHeader } from './index-10447c01.js';
 import QRCode from 'react-qr-code';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
@@ -35,9 +35,7 @@ var ArQrCodeTooltip = function ArQrCodeTooltip(_ref) {
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useDivaCore = useDivaCore(),
-    _useDivaCore$actions = _useDivaCore.actions,
-    openDrawerMenu = _useDivaCore$actions.openDrawerMenu,
-    openModal = _useDivaCore$actions.openModal,
+    openDrawerMenu = _useDivaCore.actions.openDrawerMenu,
     _useDivaCore$state = _useDivaCore.state,
     isMobile = _useDivaCore$state.isMobile,
     isTablet = _useDivaCore$state.dimensions.isTablet;
@@ -78,28 +76,8 @@ var ArQrCodeTooltip = function ArQrCodeTooltip(_ref) {
     setUrl = _useState8[1];
   useEffect(function () {
     var _viewHandler$uiState$;
-    if (viewHandler.uiState.AllConfig.arViewerIframe) {
-      if (openDrawer) openModal({
-        rejectByIcon: true,
-        fullscreen: true,
-        dontRenderForm: true,
-        callback: function callback(value) {
-          viewHandler.productState.loadRTVForAr = false;
-          viewHandler.productState.setDoShowARQRCode(false);
-          setOpenDrawer(false);
-          viewHandler.productState.onChangePlannerView(viewHandler.productState.allow3DComb ? '3DCOMB' : viewHandler.productState.allowRTV ? 'RTV' : '3D');
-        },
-        title: /*#__PURE__*/jsx(FullscreenArHeader, {}),
-        content: /*#__PURE__*/jsx(FullscreenAr, {
-          url: url,
-          isArCompatible: viewHandler.productState.isArCompatible,
-          broswerSupportAR: viewHandler.productState.browserSupportAR,
-          activateAR: viewHandler.productState.activateAR,
-          hqRenderScript: viewHandler.hqRenderScript,
-          isTablet: isTablet
-        })
-      });
-    } else openDrawerMenu({
+    if (viewHandler.uiState.AllConfig.arViewerIframe) return;
+    openDrawerMenu({
       id: 'ar-qr-code',
       mountElement: (_viewHandler$uiState$ = viewHandler.uiState.wrapperRef) !== null && _viewHandler$uiState$ !== void 0 ? _viewHandler$uiState$ : undefined,
       handleInternScroll: true,
@@ -123,9 +101,6 @@ var ArQrCodeTooltip = function ArQrCodeTooltip(_ref) {
       open: openDrawer
     });
   }, [openDrawer, viewHandler.productState.activateAR]);
-  useEffect(function () {
-    if (viewHandler.productState.isARIframeVisible === false) setOpenDrawer(false);
-  }, [viewHandler.productState.isARIframeVisible]);
   useEffect(function () {
     if (viewHandler.productState.doShowARQRCode == true) {
       viewHandler.openARObserverConnection(function () {

package/build/esm/{index-0d64723e.js → index-bd7e21be.js}

@@ -1,10 +1,10 @@
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import { useRef, useState, useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import { getLogger, useTranslation, useDivaCore } from '@crystaldesign/diva-core';
 import RealTimeRenderer from '@crystaldesign/real-time-viewer';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
@@ -26,6 +26,7 @@ var hand = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAA
 var css_248z = "/* This keeps child nodes hidden while the element loads */\n#ar-viewer :not(:defined) > * {\n  display: none;\n}\n\n#ar-viewer model-viewer {\n  background-color: #eee;\n  overflow-x: hidden;\n}\n\n#ar-viewer #ar-button {\n  background-image: url(data:image/png;base64,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);\n  background-repeat: no-repeat;\n  background-size: 20px 20px;\n  background-position: 12px 50%;\n  background-color: #fff;\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  white-space: nowrap;\n  bottom: 132px;\n  padding: 0px 16px 0px 40px;\n  font-size: 14px;\n  color: #4285f4;\n  height: 36px;\n  line-height: 36px;\n  border-radius: 18px;\n  border: 1px solid #dadce0;\n}\n\n#ar-viewer #ar-button:active {\n  background-color: #e8eaed;\n}\n\n#ar-viewer #ar-button:focus {\n  outline: none;\n}\n\n#ar-viewer #ar-button.focus-visible {\n  outline: 1px solid #4285f4;\n}\n\n#ar-viewer #ar-button:focus-visible {\n  outline: 1px solid #4285f4;\n}\n\n@keyframes circle {\n  from {\n    transform: translateX(-50%) rotate(0deg) translateX(50px) rotate(0deg);\n  }\n  to {\n    transform: translateX(-50%) rotate(360deg) translateX(50px) rotate(-360deg);\n  }\n}\n\n@keyframes elongate {\n  from {\n    transform: translateX(100px);\n  }\n  to {\n    transform: translateX(-100px);\n  }\n}\n\n#ar-viewer model-viewer > #ar-prompt {\n  position: absolute;\n  left: 50%;\n  bottom: 0px;\n  animation: elongate 2s infinite ease-in-out alternate;\n  display: none;\n}\n\n#ar-viewer model-viewer[ar-status='session-started'] > #ar-prompt {\n  display: block;\n  visibility: visible;\n}\n\n#ar-viewer model-viewer > #ar-prompt > img {\n  animation: circle 4s linear infinite;\n}\n\n#ar-viewer model-viewer > #ar-failure {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  bottom: 175px;\n  display: none;\n}\n\n#ar-viewer model-viewer[ar-tracking='not-tracking'] > #ar-failure {\n  display: block;\n}\n\n#ar-viewer .slider {\n  width: 100%;\n  text-align: center;\n  overflow: hidden;\n  position: absolute;\n  bottom: 16px;\n}\n\n#ar-viewer .slides {\n  display: flex;\n  overflow-x: auto;\n  scroll-snap-type: x mandatory;\n  scroll-behavior: smooth;\n  -webkit-overflow-scrolling: touch;\n}\n\n#ar-viewer .slide {\n  scroll-snap-align: start;\n  flex-shrink: 0;\n  width: 100px;\n  height: 100px;\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: center;\n  background-color: #fff;\n  margin-right: 10px;\n  border-radius: 10px;\n  border: none;\n  display: flex;\n}\n\n#ar-viewer .slide.selected {\n  border: 2px solid #4285f4;\n}\n\n#ar-viewer .slide:focus {\n  outline: none;\n}\n\n#ar-viewer .slide.focus-visible {\n  outline: 1px solid #4285f4;\n}\n\n#ar-viewer .slide:focus-visible {\n  outline: 1px solid #4285f4;\n}\n";
 styleInject(css_248z);
 
+var LOG = getLogger('Planner', 'PlannerRTV');
 var PlannerRTV = function PlannerRTV() {
   var _ref, _viewHandler$uiState$, _viewHandler$divaWebP;
   var viewHandler = useViewHandler();
@@ -87,18 +88,27 @@ var PlannerRTV = function PlannerRTV() {
     var messageListener = function messageListener(event) {
       if (!iframeRef.current) return;
       if (event.data.type === 'AR_READY' && viewHandler.productState.doShowARQRCode) {
+        LOG.debug('[AR-DEBUG-PARENT] PlannerRTV received AR_READY, currentBlob:', !!currentBlob.current);
         iframeRef.current.style.zIndex = '10000';
         iframeRef.current.style.position = 'fixed';
         iframeRef.current.style.opacity = '1';
         viewHandler.productState.setIsARIframeVisible(true);
         actions.closeModal();
+        if (currentBlob.current) {
+          var _contentWindow;
+          LOG.debug('[AR-DEBUG-PARENT] PlannerRTV resending SET_AR_OBJECT on AR_READY, blob size:', currentBlob.current.size);
+          (_contentWindow = iframeRef.current.contentWindow) === null || _contentWindow === void 0 || _contentWindow.postMessage({
+            type: 'SET_AR_OBJECT',
+            payload: currentBlob.current
+          }, '*');
+        }
       }
       if (event.data.type === 'AR_CLOSE') {
         // the iframe tells us that the modal can be closed
         viewHandler.productState.setIsARIframeVisible(false);
         viewHandler.productState.setDoShowARQRCode(false);
         iframeRef.current.style.zIndex = '0';
-        iframeRef.current.style.position = 'unset';
+        iframeRef.current.style.position = 'absolute';
         iframeRef.current.style.opacity = '0';
         iframeRef.current.src = arViewerUrl;
         setIsInModelViewer(false);
@@ -112,8 +122,10 @@ var PlannerRTV = function PlannerRTV() {
   }, []);
   useEffect(function () {
     //instead of the modal, we need to bring the iframe to the front
+    LOG.debug('[AR-DEBUG-PARENT] PlannerRTV useEffect doShowARQRCode:', viewHandler.productState.doShowARQRCode, 'arViewerIframe:', arViewerIframe, 'currentBlob:', !!currentBlob.current, 'iframeRef:', !!iframeRef.current);
     if (arViewerIframe && viewHandler.productState.doShowARQRCode && currentBlob.current) {
-      var _iframeRef$current;
+      var _currentBlob$current, _iframeRef$current;
+      LOG.debug('[AR-DEBUG-PARENT] PlannerRTV sending SET_AR_OBJECT via useEffect, blob size:', (_currentBlob$current = currentBlob.current) === null || _currentBlob$current === void 0 ? void 0 : _currentBlob$current.size);
       iframeRef.current.style.zIndex = '10000';
       iframeRef.current.style.position = 'fixed';
       iframeRef.current.style.opacity = '1';
@@ -157,9 +169,11 @@ var PlannerRTV = function PlannerRTV() {
             return _regeneratorRuntime.wrap(function _callee$(_context) {
               while (1) switch (_context.prev = _context.next) {
                 case 0:
+                  LOG.debug('[AR-DEBUG-PARENT] PlannerRTV setGlb called, glb:', !!glb, 'glb size:', glb === null || glb === void 0 ? void 0 : glb.size, 'arViewerIframe:', arViewerIframe, 'iframeRef:', !!iframeRef.current);
                   if (arViewerIframe && iframeRef.current && glb) {
                     // we serialize the glb to base64 and send it to the iframe
                     currentBlob.current = glb;
+                    LOG.debug('[AR-DEBUG-PARENT] PlannerRTV sending SET_AR_OBJECT via setGlb');
                     (_iframeRef$current2 = iframeRef.current) === null || _iframeRef$current2 === void 0 || (_iframeRef$current2 = _iframeRef$current2.contentWindow) === null || _iframeRef$current2 === void 0 || _iframeRef$current2.postMessage({
                       type: 'SET_AR_OBJECT',
                       payload: glb
@@ -169,7 +183,7 @@ var PlannerRTV = function PlannerRTV() {
                     url = URL.createObjectURL(glb);
                     viewHandler.productState.glbUrl = url;
                   }
-                case 1:
+                case 2:
                 case "end":
                   return _context.stop();
               }

package/build/esm/{index-4f1bfdab.js → index-be1508a5.js}

@@ -1,10 +1,10 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
 import { useState, useCallback, useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
 import { ContentBoxComponent } from '@crystaldesign/content-box';
-import SettingsHeader from './index-9c685201.js';
+import SettingsHeader from './index-3d410951.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';