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

package/build/esm/index-09885091.js

@@ -1,235 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useRef, useState, useEffect } from 'react';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-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(--tabGroupStepVisitedIcon, #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 getShapePoints = function getShapePoints(w, h, first, last) {
-  if (first && last) return [[0, h], [0, 0], [w, 0], [w, h]];
-  if (first) return [[0, h - 8], [0, 0], [w, 0], [w, h - 8], [64, h]];
-  if (last) return [[0, h], [0, 0], [64, 8], [w, 0], [w, h]];
-  return [[0, h - 8], [0, 0], [64, 8], [w, 0], [w, h - 8], [64, h]];
-};
-var getRoundedPath = function getRoundedPath(points, radius) {
-  var n = points.length;
-  var parts = [];
-  for (var i = 0; i < n; i++) {
-    var prev = points[(i - 1 + n) % n];
-    var curr = points[i];
-    var next = points[(i + 1) % n];
-    var dx1 = prev[0] - curr[0],
-      dy1 = prev[1] - curr[1],
-      len1 = Math.sqrt(dx1 * dx1 + dy1 * dy1);
-    var dx2 = next[0] - curr[0],
-      dy2 = next[1] - curr[1],
-      len2 = Math.sqrt(dx2 * dx2 + dy2 * dy2);
-    var r = Math.min(radius, len1 / 2, len2 / 2);
-    var sx = curr[0] + dx1 / len1 * r,
-      sy = curr[1] + dy1 / len1 * r;
-    var ex = curr[0] + dx2 / len2 * r,
-      ey = curr[1] + dy2 / len2 * r;
-    parts.push(i === 0 ? "M".concat(sx, " ").concat(sy) : "L".concat(sx, " ").concat(sy));
-    parts.push("Q".concat(curr[0], " ").concat(curr[1], " ").concat(ex, " ").concat(ey));
-  }
-  parts.push('Z');
-  return parts.join(' ');
-};
-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 _useState = useState(8),
-    _useState2 = _slicedToArray(_useState, 2),
-    borderRadius = _useState2[0],
-    setBorderRadius = _useState2[1];
-  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);
-    if (tabGroupItemRef.current) {
-      var raw = getComputedStyle(tabGroupItemRef.current).getPropertyValue('--globalBorderRadius').trim();
-      if (raw) {
-        var parsed = parseFloat(raw);
-        if (!isNaN(parsed)) setBorderRadius(parsed);
-      }
-    }
-  }, [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 shapePoints = getShapePoints(width, height, !!isFirstItem, !!isLastItem);
-  var pathData = getRoundedPath(shapePoints, borderRadius);
-  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("path", {
-      className: classnames(verticalItemPoligonClass, tabGroupActive ? wcActiveStepClass : undefined, tabGroupVisited ? wcVisitedStepClass : undefined),
-      d: pathData
-    }), /*#__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 };

package/build/esm/index-0a21882a.js

@@ -1,154 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler, P as PricePreview, G as GenericToolTip } from './index-87690a5b.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useState } from 'react';
-import { w as wcFavoriteSel, a as wcFavorite } from './index.module-6edd1343.js';
-import { useHover, useLayer } from 'react-laag';
-import MetaData from './index-9fd12b17.js';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import InfoIcon from './index-53540b2b.js';
-import ReverseCheck from './index-9294fdd8.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-import '@mui/icons-material/Block';
-import '@mui/icons-material/Warning';
-
-var paletteItem = "palette-item-0YKyA";
-var wcVCodexText = "wcVCodexText-oxSnB";
-var sel = "sel-Mp0M2";
-var imageWrapper = "imageWrapper-wAIJh";
-var small = "small-NQCY6";
-var wcImage = "wcImage--G64h";
-var titleWrapper = "titleWrapper-kC1Fd";
-var title = "title-gcSeP";
-var mobile = "mobile--MrOW";
-var tablet = "tablet-R7-Yj";
-var big = "big-Rc8hW";
-var css_248z = "/*Size Normal */\n\n.palette-item-0YKyA {\n  border-radius: var(--globalBorderRadius);\n  position: relative;\n  z-index: 100;\n  transition: all 0.15s ease;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.palette-item-0YKyA:active,\n.palette-item-0YKyA:hover {\n  z-index: 200;\n  transition: 0.15s ease;\n}\n\n.wcVCodexText-oxSnB {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 100%;\n  color: white;\n  display: none;\n  text-align: center;\n}\n\n.palette-item-0YKyA:hover .wcVCodexText-oxSnB,\n.sel-Mp0M2 .wcVCodexText-oxSnB {\n  display: block;\n}\n\n.imageWrapper-wAIJh {\n  border-radius: calc(var(--globalBorderRadius) * 2 + 2px);\n  border: 1px rgb(230, 230, 230) solid;\n  display: flex;\n  transition: 0.15s ease;\n  position: relative;\n}\n.palette-item-0YKyA:hover .imageWrapper-wAIJh {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px var(--primaryColor) solid;\n  border: 1px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n.sel-Mp0M2.palette-item-0YKyA:hover .imageWrapper-wAIJh,\n.small-NQCY6.sel-Mp0M2.palette-item-0YKyA:hover .imageWrapper-wAIJh {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n  border: 1px rgb(230, 230, 230) solid;\n}\n.sel-Mp0M2 .imageWrapper-wAIJh,\n.small-NQCY6.sel-Mp0M2 .imageWrapper-wAIJh {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n}\n\n.wcImage--G64h {\n  width: calc(100% - 8px);\n  border: 4px white solid;\n  border-radius: calc(var(--globalBorderRadius) * 2 + 2px);\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  -o-object-fit: contain;\n     object-fit: contain;\n  background-color: #fff;\n  transition: border 0.3s ease;\n  aspect-ratio: 1/1;\n}\n.sel-Mp0M2 .wcImage--G64h,\n.small-NQCY6.sel-Mp0M2 .wcImage--G64h {\n  border: 4px var(--primaryColor) solid;\n  border: 4px var(--optionItemBorderSelColor, var(--primaryColor)) solid;\n}\n\n.hexColor-47l-a {\n  width: 80px;\n  height: 80px;\n}\n\n.titleWrapper-kC1Fd {\n  display: flex;\n  justify-content: center;\n  overflow: visible;\n  max-height: 32px;\n}\n\n.title-gcSeP {\n  text-align: center;\n  width: 100%;\n  height: 32px;\n  min-height: -moz-fit-content;\n  min-height: fit-content;\n  max-height: -moz-fit-content;\n  max-height: fit-content;\n  font-size: 14px;\n  line-height: 16px;\n  overflow: hidden;\n  display: -webkit-box;\n  word-wrap: break-word;\n  -webkit-box-orient: vertical;\n  -webkit-hyphens: auto;\n  hyphens: auto;\n  -webkit-line-clamp: 2;\n  transition: height 0.3s ease-out;\n}\n\n.mobile--MrOW:not(.tablet-R7-Yj) .title-gcSeP {\n  font-size: 12px;\n  line-height: 14px;\n}\n\n.palette-item-0YKyA:hover .title-gcSeP,\n.palette-item-0YKyA:focus .title-gcSeP {\n  max-height: -moz-fit-content;\n  max-height: fit-content;\n  min-height: -moz-fit-content;\n  min-height: fit-content;\n  -webkit-line-clamp: 30;\n  height: 50px;\n  z-index: 200;\n  background-color: var(--settingsBackgroundColor);\n  border-bottom-left-radius: 6px;\n  border-bottom-right-radius: 6px;\n  transition: height 0.3s ease-in;\n}\n\n@supports (-moz-appearance: none) {\n  .palette-item-0YKyA:hover .title-gcSeP,\n  .palette-item-0YKyA:focus .title-gcSeP {\n    height: -moz-fit-content;\n    height: fit-content;\n  }\n}\n\n/* Size Small */\n\n.small-NQCY6 .wcVCodexText-oxSnB {\n  font-size: 12px;\n}\n\n.small-NQCY6 .title-gcSeP {\n  font-size: 12px;\n  height: 15px;\n  -webkit-line-clamp: 1;\n}\n\n.small-NQCY6 .titleWrapper-kC1Fd {\n  max-height: 14px;\n}\n\n.mobile--MrOW:not(.tablet-R7-Yj).small-NQCY6 .title-gcSeP {\n  font-size: 11px;\n  height: 14px;\n}\n\n.mobile--MrOW:not(.tablet-R7-Yj).small-NQCY6 .titleWrapper-kC1Fd {\n  max-height: 14px;\n}\n\n/* Size big */\n\n.big-Rc8hW .wcVCodexText-oxSnB {\n  font-size: 15px;\n}\n\n.big-Rc8hW .title-gcSeP {\n  font-size: 15px;\n  -webkit-line-clamp: 2;\n}\n\n.mobile--MrOW:not(.tablet-R7-Yj).big-Rc8hW .title-gcSeP {\n  font-size: 13px;\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 Option = function Option(_ref) {
-  var _item$hexColor, _renderLayer;
-  var itemP = _ref.item,
-    type = _ref.type,
-    paletteId = _ref.paletteId,
-    hidePricePreview = _ref.hidePricePreview,
-    namePostFix = _ref.namePostFix;
-  var item = itemP;
-  var viewHandler = useViewHandler();
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    metaDataVisible = _useState2[0],
-    setMetaDataVisible = _useState2[1];
-  var onClick = function onClick() {
-    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;
-
-  /* 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,
-    className: classnames(paletteItem, item.sel ? sel : undefined, type == 'big' ? big : undefined, type == 'small' ? small : undefined, viewHandler.getIsInMobileView() ? mobile : undefined, viewHandler.uiState.isTablet ? tablet : undefined),
-    onClick: onClick
-  }, triggerProps), hoverProps), {}, {
-    children: [/*#__PURE__*/jsxs("div", {
-      className: classnames(imageWrapper),
-      children: [viewHandler.getViewConfig().showVCodexInGallery && item.vCodex && /*#__PURE__*/jsx("div", {
-        className: classnames(wcVCodexText),
-        children: item.vCodex
-      }), item.image ? /*#__PURE__*/jsx("img", {
-        className: classnames(wcImage),
-        src: type != 'small' ? item.image.replace('_gal', '') : item.image
-      }) : /*#__PURE__*/jsx("div", {
-        className: classnames(wcImage),
-        style: {
-          backgroundColor: '#' + ((_item$hexColor = item.hexColor) !== null && _item$hexColor !== void 0 ? _item$hexColor : 'fff')
-        }
-      }), item.contentItemId && /*#__PURE__*/jsx(InfoIcon, {
-        item: item
-      }, item.codex)]
-    }), /*#__PURE__*/jsx("div", {
-      className: titleWrapper,
-      children: /*#__PURE__*/jsx("div", {
-        className: title,
-        dangerouslySetInnerHTML: {
-          __html: item.text + (namePostFix ? namePostFix : '')
-        }
-      })
-    }), item.doShowFav && /*#__PURE__*/jsx("div", {
-      className: item.isFav ? wcFavoriteSel : wcFavorite,
-      onClick: function onClick() {
-        return viewHandler.paletteViewHandler.clickedOnFavIcon(item);
-      }
-    }), /*#__PURE__*/jsx(MetaData, {
-      style: {
-        position: 'relative',
-        "float": 'left',
-        display: 'none'
-      },
-      metaData: item.metaData,
-      visible: [metaDataVisible, setMetaDataVisible]
-    }, item.codex), !hidePricePreview && item.pricePreviewPromise !== undefined && /*#__PURE__*/jsx(PricePreview, {
-      asyncPricePreview: item.pricePreviewPromise,
-      sel: item.sel,
-      style: type == 'small' ? {
-        fontSize: 9
-      } : undefined
-    }), item.checkForReversingChanges !== undefined && /*#__PURE__*/jsx(ReverseCheck, {
-      item: item,
-      paletteId: paletteId
-    }), isOver && ((_renderLayer = renderLayer) === null || _renderLayer === void 0 ? void 0 : _renderLayer(/*#__PURE__*/jsx(GenericToolTip, {
-      text: item.text + (item.freeText ? item.freeText : '') + (namePostFix ? namePostFix : ''),
-      hexColor: item.hexColor,
-      desciption: metaDataVisible,
-      pricePreviewPromise: item.pricePreviewPromise,
-      image: item.image,
-      layerProps: layerProps
-    }, item.codex)))]
-  }));
-};
-var GalleryText2 = observer(Option);
-
-export { GalleryText2 as default };

