@crystaldesign/diva-web-planner-react 26.8.0-beta.9 → 26.9.0-beta.1

package/build/esm/index-f4388a6d.js

@@ -1,70 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { u as useViewHandler, T as Toggle } from './index-82c8e7d7.js';
-import 'react';
-import { DivaUtils } from '@crystaldesign/diva-core';
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import 'mobx-react-lite';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-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 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var SummaryVariantButton = function SummaryVariantButton(_ref) {
-  var _variantPalette$1$gro;
-  _ref.item;
-  var viewHandler = useViewHandler();
-  var variantPalette = viewHandler.settingsState.itemPaletteArr.find(function (item) {
-    return item[1].type === 'VARIANTS' && item[1].visible;
-  });
-  if (!variantPalette) return /*#__PURE__*/jsx(Fragment, {});
-  var variants = (_variantPalette$1$gro = variantPalette[1].groups) === null || _variantPalette$1$gro === void 0 || (_variantPalette$1$gro = _variantPalette$1$gro[0]) === null || _variantPalette$1$gro === void 0 ? void 0 : _variantPalette$1$gro.items;
-  if (!(variants !== null && variants !== void 0 && variants.length)) return /*#__PURE__*/jsx(Fragment, {});
-  var copyTableToClipboard = function copyTableToClipboard() {
-    var html = '<h3>' + viewHandler.productState.webConifguratorTitle + ' - ' + Object.values(viewHandler.settingsState.articleInfos).map(function (article) {
-      return article.name;
-    }).join(', ') + '</h3>' + '<table>' + variants.map(function (variant) {
-      if (variant.index === undefined) return '';
-      return '<tr>' + '<td>' + 'index: ' + variant.index + '</td>' + variant.variantValues.map(function (values) {
-        return (values.optionValueImage ? '<td>' + '<img src="' + values.optionValueImage + '"/>' + '</td>' : '') +
-        //::::
-        '<td>' + (values.optionName + ' (' + values.opt.substring(3) + '):') + '<br/>' + (values.optionValueName + ' (' + values.opv.substring(3) + ')') + '</td>';
-      }).join('') + '<td>' + DivaUtils.formatPrice(variant.price) + '</td>' + '</tr>';
-    }).join('') + '</table>';
-    var blob = new Blob([html], {
-      type: 'text/html'
-    });
-    navigator.clipboard.write([new ClipboardItem(_defineProperty({}, blob.type, blob))]);
-  };
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsx("button", {
-      onClick: copyTableToClipboard,
-      children: "als Tabelle kopieren"
-    }), /*#__PURE__*/jsx(Toggle, {
-      height: 32,
-      handleDiameter: 22,
-      width: 60,
-      onChange: function onChange() {
-        variants[0].onToggle(true);
-        viewHandler.paletteViewHandler.updateCurPaletteData(true);
-      },
-      state: !variants.find(function (variant) {
-        return variant.disabled;
-      })
-    })]
-  });
-};
-
-export { SummaryVariantButton as default };

package/build/esm/index-f4f28366.js

@@ -1,51 +0,0 @@
-import './index-82c8e7d7.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 '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-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 Trash = function Trash(_ref) {
-  var item = _ref.item,
-    rect = _ref.rect,
-    onElement = _ref.onElement,
-    plannerUIProps = _ref.plannerUIProps;
-  var left = rect.doUseCalc ? rect.leftCalc : item.position.interpretation == 'percentage' ? rect.left + '%' : rect.left + 'px';
-  var top = rect.doUseCalc ? rect.topCalc : item.position.interpretation == 'percentage' ? 'calc(' + rect.top + '% )' : rect.top + 'px';
-  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: left,
-      top: top
-    },
-    className: classnames(plannerUIProps.classes.trash.trashClass, plannerUIProps.classes.buttonGeneral, item.plannerMode == 'BOX' ? plannerUIProps.classes.trash.boxplanner : undefined),
-    id: "testDel",
-    children: item.posNr
-  });
-};
-var Trash$1 = observer(Trash);
-
-export { Trash$1 as default };

package/build/esm/index-f51486ef.js

