@crystaldesign/diva-web-planner-react 26.4.3-rc.9 → 26.4.3

package/build/esm/{Planner2DGrid-8f48075b.js → Planner2DGrid-aefe059c.js}

@@ -1,7 +1,7 @@
 import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
 import _createClass from '@babel/runtime/helpers/createClass';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-79d92bc4.js';
+import './index-22049a2e.js';
 import { fabric } from 'fabric';
 import { Vector3, Vector2 } from '@crystaldesign/web-planner-logic';
 import { getLogger, DivaUtils } from '@crystaldesign/diva-core';

package/build/esm/{Planner3DImage-4730a543.js → Planner3DImage-584a5010.js}

@@ -1,7 +1,7 @@
 import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
 import _createClass from '@babel/runtime/helpers/createClass';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-79d92bc4.js';
+import './index-22049a2e.js';
 import { Vector3, Vector2, Rendering } from '@crystaldesign/web-planner-logic';
 import { getLogger } from '@crystaldesign/diva-core';
 import * as THREE from 'three';

package/build/esm/UnlockCard-a9c0a340.js

@@ -0,0 +1,191 @@
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import { s as styleInject } from './index-22049a2e.js';
+import { useState } from 'react';
+import { useTranslation, DivaUtils } from '@crystaldesign/diva-core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var container = "container-uvLa8";
+var emptyText = "emptyText-k7-1y";
+var headline = "headline-VRP8M";
+var subheadline = "subheadline-aM8S8";
+var styleSelection = "styleSelection-iOIY2";
+var styleDescriptionText = "styleDescriptionText-XEUG7";
+var styleButtonsSwiper = "styleButtonsSwiper-zhnww";
+var styleButton = "styleButton-dyuqQ";
+var styleButtonSelected = "styleButtonSelected-uZne1";
+var styleButtonImage = "styleButtonImage-by1s3";
+var styleDescription = "styleDescription-GH09Y";
+var styleName = "styleName-HH3qh";
+var customInputSection = "customInputSection-zwl9g";
+var customInput = "customInput-5jLl3";
+var generateSection = "generateSection-3wiMe";
+var generateButton = "generateButton-TP6yS";
+var remainingText = "remainingText-P3Ibl";
+var errorMessage = "errorMessage-6Dfp4";
+var unlockCard = "unlockCard-zmqvI";
+var unlockTitle = "unlockTitle-ZdltE";
+var unlockText = "unlockText-Jixn2";
+var unlockEmailInput = "unlockEmailInput-z5SXf";
+var unlockSubmitButton = "unlockSubmitButton-XuvH2";
+var unlockSubmitArrow = "unlockSubmitArrow-fCYvp";
+var unlockSuccessCard = "unlockSuccessCard-2ICYg";
+var unlockSuccessIcon = "unlockSuccessIcon-pOmcL";
+var unlockSuccessText = "unlockSuccessText-rtcHE";
+var tryVariantLink = "tryVariantLink-ZX0JF";
+var sceneHistory = "sceneHistory-i3VQY";
+var sceneHistoryTitle = "sceneHistoryTitle-fJPXT";
+var sceneHistorySwiper = "sceneHistorySwiper-oOVFf";
+var sceneThumb = "sceneThumb-mVxuB";
+var sceneThumbSelected = "sceneThumbSelected-MfJxR";
+var css_248z = ".container-uvLa8 {\n  padding-top: 16px;\n  padding-left: 12px;\n}\n\n.mobile .container-uvLa8 {\n  padding-left: 0px;\n}\n\n.emptyText-k7-1y {\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0;\n}\n\n.headline-VRP8M {\n  font-size: 18px;\n  font-weight: 300;\n  line-height: 1.3;\n  letter-spacing: inherit;\n  color: var(--diva-theme-palette-text-primary);\n  margin: 0 0 8px;\n}\n\n.subheadline-aM8S8 {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.5;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 16px;\n}\n\n.mobile .subheadline-aM8S8 {\n  margin: 0 0 8px;\n}\n\n.styleSelection-iOIY2 {\n  margin-bottom: 16px;\n}\n\n.styleDescriptionText-XEUG7 {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.5;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0;\n}\n\n.mobile .styleDescriptionText-XEUG7 {\n  font-size: 12px;\n}\n\n.styleButtonsSwiper-zhnww {\n  margin-bottom: 16px;\n  min-height: 60px;\n  overflow: visible;\n}\n\n.styleButtonsSwiper-zhnww .swiper {\n  position: relative;\n  overflow: hidden;\n  list-style: none;\n  padding: 6px 0;\n  z-index: 1;\n}\n\n.styleButtonsSwiper-zhnww .swiper-wrapper {\n  position: relative;\n  width: calc(100% - 24px);\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  transition-property: transform;\n  justify-content: center;\n  padding: 12px;\n}\n\n.styleSelection-iOIY2 .styleButtonsSwiper-zhnww .swiper-slide {\n  flex-shrink: 0;\n  width: 18%;\n  aspect-ratio: 1;\n  display: flex;\n  align-items: center;\n  overflow: visible;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-prev,\n.styleButtonsSwiper-zhnww .swiper-button-next {\n  position: absolute;\n  top: 50%;\n  width: 24px;\n  height: 24px;\n  margin-top: -12px;\n  z-index: 10;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  -webkit-tap-highlight-color: transparent;\n  outline: none;\n}\n.styleButtonsSwiper-zhnww .swiper-button-prev svg,\n.styleButtonsSwiper-zhnww .swiper-button-next svg {\n  display: none;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-prev:focus,\n.styleButtonsSwiper-zhnww .swiper-button-prev:active,\n.styleButtonsSwiper-zhnww .swiper-button-next:focus,\n.styleButtonsSwiper-zhnww .swiper-button-next:active {\n  outline: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-prev::before,\n.styleButtonsSwiper-zhnww .swiper-button-next::before {\n  display: none !important;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-prev:after,\n.styleButtonsSwiper-zhnww .swiper-button-next:after {\n  font-family: swiper-icons;\n  font-size: 24px;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-prev,\n.styleButtonsSwiper-zhnww .swiper-rtl .swiper-button-next {\n  left: 4px;\n  right: auto;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-next,\n.styleButtonsSwiper-zhnww .swiper-rtl .swiper-button-prev {\n  right: 4px;\n  left: auto;\n}\n\n.styleButtonsSwiper-zhnww .swiper-button-disabled {\n  display: none;\n}\n\n.styleButton-dyuqQ {\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  padding: 0;\n  border: none;\n  border-radius: 50%;\n  overflow: hidden;\n  cursor: pointer;\n  background: none;\n  transition:\n    opacity 0.2s,\n    box-shadow 0.2s;\n  -webkit-tap-highlight-color: transparent;\n  outline: none;\n}\n\n.styleButton-dyuqQ:hover {\n  opacity: 0.8;\n}\n\n.styleButton-dyuqQ:focus,\n.styleButton-dyuqQ:active {\n  outline: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.styleButtonSelected-uZne1 {\n  box-shadow: 0 0 0 3px var(--diva-theme-palette-primary-main);\n  outline-offset: 2px;\n}\n\n.styleButtonImage-by1s3 {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: cover;\n     object-fit: cover;\n}\n\n.styleDescription-GH09Y {\n  text-align: center;\n}\n\n.styleName-HH3qh {\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-primary);\n  margin: 0 0 8px;\n}\n\n.customInputSection-zwl9g {\n  margin-bottom: 16px;\n}\n\n.customInput-5jLl3 {\n  width: calc(100% - 28px);\n  padding: 10px 14px;\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-primary);\n  border: 1px solid #e8e3da;\n  border: 1px solid var(--galleryItemBorderColor, #e8e3da);\n  border-radius: 4px;\n  border-radius: var(--globalBorderRadius, 4px);\n  background: var(--settingsBackgroundColor);\n}\n\n.customInput-5jLl3:focus {\n  outline: none;\n  border-color: var(--diva-theme-palette-primary-main);\n  box-shadow: 0 0 0 1px var(--diva-theme-palette-primary-main);\n}\n\n.customInput-5jLl3::-moz-placeholder {\n  color: var(--diva-theme-palette-text-secondary);\n}\n\n.customInput-5jLl3::placeholder {\n  color: var(--diva-theme-palette-text-secondary);\n}\n\n.generateSection-3wiMe {\n  margin-bottom: 24px;\n}\n\n.generateButton-TP6yS {\n  width: calc(100% - 48px);\n  padding: 14px 24px;\n  font-size: 16px;\n  font-weight: 300;\n  color: #fff;\n  color: var(--diva-theme-palette-primary-contrast-text, #fff);\n  background: var(--diva-theme-palette-primary-main);\n  border: none;\n  border-radius: var(--buttons-border-radius);\n  cursor: pointer;\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n  box-shadow: var(--boxShadowHover, 0 4px 6px rgba(0, 0, 0, 0.1));\n  transition:\n    background 0.2s,\n    box-shadow 0.2s;\n  -webkit-tap-highlight-color: transparent;\n  outline: none;\n}\n\n.generateButton-TP6yS:focus,\n.generateButton-TP6yS:active {\n  outline: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.generateButton-TP6yS:hover:not(:disabled) {\n  background: var(--diva-theme-palette-primary-dark);\n  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\n  box-shadow: var(--boxShadowActive, 0 6px 12px rgba(0, 0, 0, 0.15));\n}\n\n.generateButton-TP6yS:disabled {\n  cursor: not-allowed;\n  opacity: 0.7;\n}\n\n.remainingText-P3Ibl {\n  font-size: 12px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-secondary);\n  text-align: center;\n  margin: 8px 0 0;\n}\n\n.errorMessage-6Dfp4 {\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 1.5;\n  color: #d32f2f;\n  color: var(--diva-theme-palette-error-main, #d32f2f);\n  background: color-mix(in srgb, #d32f2f 8%, transparent);\n  background: color-mix(in srgb, var(--diva-theme-palette-error-main, #d32f2f) 8%, transparent);\n  border: 1px solid color-mix(in srgb, #d32f2f 25%, transparent);\n  border: 1px solid color-mix(in srgb, var(--diva-theme-palette-error-main, #d32f2f) 25%, transparent);\n  border-radius: 4px;\n  border-radius: var(--globalBorderRadius, 4px);\n  padding: 10px 14px;\n  margin: 12px 0 0;\n  text-align: center;\n}\n\n.unlockCard-zmqvI {\n  padding: 24px 20px;\n  border: 2px solid color-mix(in srgb, var(--diva-theme-palette-primary-main) 20%, transparent);\n  border-radius: 4px;\n  border-radius: var(--globalBorderRadius, 4px);\n  background: var(--settingsBackgroundColor);\n  text-align: center;\n}\n\n.unlockTitle-ZdltE {\n  font-size: 18px;\n  font-weight: 300;\n\n  color: var(--diva-theme-palette-primary-main);\n  margin: 0 0 12px;\n}\n\n.unlockText-Jixn2 {\n  font-size: 14px;\n  font-weight: 300;\n  line-height: 1.6;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 16px;\n}\n\n.unlockEmailInput-z5SXf {\n  width: calc(100% - 28px);\n  padding: 12px 14px;\n  font-size: 16px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-text-primary);\n  border: 1px solid #e8e3da;\n  border: 1px solid var(--galleryItemBorderColor, #e8e3da);\n  border-radius: 4px;\n  border-radius: var(--globalBorderRadius, 4px);\n  background: var(--settingsBackgroundColor);\n  margin-bottom: 12px;\n}\n\n.unlockEmailInput-z5SXf:focus {\n  outline: none;\n  border-color: var(--diva-theme-palette-primary-main);\n  box-shadow: 0 0 0 1px var(--diva-theme-palette-primary-main);\n}\n\n.unlockEmailInput-z5SXf::-moz-placeholder {\n  color: var(--diva-theme-palette-text-secondary);\n}\n\n.unlockEmailInput-z5SXf::placeholder {\n  color: var(--diva-theme-palette-text-secondary);\n}\n\n.unlockSubmitButton-XuvH2 {\n  width: calc(100% - 48px);\n  padding: 14px 24px;\n  font-size: 14px;\n  font-weight: 400;\n  color: #fff;\n  color: var(--diva-theme-palette-primary-contrast-text, #fff);\n  background: var(--diva-theme-palette-primary-main);\n  border: none;\n  border-radius: var(--buttons-border-radius);\n  cursor: pointer;\n  transition:\n    background 0.2s,\n    box-shadow 0.2s;\n  -webkit-tap-highlight-color: transparent;\n  outline: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n}\n\n.unlockSubmitButton-XuvH2:focus,\n.unlockSubmitButton-XuvH2:active {\n  outline: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.unlockSubmitButton-XuvH2:hover:not(:disabled) {\n  background: var(--diva-theme-palette-primary-dark);\n  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\n  box-shadow: var(--boxShadowActive, 0 6px 12px rgba(0, 0, 0, 0.15));\n}\n\n.unlockSubmitButton-XuvH2:disabled {\n  cursor: not-allowed;\n  opacity: 0.7;\n}\n\n.unlockSubmitArrow-fCYvp {\n  font-size: 18px;\n  line-height: 1;\n}\n\n.unlockSuccessCard-2ICYg {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  min-height: 120px;\n}\n\n.unlockSuccessIcon-pOmcL {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  background: var(--diva-theme-palette-primary-main);\n  color: #fff;\n  color: var(--diva-theme-palette-primary-contrast-text, #fff);\n  font-size: 20px;\n  line-height: 1;\n}\n\n.unlockSuccessText-rtcHE {\n  font-size: 15px;\n  font-weight: 400;\n  color: var(--diva-theme-palette-text-primary);\n  margin: 0;\n}\n\n.tryVariantLink-ZX0JF {\n  display: block;\n  margin: 12px auto 24px;\n  padding: 0;\n  font-size: 14px;\n  font-weight: 300;\n  color: var(--diva-theme-palette-primary-main);\n  text-decoration: underline;\n  text-underline-offset: 3px;\n  background: none;\n  border: none;\n  cursor: pointer;\n  transition: color 0.15s;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.tryVariantLink-ZX0JF:hover {\n  color: var(--diva-theme-palette-primary-dark);\n}\n\n.sceneHistory-i3VQY {\n  margin-top: 24px;\n}\n\n.sceneHistoryTitle-fJPXT {\n  font-size: 12px;\n  font-weight: 300;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--diva-theme-palette-text-secondary);\n  margin: 0 0 12px;\n}\n\n.sceneHistorySwiper-oOVFf {\n  padding-bottom: 8px;\n}\n\n.sceneHistorySwiper-oOVFf .swiper {\n  position: relative;\n  overflow: hidden;\n  list-style: none;\n  padding: 0;\n  z-index: 1;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-wrapper {\n  position: relative;\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  transition-property: transform;\n  padding: 12px;\n}\n\n.sceneHistory-i3VQY .sceneHistorySwiper-oOVFf .swiper-slide {\n  flex-shrink: 0;\n  width: 80px;\n  height: 80px;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev,\n.sceneHistorySwiper-oOVFf .swiper-button-next {\n  position: absolute;\n  top: 50%;\n  width: 24px;\n  height: 24px;\n  margin-top: -12px;\n  z-index: 10;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  -webkit-tap-highlight-color: transparent;\n  outline: none;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev svg,\n.sceneHistorySwiper-oOVFf .swiper-button-next svg {\n  display: none;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev:focus,\n.sceneHistorySwiper-oOVFf .swiper-button-prev:active,\n.sceneHistorySwiper-oOVFf .swiper-button-next:focus,\n.sceneHistorySwiper-oOVFf .swiper-button-next:active {\n  outline: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev::before,\n.sceneHistorySwiper-oOVFf .swiper-button-next::before {\n  display: none !important;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev:after,\n.sceneHistorySwiper-oOVFf .swiper-button-next:after {\n  font-family: swiper-icons;\n  font-size: 24px;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev,\n.sceneHistorySwiper-oOVFf .swiper-rtl .swiper-button-next {\n  left: 4px;\n  right: auto;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-next,\n.sceneHistorySwiper-oOVFf .swiper-rtl .swiper-button-prev {\n  right: 4px;\n  left: auto;\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-prev:after {\n  content: 'prev';\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-next:after {\n  content: 'next';\n}\n\n.sceneHistorySwiper-oOVFf .swiper-button-disabled {\n  display: none;\n}\n\n.sceneThumb-mVxuB {\n  width: 80px;\n  height: 80px;\n  flex-shrink: 0;\n  overflow: hidden;\n  border-radius: 4px;\n  border-radius: var(--globalBorderRadius, 4px);\n  border: 2px solid #e8e3da;\n  border: 2px solid var(--galleryItemBorderColor, #e8e3da);\n  cursor: pointer;\n  transition:\n    border-color 0.2s,\n    box-shadow 0.2s;\n}\n\n.sceneThumb-mVxuB:hover {\n  border-color: var(--diva-theme-palette-primary-main);\n}\n\n.sceneThumbSelected-MfJxR {\n  border-color: var(--diva-theme-palette-primary-main);\n  box-shadow: 0 0 0 2px var(--diva-theme-palette-primary-main);\n}\n\n.sceneThumb-mVxuB img {\n  width: 100%;\n  height: 100%;\n  -o-object-fit: cover;\n     object-fit: cover;\n}\n";
+styleInject(css_248z);
+
+var UnlockCard = function UnlockCard(_ref) {
+  var budgetTotal = _ref.budgetTotal,
+    leadBonus = _ref.leadBonus,
+    leadKeyActive = _ref.leadKeyActive,
+    onSubmit = _ref.onSubmit,
+    onSuccess = _ref.onSuccess;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    email = _useState2[0],
+    setEmail = _useState2[1];
+  var _useState3 = useState(leadKeyActive || leadBonus <= 0 ? 'exhausted' : 'form'),
+    _useState4 = _slicedToArray(_useState3, 2),
+    phase = _useState4[0],
+    setPhase = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    errorMsg = _useState6[0],
+    setErrorMsg = _useState6[1];
+  var handleSubmit = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var result, _result$message, _result$message2, _result$message3;
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            setPhase('loading');
+            setErrorMsg('');
+            _context.next = 4;
+            return onSubmit(email);
+          case 4:
+            result = _context.sent;
+            if (result !== null && result !== void 0 && result.success) {
+              setPhase('success');
+              setTimeout(function () {
+                return onSuccess();
+              }, 2500);
+            } else if ((result === null || result === void 0 ? void 0 : result.reason) === 'LEAD_KEY_BONUS_EXHAUSTED') {
+              setErrorMsg((_result$message = result === null || result === void 0 ? void 0 : result.message) !== null && _result$message !== void 0 ? _result$message : '');
+              setPhase('leadBonusExhausted');
+            } else if ((result === null || result === void 0 ? void 0 : result.reason) === 'EMAIL_ALREADY_USED') {
+              setErrorMsg((_result$message2 = result === null || result === void 0 ? void 0 : result.message) !== null && _result$message2 !== void 0 ? _result$message2 : '');
+              setPhase('emailAlreadyUsed');
+            } else {
+              setErrorMsg((_result$message3 = result === null || result === void 0 ? void 0 : result.message) !== null && _result$message3 !== void 0 ? _result$message3 : '');
+              setPhase('error');
+            }
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function handleSubmit() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  if (phase === 'success') {
+    return /*#__PURE__*/jsxs("div", {
+      className: "".concat(unlockCard, " ").concat(unlockSuccessCard),
+      children: [/*#__PURE__*/jsx("span", {
+        className: unlockSuccessIcon,
+        children: "\u2713"
+      }), /*#__PURE__*/jsx("p", {
+        className: unlockSuccessText,
+        children: t('configurator.inspiration.unlockSuccess', 'Erfolgreich freigeschaltet – jetzt weiter generieren!')
+      })]
+    });
+  }
+  if (phase === 'exhausted') {
+    return /*#__PURE__*/jsxs("div", {
+      className: unlockCard,
+      children: [/*#__PURE__*/jsx("h4", {
+        className: unlockTitle,
+        children: t('configurator.inspiration.exhaustedTitle', 'Sie haben heute alle Raumbilder genutzt')
+      }), /*#__PURE__*/jsx("p", {
+        className: unlockText,
+        children: t('configurator.inspiration.exhaustedText', 'Ihr Kontingent ist für heute aufgebraucht. Kommen Sie morgen wieder – dann stehen Ihnen neue Raumbilder zur Verfügung.')
+      })]
+    });
+  }
+  if (phase === 'emailAlreadyUsed') {
+    return /*#__PURE__*/jsxs("div", {
+      className: unlockCard,
+      children: [/*#__PURE__*/jsx("h4", {
+        className: unlockTitle,
+        children: t('configurator.inspiration.emailAlreadyUsedTitle', 'Diese E-Mail-Adresse wurde bereits verwendet')
+      }), /*#__PURE__*/jsx("p", {
+        className: unlockText,
+        children: t('configurator.inspiration.emailAlreadyUsedText', 'Die Freischaltung zusätzlicher Raumbilder ist pro E-Mail-Adresse nur einmal möglich.')
+      })]
+    });
+  }
+  if (phase === 'leadBonusExhausted') {
+    return /*#__PURE__*/jsxs("div", {
+      className: unlockCard,
+      children: [/*#__PURE__*/jsx("h4", {
+        className: unlockTitle,
+        children: t('configurator.inspiration.leadKeyBonusExhaustedTitle', 'Bonus-Kontingent aufgebraucht')
+      }), /*#__PURE__*/jsx("p", {
+        className: unlockText,
+        children: t('configurator.inspiration.leadKeyBonusExhaustedText', 'Für diese E-Mail-Adresse sind alle zusätzlichen Raumbilder bereits verbraucht. Es können keine weiteren Bilder mehr freigeschaltet werden.')
+      })]
+    });
+  }
+  return /*#__PURE__*/jsxs("div", {
+    className: unlockCard,
+    children: [/*#__PURE__*/jsx("h4", {
+      className: unlockTitle,
+      children: t('configurator.inspiration.unlockTitle', 'Gefällt Ihnen, was Sie sehen?')
+    }), /*#__PURE__*/jsx("p", {
+      className: unlockText,
+      children: t('configurator.inspiration.unlockTextLead', {
+        budgetTotal: budgetTotal,
+        leadBonus: leadBonus
+      })
+    }), /*#__PURE__*/jsx("input", {
+      type: "email",
+      className: unlockEmailInput,
+      value: email,
+      onChange: function onChange(e) {
+        return setEmail(e.target.value);
+      },
+      placeholder: t('configurator.inspiration.emailPlaceholder', 'ihre.email@beispiel.de'),
+      disabled: phase === 'loading'
+    }), phase === 'error' && errorMsg && /*#__PURE__*/jsx("p", {
+      className: unlockText,
+      children: errorMsg
+    }), /*#__PURE__*/jsxs("button", {
+      type: "button",
+      className: unlockSubmitButton,
+      disabled: phase === 'loading' || !DivaUtils.validateEmail(email),
+      onClick: handleSubmit,
+      children: [phase === 'loading' ? t('configurator.inspiration.unlocking', 'Wird freigeschaltet…') : t('configurator.inspiration.unlockButton', "".concat(leadBonus, " weitere Raumbilder freischalten")), phase !== 'loading' && /*#__PURE__*/jsx("span", {
+        className: unlockSubmitArrow,
+        children: "\u2192"
+      })]
+    })]
+  });
+};
+
+var UnlockCard$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  'default': UnlockCard
+});
+
+export { UnlockCard as U, styleSelection as a, styleButtonsSwiper as b, container as c, styleButton as d, emptyText as e, styleButtonSelected as f, styleButtonImage as g, headline as h, styleDescription as i, styleName as j, styleDescriptionText as k, generateSection as l, customInputSection as m, customInput as n, generateButton as o, errorMessage as p, sceneHistory as q, remainingText as r, subheadline as s, sceneHistoryTitle as t, sceneHistorySwiper as u, sceneThumb as v, sceneThumbSelected as w, tryVariantLink as x, UnlockCard$1 as y };

