@crystaldesign/diva-web-planner-react 24.14.0-beta.1 → 24.14.0-beta.10

package/build/esm/index-6e2074a0.js

@@ -1,214 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-c54e9a7f.js';
-import React, { useState, useEffect, Suspense } from 'react';
-import { observer } from 'mobx-react-lite';
-import sift from 'sift';
-import TextBox from './index-d78eb82b.js';
-import ItemVariant from './index-81acf3e0.js';
-import SettingsPaletteGroup from './index-5fdcbb06.js';
-import ToggleOption from './index-cbe63bf2.js';
-import GroupDropdown from './index-fc45d61b.js';
-import PromotedProducts from './index-ec13aee2.js';
-import ToggleName from './index-ca9cb6f7.js';
-import ProductList from './index-fe2ccbb6.js';
-import itemPaletteTypeComponentMap from './index-0c4bcdd3.js';
-import ItemWrapper from './index-c1ffcb2f.js';
-import { jsx, Fragment } from 'react/jsx-runtime';
-
-var collapsableInner = "collapsable-inner-YPvJa";
-var css_248z = ".collapsable-outer-J0amo {\n  overflow: visible !important;\n}\n\n.collapsable-outer-J0amo {\n  height: auto;\n  transition: none 0s ease 0s;\n}\n\n.collapsable-inner-YPvJa {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(var(--gridSize), 1fr));\n  grid-auto-rows: min-content;\n  grid-gap: var(--gridGap);\n  margin-top: var(--gridGap);\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 ShelfPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-69af4fab.js');
-});
-var DoorPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-6bae0c31.js');
-});
-var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
-  var _viewHandler$uiState$, _settingsSizes$gapDef, _settingsSizes$sizeDe, _viewHandler$uiState$2, _item$groups$;
-  var item = _ref.item,
-    groupSize = _ref.groupSize;
-  var viewHandler = useViewHandler();
-  var PaletteComponent = itemPaletteTypeComponentMap[item.type];
-  if (PaletteComponent === undefined) throw new Error("component type: '" + item.type + "' not implemented");
-  var _useState = useState([]),
-    _useState2 = _slicedToArray(_useState, 2),
-    filteredGroups = _useState2[0],
-    setFilteredGroups = _useState2[1];
-  var _useState3 = useState([]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    filteredGroupsWithEmptyGroups = _useState4[0],
-    setFilteredGroupsWithEmptyGroups = _useState4[1];
-  useEffect(function () {
-    var filteredGroupsWithEmptyGroups = item.groups.map(function (group) {
-      return _objectSpread(_objectSpread({}, group), {}, {
-        items: item.currentItemsFilter ? group.items.filter(sift(item.currentItemsFilter)) : group.items
-      });
-    });
-    var filteredGroups = filteredGroupsWithEmptyGroups.filter(function (group) {
-      return group.items.length > 0;
-    });
-    if (filteredGroups.length > 0) {
-      filteredGroupsWithEmptyGroups = filteredGroups;
-    }
-    setFilteredGroups(filteredGroups);
-    setFilteredGroupsWithEmptyGroups(filteredGroupsWithEmptyGroups);
-  }, [item, viewHandler.settingsState.itemPalettes]);
-  var doNotRenderGroups = filteredGroups.length === 1 && filteredGroups[0].name === 'none';
-  var innerGridClass = item.type.startsWith('SUMMARY') ? '' : collapsableInner;
-
-  //this code now sets a css variable within a specific palette to define the grid items size and gird gap
-  //this is a big improvement to the solution we had bevor (windowspecific itemsize hardcoded) but still can be done better
-  //s the catalogteam can define the size of the items so it would be some kind of catalog ux improvment -> TODO refactoring
-  var settingsSizes = (_viewHandler$uiState$ = viewHandler.uiState.ViewConfig.settingsSizes) !== null && _viewHandler$uiState$ !== void 0 ? _viewHandler$uiState$ : {};
-  var gridGap = (_settingsSizes$gapDef = settingsSizes === null || settingsSizes === void 0 ? void 0 : settingsSizes.gapDefault) !== null && _settingsSizes$gapDef !== void 0 ? _settingsSizes$gapDef : '10px';
-  var gridItemSize = (_settingsSizes$sizeDe = settingsSizes === null || settingsSizes === void 0 ? void 0 : settingsSizes.sizeDefault) !== null && _settingsSizes$sizeDe !== void 0 ? _settingsSizes$sizeDe : '300px';
-  if (item.isRenderedNotInSettingPalette && !item.isRenderedInAccessorieStep) {
-    gridItemSize = '240px';
-  } else if (item.type == 'SUMMARY_ARTICLES' || item.type === 'SUMMARY_OPTIONTREE' || item.type == 'SUMMARY_PARTLIST' || item.type == 'VARIANTS') {
-    gridItemSize = 'calc(100% - 20px)';
-  } else if (item.type == 'GAL_GROUP_DROPDOWN' || item.type === 'GAL_BIG') {
-    gridItemSize = '100px';
-  } else if (item.type == 'ACC') {
-    if (settingsSizes.sizeAccessoires) {
-      gridItemSize = settingsSizes.sizeAccessoires;
-    }
-  } else if (item.type == 'ACC_CONFIG') {
-    gridItemSize = '100%';
-  } else if (item.type.startsWith('GAL_SMALL')) {
-    gridItemSize = '60px';
-  } else if (item.type == 'RANGE') {
-    gridItemSize = '100%';
-  } else if (item.type == 'GAL') {
-    var _settingsSizes$sizeGa, _settingsSizes$gapGal;
-    gridItemSize = (_settingsSizes$sizeGa = settingsSizes === null || settingsSizes === void 0 ? void 0 : settingsSizes.sizeGallery) !== null && _settingsSizes$sizeGa !== void 0 ? _settingsSizes$sizeGa : '80px';
-    gridGap = (_settingsSizes$gapGal = settingsSizes === null || settingsSizes === void 0 ? void 0 : settingsSizes.gapGallery) !== null && _settingsSizes$gapGal !== void 0 ? _settingsSizes$gapGal : '10px';
-  } else if (item.type === 'PLANNERSWITCH') {
-    gridItemSize = '170px';
-  } else if (item.type === 'SMALL' && viewHandler.getIsInMobileView() && ((_viewHandler$uiState$2 = viewHandler.uiState.templateConfigKeys) === null || _viewHandler$uiState$2 === void 0 ? void 0 : _viewHandler$uiState$2.ItemDefault) == 'jungle') {
-    //for the usecase of schlaraffia in mobile
-    //TODO for refactorig this should be done nicer
-    gridItemSize = '120px';
-  } else if (item.type === 'SHELFPLANNER' && viewHandler.productState.shelfPlannerRTV) {
-    gridItemSize = '120px';
-  } else if (item.type === 'VERY_SMALL') {
-    gridItemSize = '48%';
-  } else if (item.type === 'GAL_TEXT') {
-    gridItemSize = '100px';
-  } else if (item.type === 'GAL_BIG_TEXT') {
-    gridItemSize = '120px';
-  } else if (item.type === 'GAL_SMALL_TEXT') {
-    gridItemSize = '70px';
-  }
-  if (!item.visible) return /*#__PURE__*/jsx(Fragment, {});
-  switch (item.type) {
-    case 'TOGGLE':
-      return /*#__PURE__*/jsx(ToggleOption, {
-        item: item,
-        paletteId: item.id
-      });
-    case 'TOGGLE_NAME':
-      return /*#__PURE__*/jsx(ToggleName, {
-        item: item,
-        paletteId: item.id
-      });
-    case 'TEXTBOX':
-      return /*#__PURE__*/jsx(TextBox, {
-        item: item,
-        paletteId: item.id
-      });
-    case 'DROPDOWN_TEXT':
-    case 'DROPDOWN_IMAGE':
-      return /*#__PURE__*/jsx(ItemVariant, {
-        item: item,
-        paletteId: item.id
-      });
-    case 'NUMBER':
-      return /*#__PURE__*/jsx(PaletteComponent, {
-        paletteId: item.id,
-        item: (_item$groups$ = item.groups[0]) === null || _item$groups$ === void 0 || (_item$groups$ = _item$groups$.items) === null || _item$groups$ === void 0 ? void 0 : _item$groups$[0],
-        groupSize: groupSize
-      }, item.id + item.configStepKey);
-    case 'SHELFPLANNER':
-      return /*#__PURE__*/jsx(Suspense, {
-        fallback: /*#__PURE__*/jsx(Fragment, {}),
-        children: /*#__PURE__*/jsx(ShelfPlanner, {
-          filteredGroups: filteredGroups,
-          item: item,
-          id: item.id,
-          style: {
-            '--gridSize': gridItemSize,
-            '--gridGap': gridGap
-          }
-        }, item.id)
-      });
-    case 'PRODUCTS':
-      return /*#__PURE__*/jsx(ProductList, {
-        item: item
-      });
-    case 'PROMOTED':
-      return /*#__PURE__*/jsx(PromotedProducts, {
-        item: item
-      });
-    case 'DOOR_PLANNER':
-      return /*#__PURE__*/jsx(Suspense, {
-        fallback: /*#__PURE__*/jsx(Fragment, {}),
-        children: /*#__PURE__*/jsx(DoorPlanner, {
-          item: item
-        })
-      });
-    case 'GAL_GROUP_DROPDOWN':
-    case 'GAL_SMALL_GROUP_DROPDOWN':
-      var childGroup = /*#__PURE__*/jsx(GroupDropdown, {
-        item: item,
-        PaletteComponent: PaletteComponent,
-        filteredGroups: filteredGroupsWithEmptyGroups,
-        id: item.id,
-        showSearchBar: item.type == 'GAL_GROUP_DROPDOWN',
-        contentInnerClassName: innerGridClass
-      }, item.configStepKey);
-      return /*#__PURE__*/jsx(ItemWrapper, {
-        gridGap: gridGap,
-        gridItemSize: gridItemSize,
-        item: item,
-        children: childGroup
-      });
-    default:
-      var children;
-      if (doNotRenderGroups) children = /*#__PURE__*/jsx("div", {
-        className: innerGridClass,
-        children: filteredGroups.map(function (group) {
-          return group.items.map(function (paletteItem, i) {
-            return /*#__PURE__*/jsx(PaletteComponent, {
-              paletteType: item.type,
-              paletteId: item.id,
-              item: paletteItem
-            }, i);
-          });
-        })
-      });else children = /*#__PURE__*/jsx(SettingsPaletteGroup, {
-        groups: filteredGroups,
-        contentInnerClassName: innerGridClass,
-        itemPalette: item,
-        PaletteComponent: PaletteComponent
-      });
-      return /*#__PURE__*/jsx(ItemWrapper, {
-        gridGap: gridGap,
-        gridItemSize: gridItemSize,
-        item: item,
-        children: children
-      });
-  }
-};
-var SettingsItem = observer(SettingsPaletteItem);
-
-var index = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  'default': SettingsItem
-});
-
-export { SettingsItem as S, collapsableInner as c, index as i };

