@crystaldesign/diva-web-planner-react 26.1.0-beta.9 → 26.1.0-rc.0

package/build/esm/index-d88eadea.js

@@ -1,146 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-cd45012e.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useState } from 'react';
-import { w as wcSize, d as wcSizeSmall, e as wcImagePlaceHolder, b as wcImage, t as textContainer, f as big, c as wcConfiguratorSettingsTitle, m as metaData, g as ccConstructionWarning, p as paletteItem, s as sel } from './index.module-010b8049.js';
-import { w as wcFavoriteSel, a as wcFavorite } from './index.module-34a71a62.js';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import IsActive from './index-87d30a2b.js';
-import { useHover, useLayer } from 'react-laag';
-import MetaData from './index-93fc79fe.js';
-import GenericToolTip from './index-53a6a43f.js';
-import InfoIcon from './index-25e88b72.js';
-import PricePreview from './index-c9d44d68.js';
-import ReverseCheck from './index-448e3c88.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-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 './index-3a0e3e76.js';
-import 'react-countup';
-import '@mui/icons-material/Block';
-import '@mui/icons-material/Warning';
-
-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 Option = function Option(_ref) {
-  var _renderLayer;
-  var itemP = _ref.item,
-    paletteId = _ref.paletteId,
-    hidePricePreview = _ref.hidePricePreview,
-    namePostFix = _ref.namePostFix;
-  var item = itemP;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var onClick = function onClick() {
-    if (item.doShowFav) {
-      viewHandler.paletteViewHandler.clickedOnFavIcon(item);
-    }
-    viewHandler.paletteViewHandler.clickedOnConfigPalette(item, undefined, paletteId);
-  };
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$state$di = _useDivaCore.state.dimensions,
-    isMobile = _useDivaCore$state$di.isMobile,
-    isTablet = _useDivaCore$state$di.isTablet;
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    metaDataVisible = _useState2[0],
-    setMetaDataVisible = _useState2[1];
-
-  /* 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.image || item.hexColor) && !item.contentItemId) {
-    isOver = hover[0];
-    hoverProps = hover[1];
-    triggerProps = tooltip.triggerProps;
-    layerProps = tooltip.layerProps;
-    renderLayer = tooltip.renderLayer;
-  }
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread(_objectSpread({
-    id: item.codex,
-    "data-test-id": "plannerPaletteItem",
-    className: classnames(paletteItem, item.sel ? sel : undefined),
-    onClick: onClick
-  }, triggerProps), hoverProps), {}, {
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classnames(wcSize, wcSizeSmall),
-      children: [item.sel && /*#__PURE__*/jsx(IsActive, {
-        listenToOptionVariables: true
-      }), item.contentItemId && /*#__PURE__*/jsx(InfoIcon, {
-        item: item,
-        style: {
-          bottom: 8
-        }
-      }, item.codex), item.layout == 'TEXT' && /*#__PURE__*/jsx("div", {
-        className: wcImagePlaceHolder
-      }), !(item.layout == 'TEXT') && /*#__PURE__*/jsx("div", {
-        className: wcImage,
-        style: {
-          backgroundImage: "url(".concat(item.image, ")")
-        }
-      }), /*#__PURE__*/jsxs("div", {
-        className: classnames(textContainer, item.layout == 'TEXT' ? big : undefined),
-        children: [/*#__PURE__*/jsx("div", {
-          className: classnames(wcConfiguratorSettingsTitle, metaDataVisible !== '' ? metaData : undefined),
-          dangerouslySetInnerHTML: {
-            __html: item.text + (namePostFix ? namePostFix : '')
-          }
-        }), /*#__PURE__*/jsx(MetaData, {
-          style: {
-            position: 'relative',
-            "float": 'left'
-          },
-          metaData: item.metaData,
-          visible: [metaDataVisible, setMetaDataVisible]
-        }, item.codex)]
-      }), isOver && ((_renderLayer = renderLayer) === null || _renderLayer === void 0 ? void 0 : _renderLayer(/*#__PURE__*/jsx(GenericToolTip, {
-        text: item.text + (item.freeText ? item.freeText : '') + (namePostFix ? namePostFix : ''),
-        desciption: metaDataVisible,
-        image: item.image,
-        hexColor: item.hexColor,
-        pricePreviewPromise: item.pricePreviewPromise,
-        layerProps: layerProps
-      }, item.codex))), item.doShowFav && /*#__PURE__*/jsx("div", {
-        className: item.isFav ? wcFavoriteSel : wcFavorite
-      })]
-    }), !hidePricePreview && item.pricePreviewPromise !== undefined && /*#__PURE__*/jsx(PricePreview, {
-      asyncPricePreview: item.pricePreviewPromise,
-      sel: item.sel
-    }), item.checkForReversingChanges !== undefined && /*#__PURE__*/jsx(ReverseCheck, {
-      item: item,
-      paletteId: paletteId
-    }), item.disabledByConstructionRule && /*#__PURE__*/jsx("div", {
-      className: classnames(ccConstructionWarning),
-      title: t('configurator.' + item.disabledByConstructionRule)
-    })]
-  }));
-};
-var Option$1 = observer(Option);
-
-export { Option$1 as default };