package/build/esm/{index-99aa7ce3.js → index-032aa00e.js}

@@ -1,11 +1,11 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler, _ as _onClickCheckout, I as Icon } from './index-79d92bc4.js';
+import { u as useViewHandler, _ as _onClickCheckout, I as Icon } from './index-22049a2e.js';
 import { useState, useEffect } from 'react';
-import { r as roomItem, s as sel, b as buttonVisible, g as generated, l as loading, w as wrapper, t as textShadow, a as title, c as button, d as limitedButton, e as stopButton, f as blockedButton, h as limitedIcon, i as loadingIcon, j as generateIcon, k as favoriteIcon, m as favoriteIconSel, n as favoriteIconVisible, o as shareButtonWrapper, v as visible } from './index.module-6b34257d.js';
+import { r as roomItem, s as sel, b as buttonVisible, g as generated, l as loading, w as wrapper, t as textShadow, a as title, c as button, d as limitedButton, e as stopButton, f as blockedButton, h as limitedIcon, i as loadingIcon, j as generateIcon, k as favoriteIcon, m as favoriteIconSel, n as favoriteIconVisible, o as shareButtonWrapper, v as visible } from './index.module-4770510d.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
-import InfoIcon from './index-2b2f7549.js';
+import InfoIcon from './index-673ca36d.js';
 import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';