package/build/esm/index-0afb8721.js

@@ -1,108 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { s as styleInject, u as useViewHandler } from './index-87690a5b.js';
-import { useRef, useEffect } from 'react';
-import { observer } from 'mobx-react-lite';
-import CheckoutFormNew from './index-38796bf1.js';
-import ProductCenter from './index-f3bd61b0.js';
-import ContentItemWrapper from './index-eec1a6f8.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/slicedToArray';
-import 'react-dynamic-multi-render';
-import '@crystaldesign/diva-core';
-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-switch';
-import 'react-countup';
-import 'react-dropdown';
-import './index-b432eaa1.js';
-import './index-95163002.js';
-import './index-44b403f5.js';
-import './index-548831ce.js';
-import './index.module-d0221b96.js';
-import './index-8297b5a7.js';
-import 'swiper/react';
-import 'swiper/modules';
-import './index-249b0ad2.js';
-import './index-a2197de6.js';
-import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-f2788552.js';
-import './index-04649c6f.js';
-import './index-ed319bd8.js';
-import './index-82466b67.js';
-import './index-ea77111b.js';
-import 'react-laag';
-import './index-e18dc0ba.js';
-import 'react-qr-code';
-import './index-77316c45.js';
-import './index-b36ce14b.js';
-import './index-482acfd3.js';
-import '@crystaldesign/content-item';
-
-var arrow = "arrow-GTKSC";
-var css_248z = ".arrow-GTKSC {\n  bottom: 40px;\n  right: 8px;\n  position: absolute;\n  width: 70px;\n  height: 55px;\n  transform: rotate(90deg);\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 26 10%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3Bstroke%3A%236f6f6f%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3EElement 1%3C%2Ftitle%3E%3Cg id%3D%22Ebene_2%22 data-name%3D%22Ebene 2%22%3E%3Cg id%3D%22Ebene_1-2%22 data-name%3D%22Ebene 1%22%3E%3Cpath class%3D%22cls-1%22 d%3D%22M10.5.5l5%2C4.29-5%2C4.71%22%2F%3E%3Cpath class%3D%22cls-1%22 d%3D%22M.5.5l5%2C4.29L.5%2C9.5%22%2F%3E%3Cpath class%3D%22cls-1%22 d%3D%22M20.5.5l5%2C4.29-5%2C4.71%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  z-index: 300;\n}\n";
-styleInject(css_248z);
-
-var _excluded = ["contentItemStartPos"];
-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 Product = function Product(_ref) {
-  var _viewHandler$configSt2;
-  var contentItemStartPos = _ref.contentItemStartPos,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var viewHandler = useViewHandler();
-  var ref = useRef(null);
-  var onClick = function onClick() {
-    if (ref.current) {
-      var scrollTo = ref.current.getBoundingClientRect().height;
-      if (ref.current.scrollTop > 100) {
-        scrollTo = 0;
-      }
-      ref.current.scrollTo({
-        top: scrollTo,
-        behavior: 'smooth'
-      });
-    }
-  };
-  var setRef = function setRef(element) {
-    ref.current = element;
-    viewHandler.productState.setProductElement(element);
-  };
-  useEffect(function () {
-    var _viewHandler$configSt;
-    if (!viewHandler.uiState.isLoading && (_viewHandler$configSt = viewHandler.configState.paramters) !== null && _viewHandler$configSt !== void 0 && _viewHandler$configSt.checkout) {
-      onClick();
-    }
-  }, [(_viewHandler$configSt2 = viewHandler.configState.paramters) === null || _viewHandler$configSt2 === void 0 ? void 0 : _viewHandler$configSt2.checkout, viewHandler.uiState.isLoading]);
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({
-    ref: setRef
-  }, props), {}, {
-    id: "wcConfigurator-product",
-    children: [!viewHandler.uiState.isLoading && /*#__PURE__*/jsx("div", {
-      className: arrow,
-      onClick: onClick
-    }), /*#__PURE__*/jsx(ProductCenter, {
-      style: {
-        height: 'calc(100% - 40px)',
-        width: 'calc(100% - 40px)',
-        top: 0,
-        margin: '20px'
-      }
-    }), !viewHandler.uiState.isLoading && viewHandler.divaWebPlanner.getBasket() !== undefined && /*#__PURE__*/jsx(CheckoutFormNew, {}), /*#__PURE__*/jsx(ContentItemWrapper, {
-      direction: contentItemStartPos
-    })]
-  }));
-};
-var Product$1 = observer(Product);
-
-export { Product$1 as default };