@@ -1,177 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-82c8e7d7.js';
-import 'react';
-import { Rnd } from 'react-rnd';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@crystaldesign/diva-core';
-import 'mobx-react-lite';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-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 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var container = "container-efJ5C";
-var header = "header-1CJv0";
-var headerTitle = "headerTitle-uXM2j";
-var closeBtn = "closeBtn-5GDgH";
-var body = "body-x-0by";
-var bodyScroll = "bodyScroll-7BmZx";
-var css_248z = ".container-efJ5C {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 6px;\n  overflow: hidden;\n  background: #fff;\n  z-index: 1500;\n}\n\n.header-1CJv0 {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: #f3f3f3;\n  border-bottom: 1px solid #e0e0e0;\n  cursor: move;\n  flex-shrink: 0;\n}\n\n.headerTitle-uXM2j {\n  font-weight: 600;\n  font-size: 14px;\n}\n\n.closeBtn-5GDgH {\n  background: none;\n  border: none;\n  font-size: 20px;\n  line-height: 1;\n  cursor: pointer;\n  padding: 0 4px;\n  color: #666;\n}\n\n.closeBtn-5GDgH:hover {\n  color: #333;\n}\n\n.body-x-0by {\n  flex: 1 1 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.bodyScroll-7BmZx {\n  flex: 1 1 0;\n  min-height: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n/* Dark mode – matches backoffice (portaled to body) */\nbody.darkmode .container-efJ5C {\n  background: rgb(20, 20, 20);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);\n}\n\nbody.darkmode .header-1CJv0 {\n  background: rgb(30, 30, 30);\n  border-bottom-color: rgba(255, 255, 255, 0.12);\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .headerTitle-uXM2j {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .closeBtn-5GDgH {\n  color: rgba(255, 255, 255, 0.65);\n}\n\nbody.darkmode .closeBtn-5GDgH:hover {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .body-x-0by {\n  background: rgb(20, 20, 20);\n  color: rgb(255, 255, 255);\n}\n";
-styleInject(css_248z);
-
-var SNAP_THRESHOLD = 24;
-
-/** Snaps position to viewport edges when within threshold (dock-style snapping). */
-function getSnappedBounds(x, y, width, height) {
-  var vw = window.innerWidth;
-  var vh = window.innerHeight;
-  var nx = x;
-  var ny = y;
-  if (x <= SNAP_THRESHOLD) nx = 0;
-  if (x + width >= vw - SNAP_THRESHOLD) nx = Math.max(0, vw - width);
-  if (y <= SNAP_THRESHOLD) ny = 0;
-  if (y + height >= vh - SNAP_THRESHOLD) ny = Math.max(0, vh - height);
-  return {
-    x: nx,
-    y: ny
-  };
-}
-/** Resize handle styles – positioned inside the container so they are not clipped by overflow:hidden. */
-var resizeHandleStyles = {
-  top: {
-    top: 0,
-    height: 12
-  },
-  right: {
-    right: 0,
-    left: 'auto',
-    width: 12
-  },
-  bottom: {
-    bottom: 0,
-    top: 'auto',
-    height: 12
-  },
-  left: {
-    left: 0,
-    width: 12
-  },
-  topRight: {
-    top: 0,
-    right: 0,
-    left: 'auto',
-    bottom: 'auto',
-    width: 16,
-    height: 16
-  },
-  bottomRight: {
-    bottom: 0,
-    right: 0,
-    left: 'auto',
-    top: 'auto',
-    width: 16,
-    height: 16
-  },
-  bottomLeft: {
-    bottom: 0,
-    left: 0,
-    right: 'auto',
-    top: 'auto',
-    width: 16,
-    height: 16
-  },
-  topLeft: {
-    top: 0,
-    left: 0,
-    right: 'auto',
-    bottom: 'auto',
-    width: 16,
-    height: 16
-  }
-};
-var FloatingWindow = function FloatingWindow(_ref) {
-  var windowType = _ref.windowType,
-    title = _ref.title,
-    bounds = _ref.bounds,
-    children = _ref.children;
-  var viewHandler = useViewHandler();
-  var handleDragStop = function handleDragStop(_e, d) {
-    var snapped = getSnappedBounds(d.x, d.y, bounds.width, bounds.height);
-    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, snapped);
-  };
-  var handleResizeStop = function handleResizeStop(_e, _direction, ref, _delta, position) {
-    var _ref$style$width, _ref$style$height;
-    var width = parseInt((_ref$style$width = ref.style.width) !== null && _ref$style$width !== void 0 ? _ref$style$width : String(bounds.width), 10);
-    var height = parseInt((_ref$style$height = ref.style.height) !== null && _ref$style$height !== void 0 ? _ref$style$height : String(bounds.height), 10);
-    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, {
-      x: position.x,
-      y: position.y,
-      width: width,
-      height: height
-    });
-  };
-  var handleClose = function handleClose() {
-    viewHandler.wysiwygDebugState.removeWysiwygWindow(windowType);
-  };
-  return /*#__PURE__*/jsxs(Rnd, {
-    position: {
-      x: bounds.x,
-      y: bounds.y
-    },
-    size: {
-      width: bounds.width,
-      height: bounds.height
-    },
-    onDragStop: function onDragStop(e, d) {
-      return handleDragStop(e, d);
-    },
-    onResizeStop: handleResizeStop,
-    dragHandleClassName: header,
-    minWidth: 280,
-    minHeight: 200,
-    className: container,
-    style: {
-      display: 'flex',
-      flexDirection: 'column'
-    },
-    bounds: "window",
-    resizeHandleStyles: resizeHandleStyles,
-    resizeHandleWrapperStyle: {
-      zIndex: 1000
-    },
-    children: [/*#__PURE__*/jsxs("div", {
-      className: header,
-      children: [/*#__PURE__*/jsx("span", {
-        className: headerTitle,
-        children: title
-      }), /*#__PURE__*/jsx("button", {
-        type: "button",
-        className: closeBtn,
-        onClick: handleClose,
-        "aria-label": "Close",
-        children: "\xD7"
-      })]
-    }), /*#__PURE__*/jsx("div", {
-      className: body,
-      children: /*#__PURE__*/jsx("div", {
-        className: bodyScroll,
-        children: children
-      })
-    })]
-  });
-};
-
-export { FloatingWindow as default };