package/build/esm/{index-8c580ab4.js → index-03a87736.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-79d92bc4.js';
+import './index-22049a2e.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-14bca5eb.js → index-03fac510.js}

@@ -1,10 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon, b as PriceCounter } from './index-79d92bc4.js';
+import { s as styleInject, u as useViewHandler, e as evalVisible, _ as _onClickCheckout, I as Icon, b as PriceCounter } from './index-22049a2e.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';
 import { useDivaCore, useTranslation } from '@crystaldesign/diva-core';
-import { c as checkoutButton } from './index.module-d9e8f40c.js';
+import { c as checkoutButton } from './index.module-706bb3a7.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import 'react-dynamic-multi-render';

package/build/esm/{index-1f811857.js → index-068afe56.js}

@@ -1,10 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler } from './index-79d92bc4.js';
+import { s as styleInject, u as useViewHandler } from './index-22049a2e.js';
 import 'react';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
-import ArQrCodeIcon from './index-d3ee3be4.js';
-import { u as useCustomDimensions } from './useCustomDimensions-046fe826.js';
+import ArQrCodeIcon from './index-763b36fa.js';
+import { u as useCustomDimensions } from './useCustomDimensions-a17f4739.js';
 import { useTranslation } from '@crystaldesign/diva-core';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -24,9 +24,9 @@ import 'flat';
 import 'react-switch';
 import 'react-countup';
 import 'react-laag';