package/build/esm/index-d9f486d6.js

@@ -1,125 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject } from './index-cd45012e.js';
-import { observer } from 'mobx-react-lite';
-import AccessoiresStandard from './index-757ee297.js';
-import 'react';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/slicedToArray';
-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';
-import 'react-laag';
-import './index-93fc79fe.js';
-import './index-53a6a43f.js';
-import './index-c9d44d68.js';
-import './index-3a0e3e76.js';
-import 'react-countup';
-import './index-38f5feb3.js';
-import 'react-collapsible';
-import './index-b278b421.js';
-import './index-47d2685a.js';
-import 'sift';
-import './index-28d13ecf.js';
-import './index-2a0324db.js';
-import './index-3ace4db9.js';
-import './index-cbfbe30a.js';
-import './index-eb2c0b45.js';
-import './index.module-eea6e071.js';
-import './index-51eebc96.js';
-import 'react-switch';
-import './index-25e88b72.js';
-import './index-448e3c88.js';
-import '@mui/icons-material/Block';
-import '@mui/icons-material/Warning';
-import './index-3c9a7def.js';
-import 'react-dropdown';
-import './index-77d4346b.js';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-99841144.js';
-import './index-d03d86fe.js';
-import './index-57a09c90.js';
-import '@crystaldesign/content-box';
-import './index-d3fe36ae.js';
-import './index-b53b715c.js';
-import './index-1ed90180.js';
-import './index-1c7e23d5.js';
-import './index-7ec6bb7f.js';
-import './index-af515f92.js';
-import './index-e7939fa7.js';
-import './index-3d27b082.js';
-import './index-343d4b3f.js';
-import './index.module-34a71a62.js';
-import './index-87d30a2b.js';
-import './index-9e9c4e1b.js';
-import './index-36da4300.js';
-import './index-e2242739.js';
-import './index-1e91a831.js';
-import './index.module-010b8049.js';
-import './index-e1ba58f5.js';
-import './index-a55b9c2d.js';
-import './index-432f9ea2.js';
-import './index-20685cfa.js';
-import './index-b74de1f7.js';
-import './index-874bd4cf.js';
-import './index-ad1217cf.js';
-import './index-15cc3ec6.js';
-import './index-34127326.js';
-import './index-82d8a3d4.js';
-import './index-f79201ed.js';
-import 'swiper/react';
-import 'swiper/modules';
-import './index-8ffa080a.js';
-import 'rc-slider';
-import './index-303501f3.js';
-import './index-a61a740d.js';
-import './index-0e314b39.js';
-import './index-c15d11cc.js';
-import 'react-confetti-explosion';
-import './index-49e26d0a.js';
-import './index-d77cbc29.js';
-import './index-13c0325b.js';
-import 'react-qr-code';
-import './index-b2c111da.js';
-import './useCustomDimensions-e219a1d3.js';
-import './index-b052b27c.js';
-import './ussIsSticky-a1412c50.js';
-import './index-da59e873.js';
-import './index-727d0070.js';
-import './index-826cdc95.js';
-import './index.module-78c248cb.js';
-import './index-70b99b2d.js';
-import './index-b7243348.js';
-import './index-b87c7148.js';
-
-var wcAccInfoContainer = "wcAccInfoContainer-gHZnB";
-var wcConfiguratorSettingsTitle = "wcConfigurator-settings-title--6avT";
-var wrapper = "wrapper-mM-Et";
-var css_248z = ".wcAccInfoContainer-gHZnB {\n  float: left;\n  position: relative;\n  height: 100%;\n  max-width: 160px;\n}\n\n.wcConfigurator-settings-title--6avT {\n  display: -webkit-box;\n  float: left;\n  max-height: 150px;\n  min-height: 16px;\n  margin-top: 8px;\n  max-width: 100%;\n  color: var(--secondaryColor);\n  font-size: 20px;\n  font-weight: 300;\n  line-height: 20.8px;\n  overflow: hidden;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  position: relative;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  z-index: 100;\n}\n\n.wcConfigurator-settings-title--6avT:hover {\n  max-height: 608px;\n  -webkit-line-clamp: 30;\n  overflow: visible;\n  background: #fff;\n  z-index: 150;\n}\n\n.wrapper-mM-Et {\n  --infoIconSize: 22px;\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 AccessoiresSerious = function AccessoiresSerious(props) {
-  return /*#__PURE__*/jsx(AccessoiresStandard, _objectSpread(_objectSpread({}, props), {}, {
-    wcAccInfoContainerClass: wcAccInfoContainer,
-    wrapper: wrapper,
-    wcConfiguratorSettingsTitleClass: wcConfiguratorSettingsTitle,
-    hidePrice: true,
-    hideSize: true
-  }));
-};
-var index = observer(AccessoiresSerious);
-
-export { index as default };