package/build/esm/index-6e300317.js

@@ -1,27 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-c54e9a7f.js';
-import 'react';
-import DynamicMultiRender from 'react-dynamic-multi-render';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'mobx-react-lite';
-
-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 SettingsItemRoomTemplate = function SettingsItemRoomTemplate(props) {
-  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
-    componentName: "Settings/SettingsScroller/SettingsItem/ItemPalette/Options/Default/Room/RoomItem"
-  }));
-};
-
-export { SettingsItemRoomTemplate as default };

package/build/esm/index-70517d20.js

@@ -1,43 +0,0 @@
-import './index-c54e9a7f.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import 'react';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-
-var RotationClockwise = function RotationClockwise(_ref) {
-  var item = _ref.item,
-    rect = _ref.rect,
-    onElement = _ref.onElement,
-    plannerUIProps = _ref.plannerUIProps;
-  return /*#__PURE__*/jsx("div", {
-    ref: function ref(elem) {
-      return onElement(elem);
-    },
-    onClick: function onClick() {
-      var _item$clickFunction;
-      (_item$clickFunction = item.clickFunction) === null || _item$clickFunction === void 0 || _item$clickFunction.call(item, item.setId, Number(item.elementId));
-    },
-    style: {
-      left: rect.left + 'px',
-      top: rect.top + 'px'
-    },
-    className: classnames(plannerUIProps.classes.rotation.rotClock, plannerUIProps.classes.buttonGeneral),
-    children: item.posNr
-  });
-};
-var RotationClockwise$1 = observer(RotationClockwise);
-
-export { RotationClockwise$1 as default };

