@crystaldesign/diva-web-planner-react 26.2.0-beta.9 → 26.3.0-beta.1

package/build/esm/{index-5d2f2301.js → index-74874df7.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-68d9a6a8.js → index-752e5db5.js}

@@ -1,7 +1,7 @@
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import { useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
-import ToolContainer from './index-7789ad78.js';
+import ToolContainer from './index-b7fe6257.js';
 import { useDivaCore, DivaUtils } from '@crystaldesign/diva-core';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -21,53 +21,53 @@ import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-8a72f9f8.js';
-import './index.module-7e24f7b6.js';
-import './index-18a879e2.js';
-import './index-ceb1dd12.js';
-import './index-1524388e.js';
-import './index-77b5c3b4.js';
+import './index-e285f80b.js';
+import './index.module-b43b8d52.js';
+import './index-809f8e27.js';
+import './index-7de87e0f.js';
+import './index-4a16484d.js';
+import './index-d5daa2fa.js';
 import 'react-collapsible';
-import './index-a5a34d1d.js';
-import './index-5c641079.js';
-import './index-b85fc604.js';
-import './index.module-190de42d.js';
+import './index-c6d8db42.js';
+import './index-e4939d5f.js';
+import './index-49486eb0.js';
+import './index.module-18ad9889.js';
 import 'react-json-view-lite';
-import './react-json-viewer-ef9e2306.js';
-import './index-df9b3647.js';
-import './index.module-03645e57.js';
-import './DecisionVizualizer-89577f34.js';
+import './react-json-viewer-5407e783.js';
+import './index-60fe4881.js';
+import './index.module-479db5cd.js';
+import './DecisionVizualizer-e1ecdcb0.js';
 import 'react-draggable';
-import './index-558a327a.js';
+import './index-18be7f2d.js';
 import 'react-switch';
-import './index-41cfee3a.js';
-import './index-a40abf47.js';
-import './index-85ae111e.js';
+import './index-2928e679.js';
+import './index-32a60d12.js';
+import './index-6d79a4a9.js';
 import 'jsoneditor';
-import './index-fb3b236e.js';
-import './index-3d405cba.js';
-import './index-2da29b48.js';
-import './index-cccb09a5.js';
-import './index-80adb273.js';
-import './index-7ba08510.js';
-import './index-f7cb8bcc.js';
-import './index-e3c9a9ff.js';
-import './index.module-dbe3f684.js';
+import './index-e0dbe868.js';
+import './index-59ce6d10.js';
+import './index-dfab88a3.js';
+import './index-f5cfabc4.js';
+import './index-c48b6a03.js';
+import './index-496e3304.js';
+import './index-fea80a52.js';
+import './index-dc5d569c.js';
+import './index.module-243cb4c5.js';
 import 'react-select';
-import './index-583edf26.js';
-import './index-964dd149.js';
-import './index-b8716d73.js';
-import './index-8ca22143.js';
-import './index-8934cf1a.js';
-import './index-e8c03f55.js';
-import './index-7453c00f.js';
-import './index-78849698.js';
-import './index-ceed16fe.js';
-import './CatalogProperties-1eba8880.js';
-import './ArticleProperties-e8030da8.js';
-import './OptionProperties-ea9ddfa4.js';
-import './OptionValueProperties-db60f32f.js';
-import './index-7957e5ee.js';
+import './index-219a18ca.js';
+import './index-6c87e0d6.js';
+import './index-7f4d692a.js';
+import './index-60481ffe.js';
+import './index-48c42fdb.js';
+import './index-5125e16d.js';
+import './index-1478a3f9.js';
+import './index-ad4e224e.js';
+import './index-e444100a.js';
+import './CatalogProperties-5c979bad.js';
+import './ArticleProperties-48f25dd7.js';
+import './OptionProperties-557bc494.js';
+import './OptionValueProperties-ca520443.js';
+import './index-2370714d.js';
 
 var container = "container-43rJg";
 var item = "item-JRY9h";

package/build/esm/{index-f9d36bb5.js → index-7597da43.js}

@@ -1,16 +1,16 @@
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import classnames from 'classnames';
 import { useEffect } from 'react';
-import Inputbox from './index-8a1cb871.js';
-import Product from './index-657568e0.js';
-import Settings from './index-8dc0196f.js';
-import NavigationButtons from './index-23e811ee.js';
-import ActionBasket from './index-0da50a91.js';
-import TabGroup from './index-800d4c11.js';
+import Inputbox from './index-6fd214c8.js';
+import Product from './index-8feebad0.js';
+import Settings from './index-6aede271.js';
+import NavigationButtons from './index-988730ce.js';
+import ActionBasket from './index-f2256647.js';
+import TabGroup from './index-7ba68a2b.js';
 import { observer } from 'mobx-react-lite';
-import BasketMobile from './index-0b25811e.js';
+import BasketMobile from './index-d65bd8ac.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import ProgressBar from './index-9006db5b.js';
+import ProgressBar from './index-a7ccd8f2.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
@@ -28,99 +28,104 @@ import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-72e88839.js';
-import './index-02140c47.js';
-import './index-41944f48.js';
-import './index-609a881a.js';
+import './index-c315fd0c.js';
+import './index-a3d552e1.js';
+import './index-eddd34ec.js';
+import './index-f1de68f3.js';
+import './index-2bff13ae.js';
+import './index-687d21e8.js';
 import 'sift';
-import './index-25f0279e.js';
-import './index-1413b7b5.js';
-import './index-cfc78c5d.js';
-import './index-4ca17ada.js';
-import './index.module-92f197f4.js';
-import './index-558a327a.js';
+import './index-37cc1c62.js';
+import './index-8ff15f88.js';
+import './index-02477b38.js';
+import './index-63a4ebb5.js';
+import './index.module-b4fbe081.js';
+import './index-18be7f2d.js';
 import 'react-switch';
-import './index-e79083e3.js';
-import './index-b1f8edd3.js';
-import './index-8338a16a.js';
+import './index-7c78aae2.js';
+import './index-a5e33da2.js';
+import './index-2e00d43f.js';
 import 'react-countup';
-import './index-8aea21af.js';
+import './index-f8343613.js';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';
-import './index-9b3733cb.js';
+import './index-2e9da43b.js';
 import 'react-dropdown';
-import './index-d56d878a.js';
-import './index-e5f640c2.js';
-import './index-fb1ecc3f.js';
-import './index-c4d81862.js';
+import './index-25f42e1e.js';
+import './index-1e82c2dd.js';
+import './index-43149bac.js';
+import './index-6f68aaeb.js';
 import '@crystaldesign/content-box';
-import './index-5d2f2301.js';
-import './index-8423990d.js';
-import './index-29912620.js';
-import './index-c36c04e3.js';
-import './index-ae407386.js';
-import './index-3d9758f8.js';
-import './index-be028541.js';
-import './index-eda2bcff.js';
-import './index-0299c8a2.js';
+import './index-74874df7.js';
+import './index-6a3f6306.js';
+import './index-2c6e86d8.js';
+import './index-4d6128d4.js';
+import './index-b4774961.js';
+import './index-c56c8e81.js';
+import './index-684c1fee.js';
+import './index-3c9b8a98.js';
+import './index-96ea2ba0.js';
 import 'react-laag';
-import './index.module-e18423d9.js';
-import './index-13257278.js';
-import './index-a8a0dc46.js';
-import './index-99f1ea42.js';
-import './index-65451fb6.js';
-import './index-24f56cfc.js';
-import './index-f3c6aaaa.js';
-import './index.module-ac6aa014.js';
-import './index-4303ff4f.js';
-import './index-c357bb09.js';
-import './index-5be95985.js';
-import './index-0aa8c54f.js';
-import './index-ad092e32.js';
-import './index-249da195.js';
-import './index-3a77d246.js';
-import './index-29de2454.js';
-import './index-e8fdcad8.js';
-import './index-0f9174ab.js';
-import './index-12ca5093.js';
-import './index-6e91f433.js';
+import './index.module-c89cd70b.js';
+import './index-f74d0dff.js';
+import './index-5392864e.js';
+import './index-4c71a0dc.js';
+import './index-0e96a089.js';
+import './index-95af3b07.js';
+import './index-f0bd5022.js';
+import './index.module-4ad3e960.js';
+import './index-e76e879f.js';
+import './index-1483665b.js';
+import './index-cd2baa17.js';
+import './index-b770eff7.js';
+import './index-a0d7d644.js';
+import './index-394beb5b.js';
+import './index-bd9d9c5f.js';
+import './index-782feeee.js';
+import './index-4976cb21.js';
+import './index-790c6510.js';
+import './index-ed3f31cc.js';
+import './index-4702bba1.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './index-618482ce.js';
+import './index-b8a69c30.js';
 import 'rc-slider';
-import './index-5cc3c971.js';
-import './index-c5c58d55.js';
-import './index-fffb1417.js';
-import './index-906daad5.js';
+import './index-999d8a16.js';
+import './index-732cbd10.js';
+import './index-8456ce68.js';
+import './index-f3f1da2c.js';
+import './index-3291875b.js';
 import 'react-confetti-explosion';
-import './index-98a59015.js';
-import './index-4a1b34f8.js';
-import './index-2cc91315.js';
+import './index-b5d20631.js';
+import './index-42bf82a1.js';
+import './index-eb21dbeb.js';
 import 'react-qr-code';
-import './index-783e6849.js';
-import './useCustomDimensions-317ee643.js';
-import './index-a496d0ad.js';
-import './ussIsSticky-f6c25509.js';
-import './index-b455dc07.js';
-import './index-decb07cd.js';
-import './index-9f433f4b.js';
-import './index.module-962c4d99.js';
-import './index-f0d58303.js';
-import './index-81765888.js';
-import './index-690cfe03.js';
-import './index-fc6af0e0.js';
-import './index.module-7b74e613.js';
-import './index-e6cc72a8.js';
-import './index-1b83ab12.js';
-import './index-33625bd2.js';
-import './index-30b56850.js';
+import './index-6b8fc182.js';
+import './useCustomDimensions-6b7417e6.js';
+import './index-7021ddce.js';
+import './ussIsSticky-ff311f1e.js';
+import './index-9487e7b8.js';
+import './index-e28c99b1.js';
+import './index-67a73107.js';
+import './index.module-2de51454.js';
+import './index-0c82bb51.js';
+import './index-d94dc7b8.js';
+import './index-474b3538.js';
+import './index-e3be6263.js';
+import '@crystaldesign/diva-web-planner-react/model';
+import './index-5b1091f4.js';
+import './index.module-297fdc67.js';
+import './index-97e972c6.js';
+import './index-4da494ed.js';
+import './index-860ff0d7.js';
+import './index-e76b0809.js';
 import '@mui/material';
-import './index-2ed1a786.js';
-import './index-1ca7b5bc.js';
-import './index-81eafeab.js';
-import './index-b93095d5.js';
-import './index-5abd60fe.js';
-import './index-b541ce51.js';
+import './index-3e38c3b1.js';
+import './index-1c0a3b31.js';
+import './index-e9fbc343.js';
+import './index-cedd70b1.js';
+import './index-137fc097.js';
+import './index-c6026e26.js';
 
 var wcConfigurator = "wcConfigurator-8WNGD";
 var landscape = "landscape-fycCb";

package/build/esm/{index-ff1b15f2.js → index-7799ae72.js}

@@ -1,6 +1,6 @@
-import { u as useViewHandler } from './index-6f93775d.js';
+import { u as useViewHandler } from './index-74586774.js';
 import 'react';
-import { g as wcPlanner3DGrid } from './index.module-889ea24e.js';
+import { g as wcPlanner3DGrid } from './index.module-71d6c012.js';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-29de2454.js → index-782feeee.js}

