@crystaldesign/diva-web-planner-react 25.4.0-beta.7 → 25.4.0-beta.8

package/build/esm/{index-d89c468f.js → index-81112a46.js}

@@ -1,18 +1,19 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import React, { useState, useEffect, Suspense } from 'react';
 import { observer } from 'mobx-react-lite';
 import sift from 'sift';
-import TextBox from './index-6138991a.js';
-import ItemVariant from './index-2786f79f.js';
-import SettingsPaletteGroup from './index-f46d21cc.js';
-import ToggleOption from './index-63904765.js';
-import GroupDropdown from './index-b91c3f4e.js';
-import PromotedProducts from './index-dd21abb8.js';
-import ToggleName from './index-168a98ff.js';
-import itemPaletteTypeComponentMap from './index-fa19cc62.js';
-import ItemWrapper from './index-cd7d8a87.js';
+import TextBox from './index-42733f61.js';
+import ItemVariant from './index-a2fd2147.js';
+import SettingsPaletteGroup from './index-7751c02e.js';
+import ToggleOption from './index-2a58e3a6.js';
+import GroupDropdown from './index-3e08163e.js';
+import PromotedProducts from './index-1352f559.js';
+import ToggleName from './index-767e49c8.js';
+import itemPaletteTypeComponentMap from './index-b78ac848.js';
+import ItemWrapper from './index-8793821f.js';
+import Checkout from './index-8e60a91b.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
 
 var collapsableInner = "collapsable-inner-YPvJa";
@@ -22,13 +23,13 @@ styleInject(css_248z);
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ShelfPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-4ec5039d.js');
+  return import('./index-235f06b8.js');
 });
 var DoorPlanner = /*#__PURE__*/React.lazy(function () {
-  return import('./index-97c9f367.js');
+  return import('./index-bd9b73a1.js');
 });
 var ProductList = /*#__PURE__*/React.lazy(function () {
-  return import('./index-1c28d170.js');
+  return import('./index-980c4f86.js');
 });
 var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
   var _viewHandler$uiState$, _settingsSizes$gapDef, _settingsSizes$sizeDe, _viewHandler$uiState$2, _item$groups$;