package/build/esm/index-70a22d53.js

@@ -1,27 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-c54e9a7f.js';
-import 'react';
-import DynamicMultiRender from 'react-dynamic-multi-render';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'mobx-react-lite';
-
-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 NavigationButtons = function NavigationButtons(props) {
-  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
-    componentName: "Action/Navigation"
-  }));
-};
-
-export { NavigationButtons as default };

package/build/esm/index-71554b92.js

@@ -1,83 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-c54e9a7f.js';
-import 'react';
-import { ContentBoxComponent } from '@crystaldesign/content-box';
-import { observer } from 'mobx-react-lite';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-
-var infoButton = "infoButton-1VGiK";
-var css_248z = ".infoButton-1VGiK {\n  line-height: 26px;\n  width: 26px;\n  height: 26px;\n  background-color: white;\n  color: var(--primaryColor);\n  text-align: center;\n  cursor: pointer;\n  border: solid 2px var(--primaryColor);\n  border-radius: 50%;\n  margin-left: 10px;\n}\n";
-styleInject(css_248z);
-
-var InfoButton = function InfoButton(_ref) {
-  var _selectedElement$grou, _selectedElement$long;
-  var selectedElement = _ref.selectedElement,
-    id = _ref.id,
-    openUrl = _ref.openUrl;
-  var viewHandler = useViewHandler();
-  var text = selectedElement ? ((_selectedElement$grou = selectedElement.groupName) !== null && _selectedElement$grou !== void 0 ? _selectedElement$grou : '') + (selectedElement.parentName ? " (".concat(selectedElement.parentName, ")") : '') + ' ' + ((_selectedElement$long = selectedElement.longDescription) !== null && _selectedElement$long !== void 0 ? _selectedElement$long : '') : '';
-  var updateInfoBox = function updateInfoBox() {
-    if (!selectedElement) return;
-    viewHandler.settingsState.updateInfoBox({
-      type: 'info',
-      content: /*#__PURE__*/jsx(ContentBoxComponent, {
-        onClose: function onClose() {
-          return viewHandler.settingsState.updateInfoBox();
-        },
-        settings: {
-          contentBoxProps: {
-            type: 'CloseButtonContainer',
-            style: {
-              background: 'transparent',
-              padding: 0
-            },
-            closeIconSize: '24px',
-            content: {
-              type: 'InfoBox',
-              imageUrl: selectedElement.image,
-              title: selectedElement.text,
-              price: selectedElement.deltaPrice,
-              text: text
-            }
-          }
-        }
-      }),
-      id: id,
-      key: selectedElement.codex
-    });
-  };
-  var onClick = function onClick() {
-    if (openUrl && selectedElement) {
-      window.open(selectedElement.url, '_blank');
-      return;
-    }
-    viewHandler.settingsState.setContentItemVisible(false);
-    var boxContent = viewHandler.settingsState.infoBoxContent;
-    if (boxContent && boxContent.id === id && boxContent.type === 'info') viewHandler.settingsState.updateInfoBox();else updateInfoBox();
-  };
-  var boxContent = viewHandler.settingsState.infoBoxContent;
-  if (boxContent && boxContent.id === id && boxContent.key !== (selectedElement === null || selectedElement === void 0 ? void 0 : selectedElement.codex) && boxContent.type === 'info') {
-    updateInfoBox();
-  }
-  return /*#__PURE__*/jsx("div", {
-    title: 'Info',
-    onClick: onClick,
-    className: infoButton,
-    children: "i"
-  });
-};
-var InfoButton$1 = observer(InfoButton);
-
-export { InfoButton$1 as default };