@@ -1,15 +1,15 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useState } from 'react';
-import MetaData from './index-249da195.js';
-import InfoIcon from './index-e79083e3.js';
-import PricePreview from './index-b1f8edd3.js';
+import MetaData from './index-394beb5b.js';
+import InfoIcon from './index-7c78aae2.js';
+import PricePreview from './index-a5e33da2.js';
 import { useHover, useLayer } from 'react-laag';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import GenericToolTip from './index-a8a0dc46.js';
+import GenericToolTip from './index-5392864e.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@babel/runtime/helpers/objectWithoutProperties';
@@ -24,7 +24,7 @@ import '@crystaldesign/web-planner-logic';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
-import './index-8338a16a.js';
+import './index-2e00d43f.js';
 import 'react-countup';
 
 var articleItem = "article-item-eh-j4";

package/build/esm/{index-0f9174ab.js → index-790c6510.js}

@@ -1,5 +1,5 @@
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-af85140b.js → index-7b0df818.js}

@@ -1,4 +1,4 @@
-import { s as styleInject } from './index-6f93775d.js';
+import { s as styleInject } from './index-74586774.js';
 import 'react';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';

package/build/esm/{index-800d4c11.js → index-7ba68a2b.js}

@@ -1,13 +1,13 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.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-1ca7b5bc.js';
-import TabGroupVertical from './index-b93095d5.js';
-import TabSearch from './index-b541ce51.js';
+import TabGroupHorizontal from './index-1c0a3b31.js';
+import TabGroupVertical from './index-cedd70b1.js';
+import TabSearch from './index-c6026e26.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import 'react-dynamic-multi-render';
@@ -22,8 +22,8 @@ import '@crystaldesign/web-planner-logic';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
-import './index-81eafeab.js';
-import './index-5abd60fe.js';
+import './index-e9fbc343.js';
+import './index-137fc097.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
 
 var wcConfiguratorSteps = "wcConfigurator-steps-1pUS0";