package/build/esm/index-0ce7666f.js

@@ -1,107 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon } from './index-87690a5b.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import 'react';
-import { useTranslation } from '@crystaldesign/diva-core';
-import { w as wcConfiguratorSettingsActions, i as isOnFirstStep, a as isOnFirstStepDisabled, b as isOnLastStep, v as vertical, p as portrait, l as landscape, d as container, e as button, f as back, c as checkoutButton, g as forth } from './index.module-03af8d8d.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/slicedToArray';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var _excluded = ["className", "showBackButtonText", "backOverwrite", "forthOverwrite", "showNextButtonIcon", "showCheckoutButtons"];
-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 ActionNavigation = function ActionNavigation(_ref) {
-  var _viewHandler$uiState$;
-  var className = _ref.className,
-    showBackButtonText = _ref.showBackButtonText,
-    backOverwrite = _ref.backOverwrite,
-    forthOverwrite = _ref.forthOverwrite,
-    showNextButtonIcon = _ref.showNextButtonIcon,
-    showCheckoutButtons = _ref.showCheckoutButtons,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, props), {}, {
-    className: classnames(className, wcConfiguratorSettingsActions, viewHandler.actionButtonState.isOnFirstStep ? isOnFirstStep : undefined, viewHandler.actionButtonState.isOnFirstStepDisabled ? isOnFirstStepDisabled : undefined, viewHandler.actionButtonState.isOnLastStep ? isOnLastStep : undefined, viewHandler.tabGroupState.curTabGroupType == 'vertical' ? vertical : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined),
-    children: /*#__PURE__*/jsxs("div", {
-      className: container,
-      children: [/*#__PURE__*/jsxs("div", {
-        className: classnames(button, back, backOverwrite),
-        onClick: function onClick() {
-          window.lastNavigationType = 'NAVIGATION_STANDARD_BACK_BUTTON';
-          viewHandler.actionButtonState.onClickConfiguratorSettingsBack();
-        },
-        children: [!showBackButtonText && /*#__PURE__*/jsx("svg", {
-          width: "12",
-          height: "22",
-          viewBox: "0 0 12 22",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /*#__PURE__*/jsx("path", {
-            d: "M11 1L1 11L11 21",
-            stroke: "var(--navigateBack, var(--secondaryColor))",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          })
-        }), showBackButtonText && t('configurator.Back')]
-      }), showCheckoutButtons && ((_viewHandler$uiState$ = viewHandler.uiState.checkoutConfig) === null || _viewHandler$uiState$ === void 0 ? void 0 : _viewHandler$uiState$.buttons.filter(function (b) {
-        return evalVisible(b, viewHandler, 'navigator');
-      }).map(function (b) {
-        return /*#__PURE__*/jsx("div", {
-          className: checkoutButton,
-          onClick: function onClick() {
-            return _onClickCheckout(b, viewHandler, b.index, t);
-          },
-          children: /*#__PURE__*/jsx(Icon, {
-            checkoutButton: _objectSpread(_objectSpread({}, b), {}, {
-              isPrimary: false
-            }),
-            size: 40
-          })
-        }, b.index);
-      })), /*#__PURE__*/jsxs("div", {
-        className: classnames(button, forth, forthOverwrite),
-        onClick: function onClick() {
-          window.lastNavigationType = 'NAVIGATION_STANDARD_FORWARD_BUTTON';
-          viewHandler.actionButtonState.onClickConfiguratorSettingsForth();
-        },
-        id: "wcConfigurator-action-next",
-        children: [t('configurator.Next'), showNextButtonIcon && /*#__PURE__*/jsx("svg", {
-          width: "12",
-          height: "22",
-          viewBox: "0 0 12 22",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /*#__PURE__*/jsx("path", {
-            d: "M11 1L1 11L11 21",
-            stroke: "var(--navigateForthFontColor, #ffffff)",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          })
-        })]
-      })]
-    })
-  }));
-};
-var ActionNavigation$1 = observer(ActionNavigation);
-
-export { ActionNavigation$1 as default };