package/build/esm/index-72477567.js

@@ -1,202 +0,0 @@
-import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-c54e9a7f.js';
-import classnames from 'classnames';
-import { useEffect } from 'react';
-import Inputbox from './index-6d036428.js';
-import Product from './index-d680a811.js';
-import Settings from './index-801fdac3.js';
-import TabGroup from './index-046dca82.js';
-import NavigationButtons from './index-70a22d53.js';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import BasketActionStandard from './index-bd249162.js';
-import { observer } from 'mobx-react-lite';
-import BasketMobile from './index-837fe6b6.js';
-import ProgressBar from './index-7942cc53.js';
-import BarrierActions from './index-7d0e7a0e.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import './index-f5fe7daf.js';
-import './index-fa81e2cc.js';
-import './index-3cf9a40f.js';
-import './index-23fd5678.js';
-import './index-3ad86696.js';
-import 'react-laag';
-import './index-5923c149.js';
-import './index-913d0f7d.js';
-import './index-6e2074a0.js';
-import 'sift';
-import './index-d78eb82b.js';
-import './index-81acf3e0.js';
-import './index-5fdcbb06.js';
-import './index-cbe63bf2.js';
-import './index.module-d050b732.js';
-import './index-502de25d.js';
-import 'react-switch';
-import './index-84b6bb30.js';
-import './index-fc45d61b.js';
-import 'react-dropdown';
-import './index-fcb86845.js';
-import './index-bfcd13ef.js';
-import './index-145c5eb3.js';
-import './index-f4ef8b9c.js';
-import '@crystaldesign/content-box';
-import './index-37b7a4a9.js';
-import './index-ce871307.js';
-import './index-ec13aee2.js';
-import './index-ca9cb6f7.js';
-import './index-fe2ccbb6.js';
-import '@crystaldesign/products-component';
-import './index-75cd2df4.js';
-import './index-0c4bcdd3.js';
-import './index-93c88ab6.js';
-import './index-7df9cfe3.js';
-import './index-0b4fbf1f.js';
-import './index-7d811045.js';
-import './index-5aec159f.js';
-import './index-d3b97405.js';
-import './index-d7519be8.js';
-import './index-7a67d302.js';
-import './index-2eba8501.js';
-import './index-6e300317.js';
-import './index-4ba507f1.js';
-import './index.module-11c2316e.js';
-import './index-04c5da30.js';
-import './index-ee458da8.js';
-import './index-a77eaf6d.js';
-import './index-3a39d1fd.js';
-import './index-139b131b.js';
-import './index-b70740ac.js';
-import './index-dabf99d3.js';
-import './index.module-c7f71138.js';
-import './index-c1ffcb2f.js';
-import './index-a113a21c.js';
-import './index-da0fc0a1.js';
-import './index-b7257800.js';
-import './index-333c8c00.js';
-import './index-6c79780a.js';
-import './index-7abfcbe0.js';
-import './index-e4b6410c.js';
-
-var wcConfigurator = "wcConfigurator-YOuy8";
-var landscape = "landscape-EyFBs";
-var portrait = "portrait-XiOPl";
-var wcConfiguratorProduct = "wcConfigurator-product-Ovdqk";
-var minExpanded = "min-expanded-aFvtw";
-var wcConfiguratorSettingsWrapper = "wc-configurator-settings-wrapper-ymkif";
-var expanded = "expanded-LXnio";
-var maxExpanded = "max-expanded-Q2hOy";
-var wcConfiguratorSettings = "wcConfigurator-settings-OLzdK";
-var wcConfiguratorSteps = "wcConfigurator-steps-1--dZ";
-var closeButtonVisible = "close-button-visible-y3GY8";
-var wcConfiguratorSettingsActions = "wcConfigurator-settings-actions-xqcr5";
-var wcConfiguratorAction = "wcConfigurator-action-ycd5b";
-var foldedup = "foldedup-Qqnox";
-var settingsHidden = "settings-hidden-NnHMW";
-var burgerVisible = "burger-visible-AFcf0";
-var isOnLastStep = "isOnLastStep-eAWSY";
-var progressBar = "progressBar-Izqk1";
-var actionOnTop = "action-on-top-UqyK5";
-var css_248z = ".wcConfigurator-YOuy8 {\n  position: relative;\n\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  font-family: var(--diva-typography-font-family);\n  font-weight: 100;\n  -webkit-touch-callout: none; /* iOS Safari */\n  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */\n  -moz-user-select: none; /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently*/\n}\n\n.wcConfigurator-YOuy8 *,\n.wcConfigurator-YOuy8 *::before,\n.wcConfigurator-YOuy8 *::after {\n  box-sizing: content-box;\n  box-sizing: initial;\n}\n\n.wcConfigurator-YOuy8.landscape-EyFBs {\n  height: 100%;\n  width: 100%;\n}\n\n.wcConfigurator-YOuy8.portrait-XiOPl {\n  height: 100%;\n  width: 100%;\n}\n\n/******************************************Product*******************************************/\n\n.wcConfigurator-product-Ovdqk {\n  position: absolute;\n  width: 63%;\n  max-width: calc(100% - 564px);\n  left: 0px;\n  top: 0;\n  height: 100%;\n}\n.min-expanded-aFvtw .wcConfigurator-product-Ovdqk {\n  width: calc(100% - 128px - 16px);\n  max-width: none;\n  max-width: initial;\n}\n\n.wc-configurator-settings-wrapper-ymkif {\n  position: absolute;\n  z-index: 600;\n  height: calc(100% - 32px);\n  width: calc(37% - 16px);\n  min-width: 550px;\n  right: 0;\n  padding: 16px 16px 16px 0;\n  background-color: var(--settingsBackgroundColor);\n  transition: width 0.45s;\n  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);\n}\n\n.expanded-LXnio .wc-configurator-settings-wrapper-ymkif {\n  width: 70%;\n}\n\n.min-expanded-aFvtw .wc-configurator-settings-wrapper-ymkif {\n  width: calc(128px);\n  min-width: 0;\n  min-width: initial;\n}\n.max-expanded-Q2hOy .wc-configurator-settings-wrapper-ymkif {\n  width: calc(100% - 16px);\n  z-index: 801;\n}\n\n/**************************************ConfigPalette***************************************/\n.wcConfigurator-settings-OLzdK {\n  position: absolute;\n  width: calc(100% - 128px - 4px - 16px);\n\n  transition: height 0.45s, top 0.45s;\n  overflow-y: hidden;\n  overflow-x: hidden;\n  overflow: visible;\n  z-index: 100;\n  right: calc(128px + 4px + 16px);\n  top: 16px;\n  height: calc(100% - 32px - 4px - 50px);\n}\n\n/**************************************TabGroup********************************************/\n\n.wcConfigurator-steps-1--dZ {\n  position: absolute;\n  z-index: 300;\n  right: 16px;\n  top: 16px;\n  height: calc(100% - 32px - 4px - 50px);\n  width: 128px;\n}\n.close-button-visible-y3GY8 .wcConfigurator-steps-1--dZ {\n  top: 80px;\n  height: calc(100% - 32px - 4px - 50px - 64px);\n}\n\n/************************************Navigaton Buttons*************************************/\n\n.wcConfigurator-settings-actions-xqcr5 {\n  position: absolute;\n  width: calc(100% - 128px - 4px - 16px);\n  height: 50px;\n  right: calc(128px + 4px + 16px);\n  bottom: 16px;\n  z-index: 200;\n}\n\n.min-expanded-aFvtw .wcConfigurator-settings-actions-xqcr5 {\n  overflow: hidden;\n}\n\n/*************************************Basket Button****************************************/\n.wcConfigurator-action-ycd5b {\n  position: absolute;\n  width: 128px;\n  height: 50px;\n  right: 16px;\n  bottom: 16px;\n  z-index: 200;\n}\n\n/****************************************Settings- Expanded *******************************/\n.expanded-LXnio .wcConfigurator-settings-OLzdK,\n.max-expanded-Q2hOy .wcConfigurator-settings-OLzdK,\n.expanded-LXnio .wcConfigurator-settings-actions-xqcr5,\n.max-expanded-Q2hOy .wcConfigurator-settings-actions-xqcr5 {\n  width: calc(100% - 128px - 16px - 4px);\n}\n\n.wcConfigurator-YOuy8.portrait-XiOPl,\n.landscape-EyFBs.wcConfigurator-YOuy8 {\n  padding: 0;\n  padding: initial;\n  overflow: hidden;\n}\n/*********************************************************************Mobile Landscape***********************************************************************/\n\n/**********************3D / 2D Bereich -- Mobile Landscape ****************************/\n.landscape-EyFBs .wcConfigurator-product-Ovdqk {\n  width: 100%;\n  height: 100%;\n  top: 0px;\n  left: 0px;\n  max-width: none;\n  max-width: initial;\n}\n\n/*************************ConfigPalette -- Mobile Landscape ***************************/\n\n.landscape-EyFBs .wcConfigurator-settings-OLzdK {\n  display: none;\n}\n\n/*configuratorPalette wird nach unten aus dem Blickfeld geschoben*/\n/* .landscape.settings-hidden .wcConfigurator-settings {\n  top: 100%;\n} */\n\n/*****************************TabGroup -- Mobile Landscape ****************************/\n\n.landscape-EyFBs .wcConfigurator-steps-1--dZ {\n  display: none;\n}\n\n/******************Navigaton Buttons -- Mobile Landscape ******************************/\n.landscape-EyFBs .wcConfigurator-settings-actions-xqcr5 {\n  display: none;\n}\n\n/*********************Basket Button-- Mobile Landscape*********************************/\n.landscape-EyFBs .wcConfigurator-action-ycd5b {\n  display: none;\n}\n\n/*********************************************************************Mobile Portrait************************************************************************/\n\n/**********************3D / 2D Bereich -- Mobile Portrait *****************************/\n.portrait-XiOPl .wcConfigurator-product-Ovdqk {\n  top: 50px;\n  left: 0;\n  height: 40%;\n  width: 100%;\n  max-width: none;\n  max-width: initial;\n}\n\n.portrait-XiOPl.foldedup-Qqnox .wcConfigurator-product-Ovdqk {\n  z-index: 1;\n}\n\n.portrait-XiOPl.settings-hidden-NnHMW .wcConfigurator-product-Ovdqk {\n  height: calc(100% - 50px);\n}\n\n/*************************ConfigPalette -- Mobile Portrait ****************************/\n\n.portrait-XiOPl .wcConfigurator-settings-OLzdK {\n  left: 0px;\n  top: calc(40% + 50px);\n  height: calc(60% - 50px - var(--configuratorActionHeight) - 6px);\n  width: 100%;\n}\n\n.portrait-XiOPl.settings-hidden-NnHMW .wcConfigurator-settings-OLzdK {\n  top: 100%;\n}\n\n.portrait-XiOPl.foldedup-Qqnox .wcConfigurator-settings-OLzdK {\n  top: 2.5rem;\n  height: calc(100% - 50px);\n}\n\n/*****************************TabGroup -- Mobile Portrait *****************************/\n\n.portrait-XiOPl .wcConfigurator-steps-1--dZ {\n  position: absolute;\n  left: 0px;\n  top: 0;\n  width: calc(100% - 50px);\n  height: 50px;\n}\n\n.portrait-XiOPl .wcConfigurator-steps-1--dZ.burger-visible-AFcf0 {\n  left: 50px;\n  width: calc(100% - 50px - 50px);\n}\n\n.portrait-XiOPl.foldedup-Qqnox .wcConfigurator-steps-1--dZ {\n  top: 0px;\n}\n\n/******************Navigaton Buttons -- Mobile Portrait *******************************/\n\n.portrait-XiOPl .wcConfigurator-settings-actions-xqcr5 {\n  bottom: 0px;\n  width: calc(100% - 10px);\n\n  height: calc(var(--configuratorActionHeight) - 5px);\n  margin: 0 5px 5px 5px;\n  padding-top: 0px;\n  right: 0px;\n}\n.portrait-XiOPl.isOnLastStep-eAWSY .wcConfigurator-settings-actions-xqcr5,\n.portrait-XiOPl.settings-hidden-NnHMW .wcConfigurator-settings-actions-xqcr5 {\n  display: none !important;\n}\n\n/*********************Basket Button-- Mobile Portrait *********************************/\n\n.portrait-XiOPl .wcConfigurator-action-ycd5b,\n.portrait-XiOPl.settings-hidden-NnHMW .wcConfigurator-action-ycd5b {\n  display: none;\n}\n\n.portrait-XiOPl.isOnLastStep-eAWSY .wcConfigurator-action-ycd5b {\n  right: 0px;\n  bottom: 0px;\n  width: calc(100% - 10px);\n\n  height: calc(var(--configuratorActionHeight) - 5px);\n  margin: 0 5px 5px 5px;\n  padding-top: 0px;\n  display: block;\n}\n\n.portrait-XiOPl .progressBar-Izqk1 {\n  position: absolute;\n  width: 100%;\n  height: 4px;\n  top: 50px;\n  left: 0;\n  z-index: 1000;\n  display: flex;\n}\n\n/*********************Basket Button-- Mobile Portrait onTop *********************************/\n\n.action-on-top-UqyK5 {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 50px;\n  height: 50px;\n  background: no-repeat 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\") center center var(--primaryColor);\n  background-size: 37%;\n  z-index: 300;\n}\n\n.landscape-EyFBs,\n.portrait-XiOPl {\n  --configuratorActionHeight: 50px;\n}\n\n.wcConfigurator-YOuy8 ::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n.wcConfigurator-YOuy8 ::-webkit-scrollbar-track {\n  background: #dfdfdf;\n  border-radius: 3px;\n}\n.wcConfigurator-YOuy8 ::-webkit-scrollbar-thumb {\n  background: #b1b1b1;\n  border-radius: 3px;\n}\n";
-styleInject(css_248z);
-
-var Standard = function Standard(_ref) {
-  _objectDestructuringEmpty(_ref);
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$state = _useDivaCore.state,
-    headerInfos = _useDivaCore$state.headerInfos,
-    isFullscreenComponent = _useDivaCore$state.isFullscreenComponent;
-  useEffect(function () {
-    viewHandler.layoutRendered = true;
-    viewHandler.initCSSVariablesObj(cssVariables);
-  }, []);
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsxs("div", {
-      ref: function ref(configuratorRef) {
-        return viewHandler.uiState.setConfiguratorRef(configuratorRef);
-      },
-      style: {
-        pointerEvents: viewHandler.uiState.configuratorDisabled ? 'none' : undefined
-      },
-      hidden: viewHandler.uiState.configuratorHidden,
-      id: "wcConfigurator",
-      className: classnames(wcConfigurator, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined, viewHandler.uiState.configSettingsIsFoldedUp ? foldedup : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.configSettingsIsHidden ? settingsHidden : undefined, viewHandler.uiState.configSettingsIsMinExpanded ? minExpanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? maxExpanded : undefined, viewHandler.actionButtonState.isOnLastStep ? isOnLastStep : undefined, isFullscreenComponent ? closeButtonVisible : undefined),
-      children: [/*#__PURE__*/jsx(Product, {
-        className: wcConfiguratorProduct
-      }), !viewHandler.uiState.isInMobileView && /*#__PURE__*/jsxs("div", {
-        className: wcConfiguratorSettingsWrapper,
-        children: [/*#__PURE__*/jsx(TabGroup, {
-          className: wcConfiguratorSteps
-        }), /*#__PURE__*/jsx(Settings, {
-          className: wcConfiguratorSettings
-        }), /*#__PURE__*/jsx(NavigationButtons, {
-          className: wcConfiguratorSettingsActions
-        }), /*#__PURE__*/jsx(BasketActionStandard, {
-          containerClassName: wcConfiguratorAction
-        })]
-      }), viewHandler.uiState.isInMobileView && /*#__PURE__*/jsxs(Fragment, {
-        children: [/*#__PURE__*/jsx(TabGroup, {
-          className: classnames(wcConfiguratorSteps, headerInfos.onlyBurgerVisibles || isFullscreenComponent ? burgerVisible : undefined),
-          showCloseButtonInMobile: isFullscreenComponent ? 'left' : undefined
-        }), viewHandler.uiState.isInMobileView && /*#__PURE__*/jsx(ProgressBar, {
-          className: progressBar
-        }), /*#__PURE__*/jsx(Settings, {
-          className: wcConfiguratorSettings
-        }), /*#__PURE__*/jsx(NavigationButtons, {
-          className: classnames(wcConfiguratorSettingsActions)
-        }), /*#__PURE__*/jsx(BasketActionStandard, {
-          containerClassName: wcConfiguratorAction
-        }), /*#__PURE__*/jsx(BasketMobile, {
-          className: actionOnTop
-        })]
-      })]
-    }), /*#__PURE__*/jsx(BarrierActions, {}), viewHandler.settingsState.inputBoxVisible && /*#__PURE__*/jsx(Inputbox, {})]
-  });
-};
-var cssVariables = {
-  '--primaryColor': '#d60084',
-  '--secondaryColor': '#4b4b4b',
-  '--thirdColor': '#e5e5e5; ',
-  '--globalBorderRadius': '3px',
-  '--articlePosNrRadius': '50%',
-  '--articlePosNrSize': '1.5rem',
-  '--articlePosNrFontSize': '1.1rem',
-  '--galleryItemRadius': '50%',
-  '--galleryItemRowCount': '5',
-  '--galleryItemMargin': '0.5%',
-  '--galleryItemRowCountSmall': '6',
-  '--galleryItemMarginSmall': '0.3%',
-  '--galleryItemBorder': '0px',
-  '--galleryItemBorderColor': '#e8e9ed',
-  '--galleryItemBorderSelColor': 'var(--secondaryColor)',
-  '--galleryItemBorderHoverColor': 'var(--thirdColor)',
-  '--lineHeight1': '20.8px',
-  '--fontWeight1': '300',
-  '--boxShadowHover': '0px 1px 4px rgba(0, 0, 0, 0.15)',
-  '--boxShadowActive': '0px 1px 4px rgba(0, 0, 0, 0.3)',
-  '--itemsMargin': '11.2px 0 0 0',
-  '--tabGroupBackground': 'unset',
-  '--settingsBackgroundColor': 'rgba(248, 248, 248, 0.9)',
-  '--settingsScrollerPaddingTopBottom': '0px',
-  '--settingsScrollerPaddingRight': '5px',
-  '--settingsScrollerPaddingLeft': '5px',
-  '--foldArrowMarginRight': 'calc(50% - 8px)',
-  '--configuratorActionHeight': '50px',
-  '--configuratorActionWidthForthBackSpacer': '6px',
-  '--configuratorActionForthWidth': 'calc((100% - 53px) - (var(--configuratorActionWidthForthBackSpacer) / 2))',
-  '--configuratorActionBackWidth': 'calc(53px - (var(--configuratorActionWidthForthBackSpacer) / 2))'
-};
-var index = observer(Standard);
-
-export { index as default };