@crystaldesign/diva-web-planner-react 25.2.0-beta.24 → 25.2.0-beta.26

package/build/esm/{index-8682b63d.js → index-07b10b1e.js}

@@ -1,12 +1,12 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-bfb7feaa.js';
+import { u as useViewHandler } from './index-26369cf6.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-d82688f0.js';
-import { S as SettingsItem, c as collapsableInner } from './index-1126206f.js';
-import ShelfAccessoires from './index-4636ea1e.js';
-import ShelfAccessoiresOld from './index-12e09e62.js';
-import GridList from './index-96baeb9a.js';
+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-d46325d9.js';
+import { S as SettingsItem, c as collapsableInner } from './index-3f68d24f.js';
+import ShelfAccessoires from './index-db784641.js';
+import ShelfAccessoiresOld from './index-37b64c18.js';
+import GridList from './index-99e96437.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
@@ -22,54 +22,54 @@ import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
 import 'sift';
-import './index-74b909f0.js';
-import './index-9eaf08a2.js';
-import './index-3f967125.js';
-import './index-8f55b825.js';
-import './index-f6061b2c.js';
-import './index.module-d66248ab.js';
-import './index-791084e3.js';
+import './index-aaecc267.js';
+import './index-37b4460b.js';
+import './index-bc80a5fa.js';
+import './index-a67c5e1c.js';
+import './index-1bbbf351.js';
+import './index.module-bd1f9a78.js';
+import './index-954fd231.js';
 import 'react-switch';
-import './index-e8678693.js';
-import './index-deba0462.js';
-import './index-01ebe54b.js';
+import './index-7a33b8a9.js';
+import './index-7a30a9e2.js';
+import './index-ad52c5fa.js';
 import 'react-dropdown';
-import './index-e33c141c.js';
+import './index-a4af85dc.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-88e6d823.js';
-import './index-35da1669.js';
-import './index-e80aafd9.js';
+import './index-61e96c92.js';
+import './index-82addab6.js';
+import './index-5aff36e1.js';
 import '@crystaldesign/content-box';
-import './index-3ad16ce9.js';
-import './index-e7abac8f.js';
-import './index-a87ffae6.js';
-import './index-903e604b.js';
-import './index-455a4267.js';
-import './index-51135c0c.js';
+import './index-4daa0095.js';
+import './index-066596d6.js';
+import './index-1d9fc4bb.js';
+import './index-61c1adeb.js';
+import './index-b1fa415d.js';
+import './index-86694ffd.js';
 import 'react-laag';
-import './index-1d0cd950.js';
-import './index-5dc98f9e.js';
-import './index-3c0470d4.js';
-import './index-b922d1ed.js';
-import './index-81f15d2a.js';
-import './index-c6cc855f.js';
-import './index-18b69117.js';
-import './index-34c0dd56.js';
-import './index-9eba5570.js';
-import './index-c901f1ae.js';
-import './index.module-b80d97f8.js';
-import './index-471e93be.js';
-import './index-22064e75.js';
-import './index-9a5124da.js';
-import './index-cdbd1e90.js';
-import './index-daabd5b2.js';
-import './index-291fdf80.js';
-import './index-f346aca0.js';
-import './index.module-6a00ac29.js';
-import './index-a4d80c02.js';
-import './index-c783fda0.js';
+import './index-fbc7642f.js';
+import './index-e17456e8.js';
+import './index-e6dd9d89.js';
+import './index-a9de0b89.js';
+import './index-6c29edfc.js';
+import './index-554dfccd.js';
+import './index-99112223.js';
+import './index-79184535.js';
+import './index-6ad808fc.js';
+import './index-69e8b327.js';
+import './index.module-21d8c7d7.js';
+import './index-aa7356c5.js';
+import './index-51022b4f.js';
+import './index-03e5b40c.js';
+import './index-0391dbbe.js';
+import './index-9178cc7a.js';
+import './index-2b129348.js';
+import './index-a8e50c8b.js';
+import './index.module-7a193078.js';
+import './index-2f4e05a7.js';
+import './index-8d9aa7a4.js';
 import 'react-beautiful-dnd';