package/build/esm/index-da59e873.js

@@ -1,48 +0,0 @@
-import { u as useViewHandler } from './index-cd45012e.js';
-import 'react';
-import { observer } from 'mobx-react-lite';
-import RoomGallery from './index-727d0070.js';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'swiper/react';
-import 'swiper/modules';
-import './index-826cdc95.js';
-import './index.module-78c248cb.js';
-import './index-25e88b72.js';
-import './index-70b99b2d.js';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-b7243348.js';
-import './index-b87c7148.js';
-
-var AiRoomsSelection = function AiRoomsSelection(props) {
-  var _viewHandler$aiState$;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    user = _useDivaCore.state.user;
-  if (!viewHandler.aiState.showAiRoomRenderingInSummary || !viewHandler.viewPlannerHandler.isAny3DVisualization() || (!user ? !viewHandler.aiState.shouldShowAiForAnonymous : !viewHandler.aiState.isAnyLimitDefined) || !((_viewHandler$aiState$ = viewHandler.aiState.enrichedAiRoomRenderings) !== null && _viewHandler$aiState$ !== void 0 && _viewHandler$aiState$.length)) return /*#__PURE__*/jsx(Fragment, {});
-
-  // Use enriched items from AI state (computed property with all callbacks and current state)
-  return /*#__PURE__*/jsx(RoomGallery, {
-    roomItems: viewHandler.aiState.enrichedAiRoomRenderings,
-    selectedRoom: viewHandler.aiState.selectedRoom
-  });
-};
-var AiRoomsSelection$1 = observer(AiRoomsSelection);
-
-export { AiRoomsSelection$1 as default };

package/build/esm/index-dc7aa319.js