-import './index-4c96730f.js';
+import './index-9774366c.js';
 import 'react-qr-code';
-import './index-f122262f.js';
+import './index-3fb7c01c.js';
 
 var wrapper = "wrapper-IoYoU";
 var subWrapper = "subWrapper-Gf23J";

package/build/esm/{index-b5092aac.js → index-072379d9.js}

@@ -1,10 +1,10 @@
-import { u as useViewHandler, P as PricePreview, T as Toggle } from './index-79d92bc4.js';
+import { u as useViewHandler, P as PricePreview, T as Toggle } from './index-22049a2e.js';
 import 'react';
 import classnames from 'classnames';
-import { r as row, b as columToggleName, t as title, n as name, s as sel, a as toggle } from './index.module-d10d761a.js';
+import { r as row, b as columToggleName, t as title, n as name, s as sel, a as toggle } from './index.module-b5494b57.js';
 import { getLogger } from '@crystaldesign/diva-core';
-import InfoIcon from './index-2b2f7549.js';
-import ReverseCheck from './index-be3a8493.js';
+import InfoIcon from './index-673ca36d.js';
+import ReverseCheck from './index-addd466a.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-1bbc2d99.js → index-075ecf41.js}

@@ -1,9 +1,9 @@
-import { s as styleInject, u as useViewHandler } from './index-79d92bc4.js';
+import { s as styleInject, u as useViewHandler } from './index-22049a2e.js';
 import { useEffect } from 'react';