@@ -118,6 +119,10 @@ var SettingsPaletteItem = function SettingsPaletteItem(_ref) {
   } : {});
   if (!item.visible) return /*#__PURE__*/jsx(Fragment, {});
   switch (item.type) {
+    case 'CHECKOUT':
+      return /*#__PURE__*/jsx(Checkout, {
+        viewHandler: viewHandler
+      });
     case 'TOGGLE':
       return /*#__PURE__*/jsx(ToggleOption, {
         style: variables,

package/build/esm/{index-0d61343b.js → index-822efc7f.js}

@@ -1,14 +1,14 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { u as useViewHandler } from './index-76cd82f8.js';
+import { u as useViewHandler } from './index-18f7cf20.js';
 import { toJS } from 'mobx';
 import { useState } from 'react';
-import { h as header } from './index.module-67f77ec2.js';
-import { c as collapsibleHeader, d as dpArrow, b as dArrow, e as boxes, f as box, g as boxSelected, h as boxImage, j as jsonSelection, i as jsonSelected } from './index.module-e5103385.js';
+import { h as header } from './index.module-e304c09b.js';
+import { c as collapsibleHeader, d as dpArrow, b as dArrow, e as boxes, f as box, g as boxSelected, h as boxImage, j as jsonSelection, i as jsonSelected } from './index.module-d05f4df7.js';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
-import { n as notExpanded } from './index.module-25d415db.js';
+import { n as notExpanded } from './index.module-79888996.js';
 import Collapsible from 'react-collapsible';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';

package/build/esm/{index-0a676eda.js → index-82e92fd9.js}

@@ -1,9 +1,9 @@
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import 'react';
 import { useTranslation } from '@crystaldesign/diva-core';
 import { observer } from 'mobx-react-lite';
-import ArQrCodeIcon from './index-18627b05.js';
-import ProductRoomList from './index-12906874.js';
+import ArQrCodeIcon from './index-4903ed24.js';
+import ProductRoomList from './index-1560a013.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
@@ -19,10 +19,10 @@ import 'mobx';
 import '@crystaldesign/web-planner-logic';
 import '@crystaldesign/widget-contact-form';
 import 'react-laag';
-import './index-76c3604a.js';
+import './index-30a73b2a.js';
 import 'react-qr-code';
 import 'classnames';
-import './index-ffb23367.js';
+import './index-236b036d.js';
 
 var wcNav3DToolbar = "wc_Nav3DToolbar-NM2CK";
 var wcZoomIn = "wcZoomIn-7oss5";

package/build/esm/{index-04f8ca55.js → index-85b8153b.js}

@@ -1,16 +1,16 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import { useState } from 'react';
 import { useHover, useLayer } from 'react-laag';
 import { observer } from 'mobx-react-lite';
-import { w as wcFavoriteSel, a as wcFavorite } from './index.module-53a3b01f.js';
+import { w as wcFavoriteSel, a as wcFavorite } from './index.module-57b914b7.js';
 import classnames from 'classnames';
-import IsActive from './index-40adb86e.js';
+import IsActive from './index-341a3791.js';
 import { useDivaCore } from '@crystaldesign/diva-core';
-import GenericToolTip from './index-707fae03.js';
-import InfoIcon from './index-32b9e617.js';
-import PricePreview from './index-ce6de83a.js';
+import GenericToolTip from './index-ef12aacd.js';
+import InfoIcon from './index-c2ce216e.js';
+import PricePreview from './index-ce2674b6.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@babel/runtime/helpers/objectWithoutProperties';

package/build/esm/{index-e0909ac8.js → index-8671d0a4.js}

@@ -3,7 +3,7 @@ import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useState, useEffect } from 'react';

package/build/esm/{index-cd7d8a87.js → index-8793821f.js}

@@ -1,9 +1,9 @@
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import 'react';
 import classnames from 'classnames';
-import StepInfo from './index-0350c05e.js';
-import SettingsHeader from './index-24c42098.js';
-import ReplaceSwitch from './index-5a12c0df.js';
+import StepInfo from './index-b5223142.js';
+import SettingsHeader from './index-5983454c.js';
+import ReplaceSwitch from './index-5a2f0b7f.js';
 import { observer } from 'mobx-react-lite';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/index-87b0f626.js

@@ -0,0 +1,194 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import './index-18f7cf20.js';
+import { useState } from 'react';
+import { s as subWrapper, c as scrollWrapper, t as textWrapper, d as boldText, e as icon, f as checkGreen, g as inputWrapper2, h as inputWrapper, j as input, k as errorText, b as button, a as inverted, l as disabled } from './index.module-dce9ccba.js';
+import classnames from 'classnames';
+import Select from 'react-select';
+import { useDivaCore, useTranslation, DivaUtils } from '@crystaldesign/diva-core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/objectWithoutProperties';
+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 '@crystaldesign/widget-contact-form';
+import 'mobx-react-lite';
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var CreateAppointment = function CreateAppointment(_ref) {
+  var basket = _ref.basket,
+    config = _ref.config;
+  var _useDivaCore = useDivaCore(),
+    sendEmail = _useDivaCore.actions.sendEmail;
+  var _useTranslation = useTranslation(),
+    i18n = _useTranslation.i18n;
+    _useTranslation.t;
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    ableToSend = _useState2[0],
+    setAbleToSend = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    showWarning = _useState4[0],
+    setShowWarning = _useState4[1];
+  var _useState5 = useState(''),
+    _useState6 = _slicedToArray(_useState5, 2),
+    mail = _useState6[0],
+    setMail = _useState6[1];
+  var _useState7 = useState(''),
+    _useState8 = _slicedToArray(_useState7, 2),
+    name = _useState8[0],
+    setName = _useState8[1];
+  var _useState9 = useState(''),
+    _useState10 = _slicedToArray(_useState9, 2),
+    surName = _useState10[0],
+    setSurName = _useState10[1];
+  var _useState11 = useState(''),
+    _useState12 = _slicedToArray(_useState11, 2),
+    telNumber = _useState12[0],
+    setTelNumber = _useState12[1];
+  var sendMail = function sendMail() {
+    if (!DivaUtils.validateEmail(mail)) {
+      setAbleToSend(false);
+      setShowWarning(true);
+      return;
+    }
+    sendEmail({
+      content: _objectSpread(_objectSpread({}, config), {}, {
+        to: mail,
+        divaNr: basket.DivaNr,
+        type: 'basket',
+        language: i18n.language
+      })
+    });
+  };
+  var onChangeMail = function onChangeMail(input) {
+    var validMail = DivaUtils.validateEmail(input);
+    setAbleToSend(validMail);
+    if (validMail) setShowWarning(false);
+    setMail(input);
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: subWrapper,
+    children: [/*#__PURE__*/jsxs("div", {
+      className: scrollWrapper,
+      children: ["WORK IN PROGRESS", /*#__PURE__*/jsx("div", {
+        className: classnames(textWrapper, boldText),
+        children: "Ihre Vorteile:"
+      }), /*#__PURE__*/jsxs("div", {
+        className: textWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, checkGreen)
+        }), "Pers\xF6nliche Beratung durch unsere Experten"]
+      }), /*#__PURE__*/jsxs("div", {
+        className: textWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, checkGreen)
+        }), "Optimierung Ihrer Konfiguration"]
+      }), /*#__PURE__*/jsxs("div", {
+        className: textWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(icon, checkGreen)
+        }), "Individuelle Anpassungsm\xF6glichkeiten"]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper2,
+        children: [/*#__PURE__*/jsxs("div", {
+          className: inputWrapper,
+          children: [/*#__PURE__*/jsx("div", {
+            className: classnames(boldText),
+            children: "Dein Vorname"
+          }), /*#__PURE__*/jsx("input", {
+            className: input,
+            type: "text",
+            value: name,
+            onChange: function onChange(e) {
+              return setName(e.target.value);
+            }
+          })]
+        }), /*#__PURE__*/jsxs("div", {
+          className: inputWrapper,
+          children: [/*#__PURE__*/jsx("div", {
+            className: classnames(boldText),
+            children: "Dein Nachname"
+          }), /*#__PURE__*/jsx("input", {
+            className: input,
+            type: "text",
+            value: surName,
+            onChange: function onChange(e) {
+              return setSurName(e.target.value);
+            }
+          })]
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(boldText),
+          children: "Deine E-Mail-Adresse"
+        }), /*#__PURE__*/jsx("input", {
+          className: input,
+          type: "email",
+          value: mail,
+          onChange: function onChange(e) {
+            return onChangeMail(e.target.value);
+          }
+        }), showWarning && /*#__PURE__*/jsx("div", {
+          className: errorText,
+          children: "Bitte geben sie eine vollst\xE4ndige E-Mailadresse an!"
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(boldText),
+          children: "Telefonnummer"
+        }), /*#__PURE__*/jsx("input", {
+          className: input,
+          type: "text",
+          value: telNumber,
+          onChange: function onChange(e) {
+            return setTelNumber(e.target.value);
+          }
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(boldText),
+          children: "Bevorzugte Kontaktart"
+        }), /*#__PURE__*/jsx(Select, {
+          options: ['Telefon', 'E-Mail', 'Video-Call']
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(boldText),
+          children: "Bevorzugte Tageszeit"
+        }), /*#__PURE__*/jsx(Select, {
+          options: ['Vormittag', 'Nachmittag', 'Abends']
+        })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: inputWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          className: classnames(boldText),
+          children: "Ihre Nachricht (optional )"
+        }), /*#__PURE__*/jsx("textarea", {
+          id: "message",
+          placeholder: "Haben Sie spezielle Fragen oder W\xFCnsche?"
+        })]
+      })]
+    }), /*#__PURE__*/jsx("button", {
+      className: classnames(button, inverted, !ableToSend ? disabled : undefined),
+      onClick: function onClick() {
+        return sendMail();
+      },
+      children: "Termin anfragen"
+    })]
+  });
+};
+
+export { CreateAppointment as default };