@@ -1,200 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-cd45012e.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useRef, useEffect } from 'react';
-import { useTranslation, useDivaCore } 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 verticalItem = "verticalItem-NmQDx";
-var wcSpan = "wcSpan-0wnmJ";
-var verticalItemPoligon = "verticalItemPoligon-M44lA";
-var wcActiveStep = "wcActiveStep-ykv3D";
-var wcVisitedStep = "wcVisitedStep-qDdfW";
-var wcStepIcon = "wcStepIcon-7hz1S";
-var css_248z = ".verticalItem-NmQDx {\n  font-size: 12px;\n  width: 100%;\n  line-height: 14px;\n  height: 3.5rem;\n  letter-spacing: 0.3px;\n  -webkit-font-smoothing: antialiased;\n  -webkit-text-stroke: 0.4px;\n  background-image: none;\n  text-align: center;\n  vertical-align: top;\n  zoom: 1;\n  box-sizing: content-box;\n  position: relative;\n  display: inline-block;\n  cursor: pointer;\n  color: #000;\n  color: var(--tabGroupStepVisitedFont, #000);\n}\n\n.wcSpan-0wnmJ {\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  position: absolute;\n  font-size: 12px;\n  line-height: 14px;\n  height: 3.5rem;\n  letter-spacing: 0.3px;\n  -webkit-font-smoothing: antialiased;\n  -webkit-text-stroke: 0.4px;\n  background-image: none;\n  text-align: center;\n  display: block;\n  width: 100%;\n}\n\n.verticalItemPoligon-M44lA {\n  fill: var(--thirdColor);\n  fill: var(--tabGroupStep, var(--thirdColor));\n  transition:\n    fill 0.3s ease,\n    color 0.3s ease;\n}\n.verticalItemPoligon-M44lA.wcActiveStep-ykv3D {\n  fill: var(--primaryColor);\n  fill: var(--tabGroupStepActive, var(--primaryColor));\n  color: white;\n}\n/* .verticalItemPoligon.wcVisitedStep {\n  border: #b1b1b1 1px solid;\n} */\n\n.verticalItemPoligon-M44lA.wcVisitedStep-qDdfW {\n  fill: #b1b1b1;\n  fill: var(--tabGroupStepVisited, #b1b1b1);\n}\n.verticalItemPoligon-M44lA.wcActiveStep-ykv3D:hover {\n  fill: var(--primaryColor);\n  fill: var(--tabGroupStepActive, var(--primaryColor));\n}\n\n.verticalItemPoligon-M44lA:hover,\n.verticalItemPoligon-M44lA.wcVisitedStep-qDdfW:hover {\n  fill: #bbbbbb;\n  fill: var(--tabGroupStepHover, #bbbbbb);\n}\n\n.wcStepIcon-7hz1S {\n  display: block;\n  background-color: #000;\n  background-color: var(--tabGroupStepVisitedFont, #000);\n  background-position: center center;\n  width: 42px;\n  height: 42px;\n  margin: auto;\n  -webkit-mask-size: contain;\n  -webkit-mask-repeat: no-repeat;\n}\n\n.wcActiveStep-ykv3D .wcStepIcon-7hz1S {\n  background-color: white;\n}\n";
-styleInject(css_248z);
-
-var getIconOfTabGroup = function getIconOfTabGroup(tabGroup, baseCdnUrl, tabGroupObj) {
-  var sirvURL = baseCdnUrl + '/static/images/TabIcons/';
-  if (tabGroupObj) {
-    if (tabGroupObj[tabGroup.toLowerCase()]) return sirvURL + tabGroupObj[tabGroup.toLowerCase()];else if (tabGroupObj[tabGroup]) return sirvURL + tabGroupObj[tabGroup];
-  }
-  switch (tabGroup) {
-    case 'StaticRoomList':
-      return sirvURL + 'room.svg';
-    case 'Planner':
-    case 'PRODUCTS':
-    case 'PROMOTED':
-      return sirvURL + 'planner.svg';
-    case 'Summary':
-      return sirvURL + 'summary.svg';
-    case 'Piede':
-    case 'pieds':
-    case 'Fuss':
-    case 'Fuß':
-    case 'Fu':
-    case 'Fsse':
-      return sirvURL + 'feet.svg';
-    case 'Testiera':
-    case 'tte de lit':
-    case 'Kopfteil':
-    case 'Headboard':
-      return sirvURL + 'bed_headboard.svg';
-    case 'materasso':
-    case 'matelas':
-    case 'Matratze':
-    case 'Matratze Zubehr':
-      return sirvURL + 'mattress.svg';
-    case 'dimensioni':
-    case 'dimension':
-    case 'Grsse':
-      return sirvURL + 'dimensions.svg';
-    case 'Topper':
-    case 'surmatelas':
-      return sirvURL + 'topper.svg';
-    case 'Telaio inferiore':
-    case 'box':
-    case 'Untergestell':
-    case 'Box/Untergestell':
-    case 'BoxUntergestell':
-    case 'Box  Bettrahmen':
-    case 'box  cadre de lit':
-    case 'Box':
-    case 'Box inkl Grsse':
-      return sirvURL + 'bed_underframe.svg';
-    case 'Visualizzazione':
-    case 'visualisation':
-    case 'Visualisierung':
-      return sirvURL + 'bed_visualization.svg';
-    case 'Rivestimento':
-    case 'tissu dco':
-    case 'Bezug':
-    case 'Stoff':
-      return sirvURL + 'upholstery.svg';
-    case 'Sitz':
-    case 'Sitztiefe':
-      return sirvURL + 'seat.svg';
-    case 'Armlehne':
-      return sirvURL + 'armrest.svg';
-    case 'ACCESSOIRES':
-      return sirvURL + 'additionalArticles.svg';
-    case 'Rcken':
-      return sirvURL + 'sofaBackrest.svg';
-    case 'Konfiguration':
-      return sirvURL + 'material_config.svg';
-    case 'Zustand':
-      return sirvURL + 'settings_suggest.svg';
-  }
-  return undefined;
-};
-
-var VerticalTabGroupItemStandard = function VerticalTabGroupItemStandard(_ref) {
-  var _getIconOfTabGroup;
-  var tabGroup = _ref.tabGroup,
-    height = _ref.height,
-    _ref$minHeight = _ref.minHeight,
-    minHeight = _ref$minHeight === void 0 ? 80 : _ref$minHeight,
-    isFirstItem = _ref.isFirstItem,
-    isLastItem = _ref.isLastItem,
-    _ref$wcVisitedStepCla = _ref.wcVisitedStepClass,
-    wcVisitedStepClass = _ref$wcVisitedStepCla === void 0 ? wcVisitedStep : _ref$wcVisitedStepCla,
-    _ref$wcActiveStepClas = _ref.wcActiveStepClass,
-    wcActiveStepClass = _ref$wcActiveStepClas === void 0 ? wcActiveStep : _ref$wcActiveStepClas,
-    _ref$verticalItemPoli = _ref.verticalItemPoligonClass,
-    verticalItemPoligonClass = _ref$verticalItemPoli === void 0 ? verticalItemPoligon : _ref$verticalItemPoli,
-    _ref$wcStepIconClass = _ref.wcStepIconClass,
-    wcStepIconClass = _ref$wcStepIconClass === void 0 ? wcStepIcon : _ref$wcStepIconClass,
-    lastItemDiv = _ref.lastItemDiv;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var width = 128;
-  var tabGroupItemRef = useRef(null);
-  var curTabGroup = viewHandler.tabGroupState.curTabGroup;
-  if (height < minHeight) {
-    height = minHeight;
-  }
-  var _useDivaCore = useDivaCore(),
-    baseCdnUrl = _useDivaCore.state.apiConfig.baseCdnUrl;
-  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 tabGroupActive = tabGroup.posNr == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.posNr);
-  var tabGroupVisited = viewHandler.tabGroupAlreadyVisited(tabGroup) && !(tabGroup.posNr == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.posNr));
-  var polygonPoints;
-  if (isFirstItem && isLastItem) {
-    polygonPoints = '0 ' + height + ', 0 0, ' + width + ' 0, ' + width + ' ' + height + ', ' + '64 ' + height;
-  } else if (isFirstItem) {
-    polygonPoints = '0 ' + (height - 8) + ', 0 0, ' + width + ' 0, ' + width + ' ' + (height - 8) + ', ' + '64 ' + height;
-  } else if (isLastItem) {
-    polygonPoints = '0 ' + height + ', 0 0, 64 8, ' + width + ' 0, ' + width + ' ' + height;
-  } else {
-    polygonPoints = '0 ' + (height - 8) + ', 0 0, 64 8, ' + width + ' 0, ' + width + ' ' + (height - 8) + ', 64 ' + height;
-  }
-  var icon = (_getIconOfTabGroup = getIconOfTabGroup(tabGroup.key, baseCdnUrl, viewHandler.getViewConfig().tabGroupsIcons)) !== null && _getIconOfTabGroup !== void 0 ? _getIconOfTabGroup : '';
-  var div = /*#__PURE__*/jsxs("div", {
-    "data-test-id": "tabGroupItem",
-    children: [/*#__PURE__*/jsx("div", {
-      className: wcStepIconClass,
-      style: {
-        WebkitMaskImage: 'url(' + icon + ')',
-        maskImage: 'url(' + icon + ')'
-      }
-    }), /*#__PURE__*/jsx("span", {
-      "data-test-id": "tabGroupItemTitle",
-      children: t('configurator.' + tabGroup.title, tabGroup.title)
-    })]
-  });
-  if (isLastItem && lastItemDiv) {
-    div = lastItemDiv;
-  }
-  return /*#__PURE__*/jsxs("svg", {
-    "data-test-id": "tabGroupItemSvg",
-    viewBox: '0 0 ' + width + ' ' + height,
-    ref: tabGroupItemRef,
-    style: {
-      height: height + 'px',
-      minHeight: minHeight
-    },
-    onClick: function onClick() {
-      return onTabGroupClick(tabGroup);
-    },
-    className: classnames(verticalItem, tabGroupActive ? wcActiveStepClass : undefined, tabGroupVisited ? wcVisitedStepClass : undefined),
-    children: [/*#__PURE__*/jsx("polygon", {
-      className: classnames(verticalItemPoligonClass, tabGroupActive ? wcActiveStepClass : undefined, tabGroupVisited ? wcVisitedStepClass : undefined),
-      points: polygonPoints
-    }), /*#__PURE__*/jsx("foreignObject", {
-      width: "100%",
-      height: "100%",
-      style: {
-        pointerEvents: 'none'
-      },
-      children: /*#__PURE__*/jsx("span", {
-        className: classnames(wcSpan, verticalItemPoligonClass, tabGroupActive ? wcActiveStepClass : undefined, tabGroupVisited ? wcVisitedStepClass : undefined),
-        children: div
-      })
-    })]
-  });
-};
-var VerticalTabGroupItemStandard$1 = observer(VerticalTabGroupItemStandard);
-
-export { VerticalTabGroupItemStandard$1 as default };