-import Settings from './index-9809aa47.js';
-import TabGroup from './index-eb1acb0a.js';
+import Settings from './index-5a5c3d33.js';
+import TabGroup from './index-5f4296cb.js';
 import { observer } from 'mobx-react-lite';
-import Inputbox from './index-1d38036f.js';
+import Inputbox from './index-5f3826be.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
@@ -24,99 +24,99 @@ import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-switch';
 import 'react-countup';
-import './index-bb72e450.js';
-import './index-bfa54a07.js';
+import './index-740180b3.js';
+import './index-e9709105.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-c023bb75.js';
-import './index-28aee36b.js';
-import './index-ff17af84.js';
+import './index-dfc330ea.js';
+import './index-1d1c3714.js';
+import './index-5ecfdc6f.js';
 import 'sift';
-import './index-48fa6894.js';
-import './index-901ac325.js';
-import './index-6332be20.js';
-import './index-930b26fa.js';
-import './index.module-d10d761a.js';
-import './index-2b2f7549.js';
-import './index-be3a8493.js';
+import './index-68dc625a.js';
+import './index-0cb7f8c1.js';
+import './index-7cc03952.js';
+import './index-1f14f1f5.js';
+import './index.module-b5494b57.js';
+import './index-673ca36d.js';
+import './index-addd466a.js';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';
-import './index-45a1ca54.js';
+import './index-8c660cb4.js';
 import 'react-dropdown';