-import './index-aa900177.js';
+import './index-90cdc131.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; }

package/build/esm/{index-df22a80d.js → index-08d356af.js}

@@ -1,6 +1,6 @@
-import { s as styleInject } from './index-bfb7feaa.js';
+import { s as styleInject } from './index-26369cf6.js';
 import 'react';
-import OrbitInteractionStandard from './index-dc2bc8c1.js';
+import OrbitInteractionStandard from './index-f7be8bec.js';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-893aa6c4.js → index-08ed70b2.js}

@@ -1,10 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-bfb7feaa.js';
+import './index-26369cf6.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
-import ArticleOverview from './index-2f512291.js';
-import SVGViewer from './index-dae0ebb6.js';
+import ArticleOverview from './index-ef6ec293.js';
+import SVGViewer from './index-984d72cf.js';
 import { jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@babel/runtime/helpers/objectWithoutProperties';
@@ -18,14 +18,14 @@ import '@babel/runtime/helpers/toConsumableArray';
 import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
-import './index.module-0e4013fb.js';
-import './index.module-40218603.js';
+import './index.module-50500e2e.js';
+import './index.module-49f8f87b.js';
 import 'classnames';
-import './index.module-9da22490.js';
+import './index.module-0348e7d5.js';
 import 'react-collapsible';
-import './index-801412d7.js';
-import './index.module-818aeb0a.js';
-import './index-a2e5276f.js';
+import './index-a22e97e8.js';
+import './index.module-d671fc16.js';
+import './index-1a137105.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; }

package/build/esm/{index-7e545440.js → index-097c4394.js}

@@ -1,9 +1,9 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import 'react';
-import SettingsHeaderContainer from './index-1e93e75e.js';
-import SettingsScroller from './index-e60bd458.js';
+import SettingsHeaderContainer from './index-818a1e50.js';
+import SettingsScroller from './index-a06dc17e.js';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
@@ -18,59 +18,59 @@ import '@babel/runtime/helpers/toConsumableArray';
 import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
-import './index-9eaf08a2.js';
-import './index-2923ca8f.js';
-import './index-10095e81.js';
+import './index-37b4460b.js';
+import './index-270e57ad.js';
+import './index-9bc86d0a.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-9e95986f.js';
+import './index-fb9a732c.js';
 import 'react-laag';
-import './index-1193ed89.js';
-import './index-1126206f.js';
+import './index-03c69f46.js';
+import './index-3f68d24f.js';
 import 'sift';
-import './index-74b909f0.js';
-import './index-3f967125.js';
-import './index-8f55b825.js';
-import './index-f6061b2c.js';
-import './index.module-d66248ab.js';
-import './index-791084e3.js';
+import './index-aaecc267.js';
+import './index-bc80a5fa.js';
+import './index-a67c5e1c.js';
+import './index-1bbbf351.js';
+import './index.module-bd1f9a78.js';
+import './index-954fd231.js';
 import 'react-switch';
-import './index-e8678693.js';
-import './index-deba0462.js';
-import './index-01ebe54b.js';
+import './index-7a33b8a9.js';
+import './index-7a30a9e2.js';
+import './index-ad52c5fa.js';
 import 'react-dropdown';
-import './index-e33c141c.js';
-import './index-88e6d823.js';
-import './index-35da1669.js';
-import './index-e80aafd9.js';
+import './index-a4af85dc.js';
+import './index-61e96c92.js';
+import './index-82addab6.js';
+import './index-5aff36e1.js';
 import '@crystaldesign/content-box';
-import './index-3ad16ce9.js';
-import './index-e7abac8f.js';
-import './index-a87ffae6.js';
-import './index-903e604b.js';
-import './index-455a4267.js';
-import './index-51135c0c.js';
-import './index-1d0cd950.js';
-import './index-5dc98f9e.js';
-import './index-3c0470d4.js';
-import './index-b922d1ed.js';
-import './index-81f15d2a.js';
-import './index-c6cc855f.js';
-import './index-18b69117.js';
-import './index-34c0dd56.js';
-import './index-9eba5570.js';
-import './index-c901f1ae.js';
-import './index.module-b80d97f8.js';
-import './index-471e93be.js';
-import './index-22064e75.js';
-import './index-9a5124da.js';
-import './index-cdbd1e90.js';
-import './index-daabd5b2.js';
-import './index-291fdf80.js';
-import './index-f346aca0.js';
-import './index.module-6a00ac29.js';
-import './index-a4d80c02.js';
-import './index-c783fda0.js';
-import './index-cf8e6165.js';
+import './index-4daa0095.js';
+import './index-066596d6.js';
+import './index-1d9fc4bb.js';
+import './index-61c1adeb.js';
+import './index-b1fa415d.js';
+import './index-86694ffd.js';
+import './index-fbc7642f.js';
+import './index-e17456e8.js';
+import './index-e6dd9d89.js';
+import './index-a9de0b89.js';
+import './index-6c29edfc.js';
+import './index-554dfccd.js';
+import './index-99112223.js';
+import './index-79184535.js';
+import './index-6ad808fc.js';
+import './index-69e8b327.js';
+import './index.module-21d8c7d7.js';
+import './index-aa7356c5.js';
+import './index-51022b4f.js';
+import './index-03e5b40c.js';
+import './index-0391dbbe.js';
+import './index-9178cc7a.js';
+import './index-2b129348.js';
+import './index-a8e50c8b.js';
+import './index.module-7a193078.js';
+import './index-2f4e05a7.js';
+import './index-8d9aa7a4.js';
+import './index-bdb51b0b.js';
 
 var wcConfiguratorSettings = "wcConfigurator-settings-nB7sW";
 var tabsHorizontal = "tabs-horizontal-052sb";

package/build/esm/{index-d6b08f80.js → index-09b663f1.js}

@@ -1,5 +1,5 @@
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';

package/build/esm/{index-c64a6d06.js → index-12333ffc.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler, a as usePlannerUIHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler, a as usePlannerUIHandler } from './index-26369cf6.js';
 import { observer } from 'mobx-react-lite';
 import { useRef, useEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/build/esm/{index-d028d7fc.js → index-12edbb86.js}

@@ -1,9 +1,9 @@
-import { u as useViewHandler } from './index-bfb7feaa.js';
+import { u as useViewHandler } from './index-26369cf6.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
-import NavBar from './index-4c4408d2.js';
-import { g as wcConfigurator3Dimage, h as imageCenterOrbit, j as imageCenterStatic } from './index.module-1b1b8941.js';
-import Logo from './index-b7b6ba53.js';
+import NavBar from './index-f85e9cf2.js';
+import { g as wcConfigurator3Dimage, h as imageCenterOrbit, j as imageCenterStatic } from './index.module-bede29e9.js';
+import Logo from './index-1ab7f6e5.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-766f6255.js → index-1563d7ee.js}

@@ -1,8 +1,8 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import { useState } from 'react';
 import { observer } from 'mobx-react-lite';
-import { S as SettingsItem } from './index-1126206f.js';
+import { S as SettingsItem } from './index-3f68d24f.js';
 import classnames from 'classnames';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
@@ -18,52 +18,52 @@ import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
 import 'sift';
-import './index-74b909f0.js';
-import './index-9eaf08a2.js';
-import './index-3f967125.js';
-import './index-8f55b825.js';
-import './index-f6061b2c.js';
-import './index.module-d66248ab.js';
-import './index-791084e3.js';
+import './index-aaecc267.js';
+import './index-37b4460b.js';
+import './index-bc80a5fa.js';
+import './index-a67c5e1c.js';
+import './index-1bbbf351.js';
+import './index.module-bd1f9a78.js';
+import './index-954fd231.js';
 import 'react-switch';
-import './index-e8678693.js';
-import './index-deba0462.js';
-import './index-01ebe54b.js';
+import './index-7a33b8a9.js';
+import './index-7a30a9e2.js';
+import './index-ad52c5fa.js';
 import 'react-dropdown';
-import './index-e33c141c.js';
+import './index-a4af85dc.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-88e6d823.js';
-import './index-35da1669.js';
-import './index-e80aafd9.js';
+import './index-61e96c92.js';
+import './index-82addab6.js';
+import './index-5aff36e1.js';
 import '@crystaldesign/content-box';
-import './index-3ad16ce9.js';
-import './index-e7abac8f.js';
-import './index-a87ffae6.js';
-import './index-903e604b.js';
-import './index-455a4267.js';
-import './index-51135c0c.js';
+import './index-4daa0095.js';
+import './index-066596d6.js';
+import './index-1d9fc4bb.js';
+import './index-61c1adeb.js';
+import './index-b1fa415d.js';
+import './index-86694ffd.js';
 import 'react-laag';
-import './index-1d0cd950.js';
-import './index-5dc98f9e.js';
-import './index-3c0470d4.js';
-import './index-b922d1ed.js';
-import './index-81f15d2a.js';
-import './index-c6cc855f.js';
-import './index-18b69117.js';
-import './index-34c0dd56.js';
-import './index-9eba5570.js';
-import './index-c901f1ae.js';
-import './index.module-b80d97f8.js';
-import './index-471e93be.js';
-import './index-22064e75.js';
-import './index-9a5124da.js';
-import './index-cdbd1e90.js';
-import './index-daabd5b2.js';
-import './index-291fdf80.js';
-import './index-f346aca0.js';
-import './index.module-6a00ac29.js';
-import './index-a4d80c02.js';
-import './index-c783fda0.js';
+import './index-fbc7642f.js';
+import './index-e17456e8.js';
+import './index-e6dd9d89.js';
+import './index-a9de0b89.js';
+import './index-6c29edfc.js';
+import './index-554dfccd.js';
+import './index-99112223.js';
+import './index-79184535.js';
+import './index-6ad808fc.js';
+import './index-69e8b327.js';
+import './index.module-21d8c7d7.js';
+import './index-aa7356c5.js';
+import './index-51022b4f.js';
+import './index-03e5b40c.js';
+import './index-0391dbbe.js';
+import './index-9178cc7a.js';
+import './index-2b129348.js';
+import './index-a8e50c8b.js';
+import './index.module-7a193078.js';
+import './index-2f4e05a7.js';
+import './index-8d9aa7a4.js';
 
 var productSettingsWrapper = "product-settings-wrapper-KOweX";
 var scrollWrapper = "scroll-wrapper-DI3EF";

package/build/esm/{index-053af3d0.js → index-172c76f4.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
 import { DivaUtils } from '@crystaldesign/diva-core';

package/build/esm/{index-4bc11867.js → index-19b7e13e.js}

@@ -1,5 +1,5 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject } from './index-bfb7feaa.js';
+import { s as styleInject } from './index-26369cf6.js';
 import { useTranslation } from '@crystaldesign/diva-core';
 import { useState, useRef, useEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/build/esm/{index-a2e5276f.js → index-1a137105.js}

@@ -3,10 +3,10 @@ import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { u as useViewHandler } from './index-bfb7feaa.js';
+import { u as useViewHandler } from './index-26369cf6.js';
 import { useState } from 'react';
 import { observer } from 'mobx-react-lite';
-import { s as svgWrapper } from './index.module-818aeb0a.js';
+import { s as svgWrapper } from './index.module-d671fc16.js';
 import classnames from 'classnames';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';

package/build/esm/{index-b7b6ba53.js → index-1ab7f6e5.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import { useDivaCore } from '@crystaldesign/diva-core';

package/build/esm/{index-3f0f8c8a.js → index-1ad0f6df.js}

@@ -1,7 +1,7 @@
 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-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import { observer } from 'mobx-react-lite';
 import { getLogger, useDivaCore, useTranslation } from '@crystaldesign/diva-core';
 import { useRef, useState, useEffect } from 'react';

package/build/esm/{index-f6061b2c.js → index-1bbbf351.js}

@@ -1,13 +1,13 @@
-import { u as useViewHandler } from './index-bfb7feaa.js';
+import { u as useViewHandler } from './index-26369cf6.js';
 import 'react';
 import classnames from 'classnames';
-import { r as row, c as colum, t as title, a as toggle } from './index.module-d66248ab.js';
-import Toggle from './index-791084e3.js';
+import { r as row, c as colum, t as title, a as toggle } from './index.module-bd1f9a78.js';
+import Toggle from './index-954fd231.js';
 import { observer } from 'mobx-react-lite';
 import { getLogger } from '@crystaldesign/diva-core';
 import { DivaError } from '@crystaldesign/diva-utils';
-import InfoIcon from './index-e8678693.js';
-import PricePreview from './index-deba0462.js';
+import InfoIcon from './index-7a33b8a9.js';
+import PricePreview from './index-7a30a9e2.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-ace45953.js → index-1c2e97d6.js}

@@ -1,4 +1,4 @@
-import { u as useViewHandler } from './index-bfb7feaa.js';
+import { u as useViewHandler } from './index-26369cf6.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';
@@ -21,15 +21,19 @@ var PosNr = function PosNr(_ref) {
   var rect = _ref.rect,
     item = _ref.item,
     onElement = _ref.onElement,
-    plannerUIProps = _ref.plannerUIProps;
+    plannerUIProps = _ref.plannerUIProps,
+    hasTrash = _ref.hasTrash;
   var viewHandler = useViewHandler();
+  var top = item.position.interpretation == 'percentage' ? rect.top + "%" : rect.top + "px";
+  if (hasTrash && rect.top < 4) top = 'calc(' + top + ' + 35px + var(--globalSize) / 2)'; // 35px space for trash icon
+  else top = 'calc(' + top + ' + var(--globalSize) / 2)'; // correct for icon center
   return /*#__PURE__*/jsxs("div", {
     ref: function ref(elem) {
       return onElement(elem);
     },
     style: {
-      left: item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px',
-      top: item.position.interpretation == 'percentage' ? rect.top + '%' : rect.top + 'px',
+      left: item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left,
+      top: top,
       visibility: viewHandler.productState.plannerMode == 'BoxPlanner' ? 'hidden' : 'visible'
     },
     className: classnames(plannerUIProps.classes.buttonGeneral, plannerUIProps.classes.posNr.posNr, item.isDockedAccessoire ? plannerUIProps.classes.posNr.posNrAcc : undefined, item.elemState == 'selected' ? plannerUIProps.classes.posNr.posNrSelected : undefined, item.elemState == 'selectable' ? plannerUIProps.classes.posNr.posNrSelectable : undefined, item.elemState == 'unselectable' ? plannerUIProps.classes.posNr.posNrUnSelectable : undefined, item.onHover && item.elemState != 'unselectable' ? plannerUIProps.classes.posNr.posNrOnHover : undefined

package/build/esm/{index-c8ac86cf.js → index-1d7473b9.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-bfb7feaa.js';
+import './index-26369cf6.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-a87ffae6.js → index-1d9fc4bb.js}

@@ -1,10 +1,10 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.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-9eaf08a2.js';
+import SettingsHeader from './index-37b4460b.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-77d53d67.js → index-1ee0be61.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-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import 'react';
 import { DivaUtils } from '@crystaldesign/diva-core';
 import { observer } from 'mobx-react-lite';

package/build/esm/{index-5676ac73.js → index-2011cb68.js}

@@ -1,8 +1,8 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
-import VerticalTabGroupItemStandard from './index-2f4fe919.js';
+import VerticalTabGroupItemStandard from './index-20f0b043.js';
 import { useTranslation } from '@crystaldesign/diva-core';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
@@ -17,7 +17,7 @@ import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
 import 'classnames';
-import './IconHandler-b1617bee.js';
+import './IconHandler-3955b84a.js';
 
 var priceDiv = "price-div-veoFD";
 var priceText = "price-text-34sGt";

package/build/esm/{index-2f4fe919.js → index-20f0b043.js}

@@ -1,9 +1,9 @@
-import { s as styleInject, u as useViewHandler } from './index-bfb7feaa.js';
+import { s as styleInject, u as useViewHandler } from './index-26369cf6.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useRef, useEffect } from 'react';
 import { useTranslation } from '@crystaldesign/diva-core';
-import { g as getIconOfTabGroup } from './IconHandler-b1617bee.js';
+import { g as getIconOfTabGroup } from './IconHandler-3955b84a.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';