package/build/esm/index-f65a539f.js

@@ -1,165 +0,0 @@
-import { s as styleInject, u as useViewHandler, b as PriceCounter } from './index-82c8e7d7.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import 'react';
-import { getLogger, useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import Functions from './index-ffdf58fb.js';
-import { ContentBoxComponent } from '@crystaldesign/content-box';
-import { u as useCustomDimensions } from './useCustomDimensions-42666d28.js';
-import { ContentItemComponent } from '@crystaldesign/content-item';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-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 './index-fd281264.js';
-
-var wrapper = "wrapper-y4VmL";
-var wcConfiguratorProductHeader = "wcConfiguratorProductHeader-W1oWZ";
-var expanded = "expanded-rNRc-";
-var functionWrapper = "functionWrapper-3sgkI";
-var portrait = "portrait-Otsjq";
-var landscape = "landscape-TuCY-";
-var contentBoxWrapper = "content-box-wrapper-KgSZb";
-var maxExpanded = "max-Expanded-4m94C";
-var textbackground = "textbackground-F3b8W";
-var wcPriceinfoContainer = "wcPriceinfoContainer-bH9C-";
-var wcFormattedPrice = "wc-formatted-price--PHbM";
-var wcFormattedBruttoPrice = "wc-formatted-brutto-price-MDFl1";
-var dimensions = "dimensions-wxroF";
-var rabattVisible = "rabatt-visible-vvkfB";
-var tablet = "tablet-n1n5E";
-var fullscreen = "fullscreen-94axf";
-var sideMenuButton = "side-menu-button-NA9Lt";
-var css_248z = "/* Productdaten */\n\n.wrapper-y4VmL {\n  display: flex;\n  flex-direction: row;\n  height: 70px;\n  z-index: 112;\n  transition:\n    width 0.2s ease-in-out,\n    opacity 0.5s ease-in-out;\n  opacity: 1;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 50%;\n  justify-self: flex-start;\n  z-index: 300;\n  margin: 8px 0 0px 8px;\n  pointer-events: none;\n}\n\n.expanded-rNRc- .wcConfiguratorProductHeader-W1oWZ {\n  flex-basis: 100%;\n}\n.functionWrapper-3sgkI {\n  flex-basis: 50%;\n}\n\n.functionWrapper-3sgkI {\n  flex-basis: 100%;\n  position: relative;\n  z-index: 112;\n  margin: 16px;\n}\n.portrait-Otsjq .functionWrapper-3sgkI {\n  margin: 6px 12px;\n}\n\n.landscape-TuCY- .functionWrapper-3sgkI {\n  margin: 8px 12px 0px 0px;\n}\n\n.content-box-wrapper-KgSZb {\n  z-index: 112;\n}\n\n.expanded-rNRc-.wrapper-y4VmL {\n  width: calc(55% - 40px - 24px);\n}\n\n.max-Expanded-4m94C.wrapper-y4VmL,\n.settings-Foldedup-HM7JT.wrapper-y4VmL {\n  opacity: 0;\n}\n\n.wrapper-y4VmL h1 {\n  font-weight: 300;\n  font-size: 24px;\n  line-height: 27.2px;\n  letter-spacing: 0.2px;\n  color: var(--secondaryColor);\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  white-space: nowrap;\n}\n.textbackground-F3b8W {\n  border-radius: 0px 0px 12px 0px;\n  padding: 0px 12px 6px 8px;\n  position: absolute;\n  width: -moz-fit-content;\n  width: fit-content;\n  white-space: nowrap;\n  left: 0px;\n}\n\n.portrait-Otsjq .textbackground-F3b8W {\n  background-color: transparent;\n}\n\n.expanded-rNRc-.wrapper-y4VmL h1 {\n  max-width: 300px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.wcPriceinfoContainer-bH9C- {\n  display: flex;\n  flex-direction: column;\n}\n\n.wcPriceinfo-Zmaer {\n  color: var(--secondaryColor);\n  font-size: 14px;\n  font-size: var(--priceInfoFontSize, 14px);\n\n  -webkit-text-stroke: 0.4px;\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}\n.wrapper-y4VmL h1,\n.wc-formatted-price--PHbM,\n.wc-formatted-brutto-price-MDFl1,\n.dimensions-wxroF {\n  margin: 0px;\n  background-color: rgba(255, 255, 255, 0.5);\n  border-radius: 4px;\n  padding: 2px 4px;\n  width: -moz-fit-content;\n  width: fit-content;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          user-select: none;\n}\n\n.wc-formatted-price--PHbM {\n  color: var(--secondaryColor);\n  font-size: 16px;\n  font-size: var(--priceInfoFontSize, 16px);\n  -webkit-text-stroke: 0.4px;\n  font-weight: 700;\n  transition: color 0.3s ease-in-out;\n}\n.rabatt-visible-vvkfB .wc-formatted-price--PHbM {\n  color: rgb(220, 38, 38);\n}\n\n.wc-formatted-brutto-price-MDFl1 {\n  color: rgb(113, 113, 122);\n  font-size: 14px;\n  -webkit-text-stroke: 0.4px;\n  text-decoration: line-through;\n  height: 0px;\n  overflow: hidden;\n  opacity: 0;\n  transition:\n    height 0.3s ease-in-out,\n    opacity 0.3s ease-in-out;\n}\n\n.rabatt-visible-vvkfB .wc-formatted-brutto-price-MDFl1 {\n  height: 12px;\n  opacity: 1;\n}\n\n.dimensions-wxroF {\n  font-size: 16px;\n  color: var(--secondaryColor);\n  font-weight: 300;\n}\n\n.tablet-n1n5E .dimensions-wxroF {\n  font-size: 14px;\n}\n\n.portrait-Otsjq:not(.tablet-n1n5E) .dimensions-wxroF {\n  font-size: 12px;\n}\n\n.landscape-TuCY-.wrapper-y4VmL {\n  margin-left: 2rem;\n  width: calc(100% - 1rem);\n  height: 54.4px;\n}\n\n.fullscreen-94axf.landscape-TuCY-.wrapper-y4VmL {\n  left: 50px;\n  top: 0px;\n  margin-left: 0.5rem;\n  margin-top: 4px;\n  width: calc(100% - 1rem);\n  height: 24.4px;\n}\n\n.landscape-TuCY- h1 {\n  margin-top: 14px;\n  font-size: 22px;\n  line-height: 18px;\n  width: 67%;\n}\n\n.landscape-TuCY- .wcPriceinfo-Zmaer {\n  font-size: 14px;\n}\n\n.portrait-Otsjq .wc-formatted-price--PHbM {\n  font-size: 14px;\n}\n\n.portrait-Otsjq .wc-formatted-brutto-price-MDFl1 {\n  font-size: 11px;\n}\n\n.landscape-TuCY- .wc-formatted-price--PHbM {\n  font-size: 15px;\n}\n\n.portrait-Otsjq .wrapper-y4VmL {\n  height: 54.4px;\n  width: calc(100% - 4px);\n}\n\n.portrait-Otsjq h1 {\n  font-size: 15px;\n  line-height: 16px;\n}\n\n.tablet-n1n5E .wc-formatted-price--PHbM {\n  font-size: 16px;\n}\n\n.tablet-n1n5E .wc-formatted-brutto-price-MDFl1 {\n  font-size: 14px;\n}\n\n.tablet-n1n5E .wcPriceinfo-Zmaer {\n  font-size: 16px;\n}\n\n.tablet-n1n5E h1 {\n  font-size: 20px;\n  line-height: 22px;\n}\n\n.side-menu-button-NA9Lt {\n  width: 18px;\n  height: 18px;\n  cursor: pointer;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z%22 fill%3D%22%234F4F4F%22%2F%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z%22 fill%3D%22%234F4F4F%22%2F%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M2 18C2 17.4477 2.44772 17 3 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H3C2.44772 19 2 18.5523 2 18Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: center;\n  transition: background-color 0.3s ease;\n  z-index: 1000;\n  margin: 10px 12px;\n  aspect-ratio: 1 / 1;\n}\n\n.tablet-n1n5E .side-menu-button-NA9Lt {\n  width: 22px;\n  height: 22px;\n}\n";
-styleInject(css_248z);
-
-var LOG = getLogger('Planner', 'InfoBox');
-var ProductHeader = function ProductHeader(_ref) {
-  var _viewHandler$productS, _viewHandler$productS2, _bbox$X, _bbox$X2, _bbox$Y, _bbox$Z, _bbox$wOLT, _bbox$dOLT, _bbox$hOLT;
-  var hidePrice = _ref.hidePrice,
-    productClass = _ref.productClass;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var bbox = viewHandler.settingsState.bbox;
-  var _useDivaCore = useDivaCore(),
-    _useDivaCore$state = _useDivaCore.state,
-    hidePrices = _useDivaCore$state.hidePrices,
-    isMobile = _useDivaCore$state.dimensions.isMobile,
-    _useDivaCore$state$na = _useDivaCore$state.navigationConfiguration,
-    enableMobile = _useDivaCore$state$na.enableMobile,
-    hideHeader = _useDivaCore$state$na.hideHeader,
-    openSideMenu = _useDivaCore.actions.openSideMenu;
-  var showMobileNavButton = isMobile && enableMobile && !hideHeader;
-  var headerContentBoxProps = viewHandler.getViewConfig().productHeaderContentBox;
-  var _useCustomDimensions = useCustomDimensions(),
-    dimensions$1 = _useCustomDimensions.dimensions,
-    dimOnlyForOneArticle = _useCustomDimensions.dimOnlyForOneArticle;
-  var hideWebConfiguratorTitle = viewHandler.getViewConfig().hideWebConfiguratorTitle || viewHandler.getViewConfig().hideWebConfiguratorTitleInMobile && viewHandler.getIsInMobileView();
-  var showRabatt = viewHandler.productState.formatedBruttoPrice !== undefined && !viewHandler.getViewConfig().hideRabattPrice;
-  var showMainDimensions = viewHandler.productState.doShow3DDimensionLines || viewHandler.productState.doShowGrid || viewHandler.productState.doShowMainDimensions && !isMobile;
-  return /*#__PURE__*/jsxs("div", {
-    className: classnames(wrapper, productClass, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isTablet ? tablet : undefined, viewHandler.uiState.configSettingsIsExpanded ? expanded : undefined, viewHandler.uiState.configSettingsIsMaxExpanded ? maxExpanded : undefined, showRabatt ? rabattVisible : undefined, fullscreen),
-    children: [showMobileNavButton && /*#__PURE__*/jsx("div", {
-      id: "side-menu-button",
-      className: sideMenuButton,
-      onClick: function onClick() {
-        return openSideMenu();
-      }
-    }), /*#__PURE__*/jsxs("div", {
-      className: wcConfiguratorProductHeader,
-      "data-test-id": "configProductHeader",
-      children: [!hideWebConfiguratorTitle && /*#__PURE__*/jsx("h1", {
-        "data-test-id": "productHeaderTitle",
-        children: viewHandler.productState.webConifguratorTitle
-      }), /*#__PURE__*/jsxs("div", {
-        className: textbackground,
-        children: [!hidePrices && !hidePrice && /*#__PURE__*/jsxs("div", {
-          className: wcPriceinfoContainer,
-          children: [/*#__PURE__*/jsx("span", {
-            className: classnames(wcFormattedBruttoPrice),
-            "data-test-id": "productHeaderFormattedBruttoPrice",
-            children: /*#__PURE__*/jsx(PriceCounter, {
-              price: (_viewHandler$productS = viewHandler.productState.formatedBruttoPrice) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : 0
-            })
-          }), /*#__PURE__*/jsx("span", {
-            className: wcFormattedPrice,
-            "data-test-id": "productHeaderFormattedPrice",
-            children: /*#__PURE__*/jsx(PriceCounter, {
-              price: (_viewHandler$productS2 = viewHandler.productState.formatedCurSetPrice) !== null && _viewHandler$productS2 !== void 0 ? _viewHandler$productS2 : 0
-            })
-          })]
-        }), showMainDimensions && /*#__PURE__*/jsxs(Fragment, {
-          children: [((_bbox$X = bbox === null || bbox === void 0 ? void 0 : bbox.X) !== null && _bbox$X !== void 0 ? _bbox$X : 0) > 0 && /*#__PURE__*/jsxs("div", {
-            className: dimensions,
-            children: [/*#__PURE__*/jsxs("span", {
-              children: [t('configurator.bth_short'), ": "]
-            }), /*#__PURE__*/jsxs("span", {
-              children: [(_bbox$X2 = bbox === null || bbox === void 0 ? void 0 : bbox.X) !== null && _bbox$X2 !== void 0 ? _bbox$X2 : -1, " \xD7 ", (_bbox$Y = bbox === null || bbox === void 0 ? void 0 : bbox.Y) !== null && _bbox$Y !== void 0 ? _bbox$Y : -1, " \xD7 ", (_bbox$Z = bbox === null || bbox === void 0 ? void 0 : bbox.Z) !== null && _bbox$Z !== void 0 ? _bbox$Z : -1, " cm"]
-            })]
-          }), (bbox === null || bbox === void 0 ? void 0 : bbox.wOLT) !== undefined && /*#__PURE__*/jsxs("div", {
-            className: dimensions,
-            children: [/*#__PURE__*/jsxs("span", {
-              children: [t('configurator.without_olf'), ": "]
-            }), /*#__PURE__*/jsxs("span", {
-              children: [(_bbox$wOLT = bbox === null || bbox === void 0 ? void 0 : bbox.wOLT) !== null && _bbox$wOLT !== void 0 ? _bbox$wOLT : -1, " \xD7 ", (_bbox$dOLT = bbox === null || bbox === void 0 ? void 0 : bbox.dOLT) !== null && _bbox$dOLT !== void 0 ? _bbox$dOLT : -1, " \xD7 ", (_bbox$hOLT = bbox === null || bbox === void 0 ? void 0 : bbox.hOLT) !== null && _bbox$hOLT !== void 0 ? _bbox$hOLT : -1, " cm"]
-            })]
-          })]
-        }), (showMainDimensions || !isMobile) && !!(dimensions$1 !== null && dimensions$1 !== void 0 && dimensions$1.length) && dimensions$1.map(function (dimension) {
-          var _dimension$text, _dimension$dimension;
-          return /*#__PURE__*/jsxs("div", {
-            className: dimensions,
-            children: [/*#__PURE__*/jsxs("span", {
-              children: [(_dimension$text = dimension.text) !== null && _dimension$text !== void 0 ? _dimension$text : t('configurator.headerdimension.' + dimension.dimensionId), !dimOnlyForOneArticle && ' (' + dimension.posNrs.join(',') + ')', ":", ' ']
-            }), /*#__PURE__*/jsxs("span", {
-              children: [(_dimension$dimension = dimension.dimension) !== null && _dimension$dimension !== void 0 ? _dimension$dimension : 0, " ", dimension.unit]
-            })]
-          });
-        })]
-      })]
-    }), /*#__PURE__*/jsx("div", {
-      className: functionWrapper,
-      children: /*#__PURE__*/jsx(Functions, {})
-    }), !viewHandler.uiState.isInMobileView && viewHandler.productState.currentBanner && /*#__PURE__*/jsx("div", {
-      className: contentBoxWrapper,
-      children: /*#__PURE__*/jsx(ContentItemComponent, {
-        contentItemId: viewHandler.productState.currentBanner.contentItemId,
-        wrapperStyle: {
-          display: 'flex',
-          flexDirection: 'column',
-          maxHeight: 'inherit'
-        },
-        onContentItemLoaded: function onContentItemLoaded(title) {
-          LOG.businessEvent('onLoadInfoBox', 'InfoBox', 'Lade Infobox', {
-            id: viewHandler.productState.currentBanner.contentItemId,
-            title: title
-          });
-        }
-      })
-    }), headerContentBoxProps && !viewHandler.uiState.isInMobileView && !viewHandler.productState.currentBanner && /*#__PURE__*/jsx("div", {
-      className: contentBoxWrapper,
-      children: /*#__PURE__*/jsx(ContentBoxComponent, {
-        settings: {
-          contentBoxProps: headerContentBoxProps
-        }
-      })
-    })]
-  });
-};
-var ProductHeader$1 = observer(ProductHeader);
-
-export { ProductHeader$1 as default };

package/build/esm/index-f7b7886d.js

@@ -1,168 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-82c8e7d7.js';
-import { useState, useEffect } from 'react';
-import { observer } from 'mobx-react-lite';
-import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import { jsxs, jsx, Fragment } 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 'classnames';
-import 'qrcode.react';
-import '@babel/runtime/helpers/typeof';
-import 'flat';
-import 'react-switch';
-import 'react-countup';
-
-var wrapper = "wrapper-PiHd4";
-var title = "title-50yik";
-var text = "text-LbROy";
-var progressText = "progressText-NTSPw";
-var progressBar = "progressBar-M9LH7";
-var progressFill = "progressFill-2bm6H";
-var css_248z = ".wrapper-PiHd4 {\n  text-align: center;\n  color: #2a4b63;\n  color: var(--infoBannerColor, #2a4b63);\n  width: calc(100% - 42px);\n  padding: 12px 16px;\n  background-color: #f5f9fc;\n  background-color: var(--infoBannerBackground, #f5f9fc);\n  border-radius: 8px;\n}\n\n.title-50yik {\n  font-weight: bold;\n  font-size: 17px;\n  margin-bottom: 4px;\n}\n\n.text-LbROy {\n  font-size: 14px;\n  margin-bottom: 8px;\n}\n\n.progressText-NTSPw {\n  font-size: 13px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-weight: 500;\n}\n\n.progressBar-M9LH7 {\n  width: 100%;\n  height: 8px;\n  background-color: #e0e0e0;\n  background-color: var(--infoBannerProgressBarBackground, #e0e0e0);\n  border-radius: 4px;\n  overflow: hidden;\n  margin-top: 8px;\n}\n\n.progressFill-2bm6H {\n  height: 100%;\n  transition:\n    width 4s ease,\n    background-color 0.3s ease;\n  border-radius: 4px;\n}\n\n.mobile .title-50yik {\n  font-size: 1em;\n}\n\n.mobile .wrapper-PiHd4 {\n  font-size: 0.9em;\n}\n";
-styleInject(css_248z);
-
-var InfoBanner = function InfoBanner(_ref) {
-  _objectDestructuringEmpty(_ref);
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    user = _useDivaCore.state.user;
-
-  // State variables
-  var _useState = useState(0),
-    _useState2 = _slicedToArray(_useState, 2),
-    totalLimit = _useState2[0],
-    setTotalLimit = _useState2[1];
-  var _useState3 = useState(0),
-    _useState4 = _slicedToArray(_useState3, 2),
-    usedCount = _useState4[0],
-    setUsedCount = _useState4[1];
-  var _useState5 = useState(0),
-    _useState6 = _slicedToArray(_useState5, 2),
-    progressPercent = _useState6[0],
-    setProgressPercent = _useState6[1];
-  var _useState7 = useState(''),
-    _useState8 = _slicedToArray(_useState7, 2),
-    bannerText = _useState8[0],
-    setBannerText = _useState8[1];
-  var _useState9 = useState(''),
-    _useState10 = _slicedToArray(_useState9, 2),
-    usageText = _useState10[0],
-    setUsageText = _useState10[1];
-
-  // Determine if user is anonymous (no user object)
-  var isAnonymous = !user;
-
-  // Get usage budget and limit status from AI state
-  var usageBudget = viewHandler.aiState.usageBudget;
-  var timeframeLimitReached = viewHandler.aiState.isTimeframeLimitReached;
-  var isIpLimitOnly = viewHandler.aiState.isIpLimitOnly;
-  var hasViolations = viewHandler.aiState.hasViolations;
-  var organizationAISettings = viewHandler.settingsState.organizationAISettings;
-
-  // Effect to calculate and update all state values
-  useEffect(function () {
-    // Calculate values
-    var newTotalLimit = 0;
-    var newUsedCount = 0;
-    var newIsLimitReached = false;
-    if (usageBudget) {
-      newTotalLimit = usageBudget.total;
-      newUsedCount = usageBudget.used;
-      newIsLimitReached = !!viewHandler.aiState.isTimeframeLimitReached;
-    } else if (isAnonymous) {
-      // Fallback to organization settings if no usage limits loaded
-      var anonymousLimit = (organizationAISettings === null || organizationAISettings === void 0 ? void 0 : organizationAISettings.anonymousDailyIPLimit) || 2;
-      newTotalLimit = anonymousLimit;
-      newUsedCount = 0;
-    }
-
-    // Update state values
-    setTotalLimit(newTotalLimit);
-    setUsedCount(newUsedCount);
-
-    // Calculate progress percentage for the bar
-    var newProgressPercent = newTotalLimit > 0 ? (newUsedCount + (viewHandler.aiState.isAnyGenerationInProgress ? 1 : 0)) / newTotalLimit * 100 : 0;
-    setProgressPercent(newProgressPercent);
-
-    // Determine banner text
-    var newBannerText = '';
-    var newUsageText = '';
-    newUsageText = t('configurator.roomRendering.anonymousBanner.used');
-    if (newIsLimitReached) {
-      if (isIpLimitOnly) {
-        // Only IP limit reached - can be bypassed with lead key
-        // If lead key is active, don't show the lead key bonus
-        if (organizationAISettings !== null && organizationAISettings !== void 0 && organizationAISettings.leadRewardBonus && !(usageBudget !== null && usageBudget !== void 0 && usageBudget.leadKeyActive)) {
-          newBannerText = t('configurator.roomRendering.anonymousBanner.ipLimitReachedWithLeadKey', {
-            leadRewardBonus: organizationAISettings.leadRewardBonus
-          });
-        } else {
-          newBannerText = t('configurator.roomRendering.anonymousBanner.ipLimitReached');
-        }
-      } else if (timeframeLimitReached) {
-        switch (timeframeLimitReached) {
-          case 'daily':
-            newBannerText = t('configurator.roomRendering.banner.dailyLimitReached');
-            break;
-          case 'weekly':
-            newBannerText = t('configurator.roomRendering.banner.weeklyLimitReached');
-            break;
-          case 'monthly':
-            newBannerText = t('configurator.roomRendering.banner.monthlyLimitReached');
-            break;
-        }
-      }
-    } else {
-      newBannerText = t('configurator.roomRendering.infoText');
-    }
-    setBannerText(newBannerText);
-    setUsageText(newUsageText);
-  }, [usageBudget, isAnonymous, isIpLimitOnly, hasViolations, timeframeLimitReached, organizationAISettings, viewHandler.aiState.isAnyGenerationInProgress]);
-  return /*#__PURE__*/jsxs("div", {
-    className: wrapper,
-    children: [/*#__PURE__*/jsx("div", {
-      className: title,
-      children: t('configurator.roomRendering.infoTitle')
-    }), /*#__PURE__*/jsx("div", {
-      className: text,
-      children: bannerText
-    }), (!timeframeLimitReached || timeframeLimitReached == 'daily') && /*#__PURE__*/jsxs(Fragment, {
-      children: [/*#__PURE__*/jsxs("div", {
-        className: progressText,
-        children: [/*#__PURE__*/jsx("div", {
-          children: usageText
-        }), /*#__PURE__*/jsxs("div", {
-          children: [usedCount, " / ", totalLimit]
-        })]
-      }), /*#__PURE__*/jsx("div", {
-        className: progressBar,
-        style: {
-          marginTop: '8px'
-        },
-        children: /*#__PURE__*/jsx("div", {
-          className: progressFill,
-          style: {
-            width: "".concat(progressPercent, "%"),
-            backgroundColor: progressPercent > 99 ? 'var(--infoBannerProgressFillHigh, #d32f2f)' : progressPercent > 60 ? 'var(--infoBannerProgressFillMedium, #f57c00)' : 'var(--infoBannerProgressFillLow, #4caf50)'
-          }
-        })
-      })]
-    })]
-  });
-};
-var InfoBanner$1 = observer(InfoBanner);
-
-export { InfoBanner$1 as default };