-import './index-77d780a7.js';
-import './index-2f8e7e39.js';
-import './index-d3caadf0.js';
-import './index-248e6f80.js';
+import './index-48f46d16.js';
+import './index-40c3aa55.js';
+import './index-64e04ea8.js';
+import './index-ce74bb99.js';
 import '@crystaldesign/content-box';
-import './index-84aa12ed.js';
-import './index-5e04d0ce.js';
-import './index-5c33b034.js';
-import './index-062621ba.js';
+import './index-42bf7ba6.js';
+import './index-320d6231.js';
+import './index-6a541dc9.js';
+import './index-1cc89593.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './UnlockCard-cf596447.js';
-import './index-b5092aac.js';
-import './index-38a7deff.js';
-import './index-8c580ab4.js';
-import './index-26645aa2.js';
-import './index-8bb8118e.js';
-import './index-fb1a39ac.js';
+import './UnlockCard-a9c0a340.js';
+import './index-072379d9.js';
+import './index-ce3fd2dd.js';
+import './index-03a87736.js';
+import './index-50d81f2b.js';
+import './index-566ac26c.js';
+import './index-1ad6bc31.js';
 import 'react-laag';
-import './index.module-25b3686e.js';
-import './index-431b1b0c.js';
-import './index-793481fc.js';
-import './index-d4484c82.js';
-import './index-1a55e33e.js';
-import './index-a7849185.js';
-import './index.module-f77cca95.js';
-import './index-4efd8571.js';
-import './index-aafc4e7f.js';
-import './index-870cc9fe.js';
-import './index-cf347c41.js';
-import './index-0315de1d.js';
-import './index-0a396a1e.js';
-import './index-26e9ae39.js';
-import './index-4c240f14.js';
-import './index-404d717b.js';
-import './index-406652f5.js';
-import './index-5f0e8be1.js';
-import './index-452a9de0.js';
-import './index-ec1a08c1.js';
+import './index.module-c5baf242.js';
+import './index-c19b15a9.js';
+import './index-769e119f.js';
+import './index-b2975c88.js';
+import './index-2efb3634.js';
+import './index-461dc61a.js';
+import './index.module-021d9040.js';
+import './index-270ed7ab.js';
+import './index-939c3fcb.js';
+import './index-756bfb44.js';
+import './index-667b836d.js';
+import './index-49b0ca7b.js';
+import './index-a19c4968.js';
+import './index-d372aea8.js';
+import './index-edcfe7ed.js';
+import './index-9c7fedf7.js';
+import './index-c773cfe3.js';
+import './index-1870516b.js';
+import './index-5baa5713.js';
+import './index-f700d17e.js';
 import 'rc-slider';