package/build/esm/{index-e5f1cd16.js → index-88881481.js}

@@ -1,7 +1,7 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-76cd82f8.js';
+import { u as useViewHandler } from './index-18f7cf20.js';
 import { useState, useEffect } from 'react';
-import ItemVariant from './index-55cef77b.js';
+import ItemVariant from './index-9703d8c0.js';
 import { observer } from 'mobx-react-lite';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-c1292005.js → index-88ccd4c8.js}

@@ -1,4 +1,4 @@
-import './index-76cd82f8.js';
+import './index-18f7cf20.js';
 import 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-2a41ab57.js → index-8bfc5ff1.js}

@@ -1,7 +1,7 @@
-import { u as useViewHandler } from './index-76cd82f8.js';
+import { u as useViewHandler } from './index-18f7cf20.js';
 import 'react';
 import DivaUtils from '@crystaldesign/diva-utils';
-import Toggle from './index-08cbd4a6.js';
+import Toggle from './index-2758628e.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';

package/build/esm/{index-8a9fc25a.js → index-8d0dddb3.js}

@@ -1,13 +1,13 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { s as styleInject, u as useViewHandler } from './index-76cd82f8.js';
+import { s as styleInject, u as useViewHandler } from './index-18f7cf20.js';
 import { observer } from 'mobx-react-lite';
 import { useRef, useEffect } from 'react';
 import classnames from 'classnames';
 import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
-import TabGroupHorizontal from './index-f001ce9d.js';
-import TabGroupVertical from './index-e5f1cd16.js';
-import TabSearch from './index-1858af28.js';
+import TabGroupHorizontal from './index-71f26616.js';
+import TabGroupVertical from './index-88881481.js';
+import TabSearch from './index-1c1e9550.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@babel/runtime/helpers/asyncToGenerator';
@@ -20,8 +20,8 @@ import '@crystaldesign/diva-utils';
 import 'mobx';
 import '@crystaldesign/web-planner-logic';
 import '@crystaldesign/widget-contact-form';
-import './index-8e997092.js';
-import './index-55cef77b.js';
+import './index-ed91378b.js';
+import './index-9703d8c0.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
 
 var wcConfiguratorSteps = "wcConfigurator-steps-1pUS0";