package/build/esm/{index-e79083e3.js → index-7c78aae2.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import { useState, useEffect } from 'react';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';

package/build/esm/index-7d6d9208.js

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

package/build/esm/{index-ceb1dd12.js → index-7de87e0f.js}

@@ -1,7 +1,7 @@
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-6f93775d.js';
+import { s as styleInject, u as useViewHandler } from './index-74586774.js';
 import 'react';
 import { DivaUtils } from '@crystaldesign/diva-core';
 import { observer } from 'mobx-react-lite';
@@ -34,7 +34,7 @@ styleInject(css_248z);
 
 var _excluded = ["tabGroupOption", "basketId"];
 var TabGroupOptions = function TabGroupOptions(_ref) {
-  var _article$getArticleOp, _ops$val, _ops$valCodex;
+  var _article$getArticleOp, _Array$from$, _ops$val, _ops$valCodex;
   var tabGroupOption = _ref.tabGroupOption,
     basketId = _ref.basketId;
     _objectWithoutProperties(_ref, _excluded);
@@ -42,7 +42,7 @@ var TabGroupOptions = function TabGroupOptions(_ref) {
   var articles = viewHandler.divaWebPlanner.getDivaArticles();
   var article = articles === null || articles === void 0 ? void 0 : articles[basketId];
   var ops = article === null || article === void 0 || (_article$getArticleOp = article.getArticleOptionState) === null || _article$getArticleOp === void 0 ? void 0 : _article$getArticleOp.call(article, tabGroupOption.codex);
-  var posNr = Object.values(tabGroupOption.configSteps)[0].posNr;
+  var posNr = (_Array$from$ = Array.from(tabGroupOption.configSteps.values())[0]) === null || _Array$from$ === void 0 ? void 0 : _Array$from$.posNr;
   if (ops === undefined) return /*#__PURE__*/jsx(Fragment, {});
   var image = (_ops$val = ops.val) === null || _ops$val === void 0 ? void 0 : _ops$val.image;
   if (image) image = article === null || article === void 0 ? void 0 : article.CatalogData.getCatImageURL(image, '_low');else image = undefined;