-import './index-a990a7fb.js';
-import './index-98efca52.js';
-import './index-73985be6.js';
-import './index-a15f730e.js';
-import './index-7c5d2147.js';
+import './index-c4d43896.js';
+import './index-bd25e428.js';
+import './index-604c3548.js';
+import './index-4cf7766e.js';
+import './index-1c502ce6.js';
 import 'react-confetti-explosion';
-import './index-1f811857.js';
-import './index-d3ee3be4.js';
-import './index-4c96730f.js';
+import './index-068afe56.js';
+import './index-763b36fa.js';
+import './index-9774366c.js';
 import 'react-qr-code';
-import './index-f122262f.js';
-import './useCustomDimensions-046fe826.js';
-import './index-35a84e08.js';
-import './ussIsSticky-5bf9aa72.js';
-import './index-339845cb.js';
-import './index-448ceb95.js';
-import './index-99aa7ce3.js';
-import './index.module-6b34257d.js';
-import './index-94ff9f09.js';
-import './index-5ae900db.js';
-import './index-a7258128.js';
-import './index-20e1bfd7.js';
-import './index-06e13c39.js';
-import './index-e84724f8.js';
-import './index.module-2d85bc3c.js';
-import './index-1de9c352.js';
-import './index-7b2ba694.js';
-import './index-236d22d3.js';
-import './index-110b867c.js';
+import './index-3fb7c01c.js';
+import './useCustomDimensions-a17f4739.js';
+import './index-130b910c.js';
+import './ussIsSticky-5a77c7e9.js';
+import './index-5fb8aeca.js';
+import './index-1219ff6b.js';
+import './index-032aa00e.js';
+import './index.module-4770510d.js';
+import './index-67fa18f0.js';
+import './index-388444e2.js';
+import './index-b0549eeb.js';
+import './index-53b09faa.js';
+import './index-3e55bccb.js';
+import './index-40c30570.js';
+import './index.module-8913f507.js';
+import './index-d7041bf7.js';
+import './index-df446419.js';
+import './index-88638f33.js';
+import './index-de5e28d3.js';
 import '@mui/material';
-import './index-9e48d9ac.js';
-import './index-73940188.js';
-import './index-b97e3c55.js';
-import './index-cd1096f3.js';
-import './index-91dcac37.js';
+import './index-c1487c0c.js';
+import './index-b4dce6fd.js';
+import './index-52d12bbd.js';
+import './index-b4b71c52.js';
+import './index-3e57a4e8.js';
 
 var wcConfigurator = "wcConfigurator-IeI91";
 var wcConfiguratorSteps = "wc-configurator-steps-yPThi";

package/build/esm/{index-e92630de.js → index-09320a56.js}

@@ -1,9 +1,9 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler } from './index-79d92bc4.js';
+import { s as styleInject, u as useViewHandler } from './index-22049a2e.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
-import ActionNavigation from './index-1c6c6978.js';
-import PriceSumm from './index-bf84c40c.js';
+import ActionNavigation from './index-3223e5c3.js';
+import PriceSumm from './index-12012931.js';
 import classnames from 'classnames';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -23,7 +23,7 @@ import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-switch';
 import 'react-countup';
-import './index.module-d9e8f40c.js';
+import './index.module-706bb3a7.js';
 
 var container = "container-jfAym";
 var backOverwrite = "back-overwrite--AJgH";

package/build/esm/{index-e7683200.js → index-097b2853.js}

@@ -1,7 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { s as styleInject, u as useViewHandler } from './index-79d92bc4.js';
+import { s as styleInject, u as useViewHandler } from './index-22049a2e.js';
 import 'react';
-import BasketAction from './index-14bca5eb.js';
+import BasketAction from './index-03fac510.js';
 import { observer } from 'mobx-react-lite';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
@@ -22,7 +22,7 @@ import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-switch';
 import 'react-countup';
-import './index.module-d9e8f40c.js';
+import './index.module-706bb3a7.js';
 
 var wcCheckoutButtonText = "wcCheckoutButtonText-bETEx";
 var wcCheckoutButtonPrice = "wcCheckoutButtonPrice-iT78h";

package/build/esm/{index-2443b523.js → index-09a751c1.js}

@@ -1,7 +1,7 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { c as usePlannerUIHandler } from './index-79d92bc4.js';
+import { c as usePlannerUIHandler } from './index-22049a2e.js';
 import { useState } from 'react';
-import DPACC from './index-33419e8f.js';
+import DPACC from './index-d769323f.js';
 import { Vector2 } from '@crystaldesign/web-planner-logic';
 import { jsx, Fragment } from 'react/jsx-runtime';