@crystaldesign/diva-web-planner-react 24.10.0-beta.10 → 24.10.0-beta.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystaldesign/diva-web-planner-react",
-  "version": "24.10.0-beta.10",
+  "version": "24.10.0-beta.11",
   "license": "MIT",
   "devDependencies": {
     "@testing-library/jest-dom": "^5.15.0",
@@ -13,10 +13,10 @@
     "react-dom": "17.0.2"
   },
   "dependencies": {
-    "@crystaldesign/content-item": "24.10.0-beta.10",
-    "@crystaldesign/products-component": "24.10.0-beta.10",
-    "@crystaldesign/real-time-viewer": "24.10.0-beta.10",
-    "@crystaldesign/web-planner-logic": "24.10.0-beta.10",
+    "@crystaldesign/content-item": "24.10.0-beta.11",
+    "@crystaldesign/products-component": "24.10.0-beta.11",
+    "@crystaldesign/real-time-viewer": "24.10.0-beta.11",
+    "@crystaldesign/web-planner-logic": "24.10.0-beta.11",
     "@google/model-viewer": "3.4.0",
     "@react-google-maps/api": "2.7.0",
     "@types/three": "^0.160.0",
@@ -47,5 +47,5 @@
   },
   "types": "./build/types/web-planner-react/src/index.d.ts",
   "module": "build/esm/index.js",
-  "gitHead": "5379b713e41f91c177abdfc31041006c51f73d4e"
+  "gitHead": "4615ac89a35c20c278b991124103dd53ee81fb42"
 }

package/build/esm/PlannerSirvViewer-d6886782.js

@@ -1,70 +0,0 @@
-import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
-import _createClass from '@babel/runtime/helpers/createClass';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-bc8b9202.js';
-import { getLogger } from '@crystaldesign/diva-core';
-import { toJS } from 'mobx';
-import 'react';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import '@crystaldesign/web-planner-logic';
-import 'react/jsx-runtime';
-import 'mobx-react-lite';
-
-getLogger('Planner', 'PlannerSirvViewer');
-var PlannerSirvViewer = /*#__PURE__*/function () {
-  function PlannerSirvViewer(productState, sirvSpinnables, arModels) {
-    _classCallCheck(this, PlannerSirvViewer);
-    _defineProperty(this, "sirvSpinnables", void 0);
-    _defineProperty(this, "arModels", void 0);
-    _defineProperty(this, "productState", void 0);
-    _defineProperty(this, "setTimestamp", void 0);
-    this.sirvSpinnables = sirvSpinnables;
-    this.arModels = arModels;
-    this.productState = productState;
-  }
-  return _createClass(PlannerSirvViewer, [{
-    key: "updatePlannerView",
-    value: function updatePlannerView(rendering, articleVariantValues) {
-      var url = rendering.getHQRenderingURL();
-      var medias = [];
-      if (url) medias.push({
-        url: url,
-        mediaType: 'PCT'
-      });
-      if (articleVariantValues !== null && articleVariantValues !== void 0 && articleVariantValues.length) {
-        var _this$sirvSpinnables;
-        var spin = (_this$sirvSpinnables = this.sirvSpinnables) === null || _this$sirvSpinnables === void 0 ? void 0 : _this$sirvSpinnables[articleVariantValues[0].articleCodex];
-        if (spin) medias.push({
-          url: spin,
-          mediaType: 'SPIN'
-        });
-      }
-      if (rendering.getArURl()) medias.push({
-        url: rendering.getArURl(),
-        mediaType: 'AR'
-      });
-      if (JSON.stringify(medias) !== JSON.stringify(toJS(this.productState.currentMediaItems))) this.productState.setCurrentMediaItems(medias);
-    }
-  }, {
-    key: "setCurrentMediaItems",
-    value: function setCurrentMediaItems(mediaItems) {
-      var _this = this;
-      if (this.setTimestamp && this.setTimestamp + 500 > Date.now()) {
-        setTimeout(function () {
-          _this.setCurrentMediaItems(mediaItems);
-        }, 1500);
-      } else {
-        this.productState.setCurrentMediaItems(mediaItems);
-        this.setTimestamp = Date.now();
-      }
-    }
-  }]);
-}();
-
-export { PlannerSirvViewer as default };

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

@@ -1,29 +0,0 @@
-import { s as styleInject } from './index-bc8b9202.js';
-import 'react';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'mobx-react-lite';
-
-var isActive = "is-active-9I6Tg";
-var css_248z = ".is-active-9I6Tg {\n  position: absolute;\n  left: 4px;\n  top: 4px;\n  height: 21px;\n  width: 21px;\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%3Crect x%3D%224%22 y%3D%226%22 width%3D%2216%22 height%3D%2213%22 fill%3D%22white%22%2F%3E%3Cpath d%3D%22M23.625 12C23.625 5.625 18.375 0.375 12 0.375C5.57812 0.375 0.375 5.625 0.375 12C0.375 18.4219 5.57812 23.625 12 23.625C18.375 23.625 23.625 18.4219 23.625 12ZM10.6406 18.1875C10.3594 18.4688 9.84375 18.4688 9.5625 18.1875L4.6875 13.3125C4.40625 13.0312 4.40625 12.5156 4.6875 12.2344L5.76562 11.2031C6.04688 10.875 6.51562 10.875 6.79688 11.2031L10.125 14.4844L17.1562 7.45312C17.4375 7.125 17.9062 7.125 18.1875 7.45312L19.2656 8.48438C19.5469 8.76562 19.5469 9.28125 19.2656 9.5625L10.6406 18.1875Z%22 fill%3D%22black%22%2F%3E%3C%2Fsvg%3E\");\n  background-repeat: no-repeat;\n  border-radius: 20px;\n  background-position: center;\n  z-index: 100;\n}\n";
-styleInject(css_248z);
-
-var IsActive = function IsActive() {
-  return /*#__PURE__*/jsx("div", {
-    className: isActive
-  });
-};
-
-export { IsActive as default };

package/build/esm/index-4f1e593a.js

@@ -1,32 +0,0 @@
-import { u as useViewHandler } from './index-bc8b9202.js';
-import 'react';
-import { a as wcFavorite } from './index.module-ebf1acc9.js';
-import { jsx, Fragment } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'mobx-react-lite';
-
-var FavoritesButtton = function FavoritesButtton(_ref) {
-  var item = _ref.item;
-  var viewHandler = useViewHandler();
-  if (!viewHandler.productState.doShowCreateCache) return /*#__PURE__*/jsx(Fragment, {});
-  return /*#__PURE__*/jsx("div", {
-    onClick: function onClick() {
-      return viewHandler.paletteViewHandler.onTitleFavClick(item.id);
-    },
-    className: wcFavorite
-  });
-};
-
-export { FavoritesButtton as default };

package/build/esm/index-70885e59.js

@@ -1,153 +0,0 @@
-import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-bc8b9202.js';
-import { observer } from 'mobx-react-lite';
-import { useState, useEffect } from 'react';
-import { ContentBoxComponent } from '@crystaldesign/content-box';
-import { useDivaCore } from '@crystaldesign/diva-core';
-import classnames from 'classnames';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-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';
-
-var wcConfiguratorSirvViewer = "wcConfigurator-SirvViewer-NtMxs";
-var wrapper = "wrapper-OlTJA";
-var arThumb = "arThumb-MDtJd";
-var image = "image-k5ZsT";
-var css_248z = ".wcConfigurator-SirvViewer-NtMxs {\n  position: relative;\n  top: 50%;\n  transform: translateY(-50%);\n  z-index: 200;\n  height: 100%;\n}\n\n.wrapper-OlTJA {\n  position: relative;\n}\n\n.arThumb-MDtJd {\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox%3D'0 0 48 48' fill%3D'none' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath fill-rule%3D'evenodd' clip-rule%3D'evenodd' d%3D'M35.8149 18.5697c.1631.3545.3111.7175.4424 1.0883 1.3982.2431 2.6883.5262 3.8482.8425 2.0478.5585 3.6328 1.2057 4.6821 1.8824 1.0942.7056 1.3611 1.2749 1.3611 1.617 0 .3421-.2669.9114-1.3611 1.6169-1.0493.6768-2.6343 1.324-4.6821 1.8825-1.1599.3163-2.45.5993-3.8482.8425-.1313.3707-.279.7336-.4421 1.0881 6.7861-1.1006 11.3335-3.1205 11.3335-5.43 0-2.3096-4.5476-4.3296-11.3338-5.4302zm-6.3847 17.2452c-.3545.1632-.7173.311-1.0882.4423-.2431 1.3981-.5261 2.6881-.8425 3.848-.5583 2.0479-1.2056 3.6327-1.8823 4.6822-.7056 1.0942-1.2749 1.361-1.617 1.361-.342 0-.9113-.2668-1.6169-1.361-.6768-1.0495-1.324-2.6343-1.8823-4.6822-.3164-1.1598-.5994-2.4498-.8426-3.8478-.3708-.1313-.7338-.279-1.0883-.4422 1.1006 6.786 3.1203 11.3332 5.4301 11.3332 2.3096 0 4.3294-4.5473 5.43-11.3335zM31.6505 28.4122l-7.5169 4.6786-7.8897-5.4306v-7.7678l7.9045-4.7363 7.6204 4.7418-.1183 8.5143zm-.751-.3813l.1008-7.255-6.4777 4.2992V32l6.3769-3.9691zm-7.1331 3.9298v-6.8816l-6.7663-4.3242v6.5485l6.7663 4.6573zm-6.4601-11.8659l6.8341 4.3676 6.5808-4.3677-6.5806-4.0948-6.8343 4.0949z' fill%3D'%23fff'%2F%3E%3Cpath d%3D'M25.6172 3.21252c-.7056-1.09423-1.2749-1.36108-1.617-1.36108-.342 0-.9113.26685-1.6169 1.36108-.6768 1.04944-1.324 2.63428-1.8823 4.68201-.3164 1.15991-.5994 2.45007-.8426 3.84817a12.9205 12.9205 0 00-1.0883.4421C19.6707 5.3988 21.6904.85144 24.0002.85144c2.0519 0 3.8751 3.58915 5.0283 9.14856H30a.50008.50008 0 01.4253.2371.49995.49995 0 01.0219.4865l-1.5 3a.49916.49916 0 01-.1843.2017A.4993.4993 0 0128.5 14a.49896.49896 0 01-.2628-.0747.4994.4994 0 01-.1844-.2017l-1.5-3a.50039.50039 0 01-.0523-.2461.50103.50103 0 01.0742-.2404A.49998.49998 0 0127 10h1.0066c-.1574-.74137-.3268-1.44458-.5071-2.10547-.5583-2.04773-1.2056-3.63257-1.8823-4.68201zM12.1848 29.4299c-.1638-.3559-.3113-.719-.4421-1.0882-1.398-.2431-2.68801-.5261-3.84792-.8424-2.04761-.5585-3.63257-1.2057-4.68213-1.8825-1.09424-.7055-1.36109-1.2748-1.36109-1.6169 0-.3421.26685-.9114 1.36109-1.617 1.04956-.6767 2.63452-1.3239 4.68213-1.8824.5105-.1392 1.0462-.272 1.60522-.3977v1.0003c0 .0852.02179.1691.06329.2435a.5002.5002 0 00.41423.256.50036.50036 0 00.24608-.0523l3-1.5a.49916.49916 0 00.2017-.1843.4993.4993 0 00.0747-.2629.49896.49896 0 00-.0747-.2628.4994.4994 0 00-.2017-.1844l-3-1.5a.50036.50036 0 00-.24608-.0523.5002.5002 0 00-.41423.256.50035.50035 0 00-.06329.2435v.9753C4.22636 20.2356.85156 22.0102.85156 23.9999c0 2.3095 4.54712 4.3294 11.33324 5.43z' fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E\");\n  background-color: rgba(55, 58, 60, 0.7);\n  background-repeat: no-repeat;\n  width: calc(100% - 2px);\n  height: calc(100% - 2px);\n  z-index: 10;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.image-k5ZsT {\n  height: auto !important;\n  width: 100% !important;\n}\n\n.image-k5ZsT {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\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 DEFAULTOPTION = 'quality:95;hdQuality:95;zoom.mode:deep;thumbnails.enable:false;thumbnails.type:square;fullscreen.thumbnails.enable:false';
-var PlannerSirvViewer = function PlannerSirvViewer(props) {
-  var viewHandler = useViewHandler();
-  var _useDivaCore = useDivaCore(),
-    isMobile = _useDivaCore.state.dimensions.isMobile;
-  var _useState = useState(),
-    _useState2 = _slicedToArray(_useState, 2),
-    currentItem = _useState2[0],
-    setCurrentItem = _useState2[1];
-  var _useState3 = useState([]),
-    _useState4 = _slicedToArray(_useState3, 2),
-    medias = _useState4[0],
-    setMedias = _useState4[1];
-  var _useState5 = useState(DEFAULTOPTION),
-    _useState6 = _slicedToArray(_useState5, 2),
-    option = _useState6[0],
-    setOption = _useState6[1];
-  var _useState7 = useState(),
-    _useState8 = _slicedToArray(_useState7, 2),
-    defaultAr = _useState8[0],
-    setDefaultAr = _useState8[1];
-  useEffect(function () {
-    var _viewHandler$productS;
-    var newMedia = JSON.parse(JSON.stringify((_viewHandler$productS = viewHandler.productState.currentMediaItems) !== null && _viewHandler$productS !== void 0 ? _viewHandler$productS : []));
-    if (!defaultAr) setDefaultAr(newMedia.find(function (m) {
-      return m.mediaType == 'AR';
-    }));
-    newMedia.map(function (media, i) {
-      if (media.mediaType === 'AR' && !media.thumb) {
-        var _newMedia$find;
-        if (currentItem !== i && viewHandler.uiState.configSettingsIsHidden) setCurrentItem(i);
-        media.thumb = /*#__PURE__*/jsxs("div", {
-          style: {
-            width: isMobile ? 50 : 70,
-            height: isMobile ? 50 : 70
-          },
-          className: classnames(wrapper),
-          children: [/*#__PURE__*/jsx("div", {
-            className: arThumb
-          }), /*#__PURE__*/jsx("img", {
-            className: image,
-            src: (_newMedia$find = newMedia.find(function (media) {
-              return media.mediaType === 'PCT';
-            })) === null || _newMedia$find === void 0 ? void 0 : _newMedia$find.url
-          })]
-        });
-      }
-    });
-    if (newMedia.find(function (media) {
-      return media.mediaType === 'SPIN' || media.mediaType === 'SPN' || media.mediaType === 'AR';
-    })) {
-      setOption('quality:95;hdQuality:95;zoom.mode:deep;thumbnails.position:left;thumbnails.enable:true;arrows:false;thumbnails.type:square;fullscreen.thumbnails.enable:false' + (isMobile ? ';thumbnails.size:50' : ''));
-    } else {
-      setOption(DEFAULTOPTION);
-    }
-    if (!newMedia.find(function (m) {
-      return m.mediaType == 'AR';
-    }) && defaultAr) {
-      newMedia.push(_objectSpread(_objectSpread({}, defaultAr), {}, {
-        url: ''
-      }));
-    }
-    setMedias(newMedia);
-  }, [viewHandler.productState.currentMediaItems, isMobile]);
-  useEffect(function () {
-    if (viewHandler.uiState.configSettingsIsHidden) {
-      if (!medias.find(function (m) {
-        return m.mediaType == 'AR' && (m === null || m === void 0 ? void 0 : m.url) !== '';
-      })) {
-        viewHandler.productState.configFirstPromo();
-      }
-      medias.map(function (m, i) {
-        if (m.mediaType == 'AR' && currentItem !== i && viewHandler.uiState.configSettingsIsHidden) setCurrentItem(i);
-      });
-    } else {
-      if (currentItem !== 0) setCurrentItem(0);
-    }
-  }, [viewHandler.uiState.configSettingsIsHidden]);
-  var setCurrentItemBySirv = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(index) {
-      var media;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            media = medias[index];
-            if (viewHandler.uiState.configSettingsIsHidden) {
-              if ((media === null || media === void 0 ? void 0 : media.mediaType) != 'AR') {
-                viewHandler.uiState.onClickHideConfigSettings();
-              }
-            } else {
-              if ((media === null || media === void 0 ? void 0 : media.mediaType) == 'AR') {
-                viewHandler.uiState.onClickHideConfigSettings();
-              }
-            }
-          case 2:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-    return function setCurrentItemBySirv(_x) {
-      return _ref.apply(this, arguments);
-    };
-  }();
-  return /*#__PURE__*/jsx("div", {
-    className: wcConfiguratorSirvViewer,
-    children: /*#__PURE__*/jsx(ContentBoxComponent, {
-      settings: {
-        contentBoxProps: {
-          type: 'MediaViewer',
-          medias: medias,
-          defaultDataOptions: option,
-          currentItem: currentItem,
-          setCurrentItem: setCurrentItemBySirv
-        }
-      }
-    }, JSON.stringify(medias.map(function (media) {
-      return media.url;
-    })) + viewHandler.uiState.configSettingsIsHidden)
-  });
-};
-var PlannerSirvViewer$1 = observer(PlannerSirvViewer);
-
-export { PlannerSirvViewer$1 as default };

package/build/esm/index-75ab0bc4.js

@@ -1,50 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-bc8b9202.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useRef, useEffect } from 'react';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-
-var header = "header-cf0Kg";
-var openClass = "openClass-rX3rc";
-var text = "text-4M906";
-var collapseArrow = "collapseArrow-AYNzd";
-var mobile = "mobile-aCpc5";
-var css_248z = ".header-cf0Kg {\n  height: 48px;\n  position: relative;\n  background-color: #f8f8f8;\n  border-top: 1px solid #f0f0f0;\n  border-bottom: 1px solid #f0f0f0;\n}\n\n.openClass-rX3rc {\n  color: white;\n  background-color: var(--primaryColor);\n}\n\n.text-4M906 {\n  padding: 11px;\n  font-weight: 300;\n  font-size: 22px;\n}\n\n.collapseArrow-AYNzd {\n  background-repeat: no-repeat;\n  background-position: center center;\n  background-size: contain;\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 16.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg version%3D%221.1%22 id%3D%22Capa_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 width%3D%22960px%22 height%3D%22560px%22 viewBox%3D%220 0 960 560%22 enable-background%3D%22new 0 0 960 560%22 xml%3Aspace%3D%22preserve%22%3E%3Cg id%3D%22Rounded_Rectangle_33_copy_4_1_%22%3E%09%3Cpath d%3D%22M480%2C344.181L268.869%2C131.889c-15.756-15.859-41.3-15.859-57.054%2C0c-15.754%2C15.857-15.754%2C41.57%2C0%2C57.431l237.632%2C238.937%09%09c8.395%2C8.451%2C19.562%2C12.254%2C30.553%2C11.698c10.993%2C0.556%2C22.159-3.247%2C30.555-11.698l237.631-238.937%09%09c15.756-15.86%2C15.756-41.571%2C0-57.431s-41.299-15.859-57.051%2C0L480%2C344.181z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  transform: rotate(90deg);\n  transition: all 0.35s ease;\n  width: 40px;\n  height: 40px;\n  position: absolute;\n  right: 25px;\n  top: 5px;\n}\n\n.openClass-rX3rc .collapseArrow-AYNzd {\n  transform: rotate(0deg);\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.0.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0)  --%3E%3Csvg version%3D%221.1%22 id%3D%22Capa_1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 x%3D%220px%22 y%3D%220px%22%09 viewBox%3D%220 0 960 560%22 style%3D%22enable-background%3Anew 0 0 960 560%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cg id%3D%22Rounded_Rectangle_33_copy_4_1_%22%3E%09%3Cpath class%3D%22st0%22 d%3D%22M480%2C344.2L268.9%2C131.9c-15.8-15.9-41.3-15.9-57.1%2C0c-15.8%2C15.9-15.8%2C41.6%2C0%2C57.4l237.6%2C238.9%09%09c8.4%2C8.5%2C19.6%2C12.3%2C30.6%2C11.7c11%2C0.6%2C22.2-3.2%2C30.6-11.7l237.6-238.9c15.8-15.9%2C15.8-41.6%2C0-57.4s-41.3-15.9-57.1%2C0L480%2C344.2z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n\n.mobile-aCpc5.header-cf0Kg {\n  height: 36px;\n}\n\n.mobile-aCpc5 .text-4M906 {\n  padding: 10px;\n  font-weight: 300;\n  font-size: 14px;\n}\n\n.mobile-aCpc5 .collapseArrow-AYNzd {\n  width: 34px;\n  height: 34px;\n  position: absolute;\n  right: 25px;\n  top: 0px;\n}\n";
-styleInject(css_248z);
-
-var SubTabGroupHeader = function SubTabGroupHeader(_ref) {
-  var open = _ref.open,
-    subTabGroup = _ref.subTabGroup,
-    index = _ref.index;
-  var viewHandler = useViewHandler();
-  var subTabGroupItemRef = useRef(null);
-  useEffect(function () {
-    viewHandler.tabGroupState.setSubTabGroupItems(index, subTabGroupItemRef.current);
-  }, [subTabGroupItemRef]);
-  return /*#__PURE__*/jsxs("div", {
-    ref: subTabGroupItemRef,
-    className: classnames(header, open ? openClass : undefined, viewHandler.uiState.isInMobileView ? mobile : undefined),
-    children: [/*#__PURE__*/jsx("div", {
-      className: text,
-      children: subTabGroup
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(collapseArrow)
-    })]
-  });
-};
-var SubTabGroupHeader$1 = observer(SubTabGroupHeader);
-
-export { SubTabGroupHeader$1 as default };

package/build/esm/index-7a6b81e5.js

@@ -1,61 +0,0 @@
-import { s as styleInject } from './index-bc8b9202.js';
-import 'react';
-import PlannerMsgContainer from './index-a3d3b82d.js';
-import { jsx } from 'react/jsx-runtime';
-import '@babel/runtime/helpers/defineProperty';
-import 'react-dynamic-multi-render';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@crystaldesign/diva-core';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-import 'mobx-react-lite';
-import 'classnames';
-import './index-e9073b6d.js';
-
-var wcPlannerMsgContainer = "wcPlanner_MsgContainer-2Gp-B";
-var wcPlannerInfoContainer = "wcPlanner_InfoContainer-Na2gn";
-var wcPlannerWarningContainer = "wcPlanner_WarningContainer-e7hQJ";
-var wcPlannerMsgImg = "wcPlanner_msgImg-LCgfN";
-var wcPlannerWarningImg = "wcPlanner_WarningImg-F3Se9";
-var wcPlannerMsgText = "wcPlanner_MsgText-5FGce";
-var landscape = "landscape-tKO32";
-var portrait = "portrait-jLDul";
-var wcPlannerWarningText = "wcPlanner_WarningText--s0rh";
-var wcPlannerInfoText = "wcPlanner_InfoText-xi8XR";
-var wcPlannerInfoContainerCollapsed = "wcPlanner_InfoContainerCollapsed-wxSqk";
-var wcPlannerMsgContainerParent = "wcPlanner_MsgContainerParent-ZouV8";
-var wcClose = "wcClose-S3om7";
-var wcCloseButton = "wcCloseButton-CHr90";
-var css_248z = ".wcPlanner_MsgContainer-2Gp-B {\n  width: -moz-fit-content;\n  width: fit-content;\n  height: -moz-fit-content;\n  height: fit-content;\n  min-height: 35px;\n  background-color: rgba(255, 255, 255, 0.9);\n  padding: 0.2rem;\n  padding-right: calc(1.2rem + 20px); /* Safari, Chrome and Opera > 12.1 */ /* Firefox < 16 */ /* Internet Explorer */ /* Opera < 12.1 */\n  animation: fadein-bDTPb 0.5s;\n}\n\n.wcPlanner_MsgContainer_Hide-0rGNa {\n  animation: cssAnimation-UJm2b 5s forwards;\n}\n\n.wcPlanner_InfoContainer-Na2gn {\n  float: left;\n  border: medium none currentColor;\n  border: initial;\n  box-shadow: 0 0 3px #ccc;\n}\n.wcPlanner_WarningContainer-e7hQJ {\n  margin-bottom: 16px;\n  border: 1px solid #dfdfdf;\n}\n\n.wcPlanner_msgImg-LCgfN {\n  background-image: none;\n}\n\n.wcPlanner_WarningImg-F3Se9 {\n  background-image: none;\n}\n.wcPlanner_MsgText-5FGce {\n  font-size: 17px;\n  line-height: 20px;\n  word-break: break-word;\n  -webkit-text-stroke: 0.3px;\n  max-height: 60px;\n  overflow: auto;\n}\n\n.landscape-tKO32 .wcPlanner_MsgText-5FGce,\n.portrait-jLDul .wcPlanner_MsgText-5FGce {\n  overflow: auto;\n}\n\n.wcPlanner_WarningText--s0rh {\n  color: var(--primaryColor);\n}\n.wcPlanner_InfoText-xi8XR {\n  color: black;\n}\n\n.wcPlanner_InfoContainerCollapsed-wxSqk {\n  width: 10px;\n}\n\n.wcPlanner_InfoContainerCollapsed-wxSqk .wcPlanner_InfoText-xi8XR {\n  display: none;\n}\n\n.wcPlanner_MsgContainerParent-ZouV8 {\n  position: absolute;\n  top: auto;\n  top: initial;\n  bottom: 5%;\n  left: 5%;\n  max-width: 70%;\n  left: 70px;\n\n  z-index: 500;\n}\n\n.landscape-tKO32.wcPlanner_MsgContainerParent-ZouV8,\n.portrait-jLDul.wcPlanner_MsgContainerParent-ZouV8 {\n  left: auto;\n  left: initial;\n  right: 5%;\n}\n\n.smv-thumbnails-qw8Ax .smv-selector-GOSiX[data-type='spin']:before {\n  background-color: rgba(128, 128, 128, 0.56);\n  background-image: url(https://scripts.sirv.com/sirvjs/v3/graphics/icons/white/icon.spin.11.svg);\n}\n\n.wcPlanner_MsgContainerParent-ZouV8 .wcClose-S3om7 {\n  position: absolute;\n  color: #747474;\n  cursor: pointer;\n  top: 0px;\n  right: 0px;\n  height: 100%;\n  width: 35px;\n  background-color: rgba(240, 240, 240, 0.7);\n  transition: background-color 200ms linear;\n}\n\n.wcPlanner_InfoContainerCollapsed-wxSqk .wcClose-S3om7 {\n  transform: rotate(180deg);\n}\n\n.wcClose-S3om7:hover {\n  background-color: rgba(230, 230, 230, 0.7);\n}\n\n.wcCloseButton-CHr90 {\n  width: 0;\n  height: 0;\n  border-top: 7px solid transparent;\n  border-bottom: 7px solid transparent;\n  border-right: 7px solid #999999;\n  top: calc(50% - 7px);\n  left: calc(50% - 5px);\n  position: absolute;\n  transition: border-color 200ms linear;\n}\n\n.wcPlanner_MsgText-5FGce.wcPlanner_InfoText-xi8XR {\n  color: #828282;\n  font-size: 15px;\n  line-height: 20px;\n}\n\n.wcClose-S3om7:hover > .wcCloseButton-CHr90 {\n  border-right: 7px solid #222222;\n}\n\n.wcPlanner_MsgContainer-2Gp-B.wcPlanner_InfoContainer-Na2gn {\n  height: 64px;\n}\n\n.wcPlanner_MsgContainer-2Gp-B.wcPlanner_InfoContainer-Na2gn.wcPlanner_InfoContainerCollapsed-wxSqk {\n  padding-right: 1rem;\n}\n\n.landscape-tKO32 .wcPlanner_MsgContainer-2Gp-B {\n  padding: 0.2rem calc(1.2rem + 20px) 0.2rem 1.2rem;\n}\n\n.landscape-tKO32 .wcPlanner_MsgText-5FGce {\n  font-size: 15px;\n}\n\n@keyframes fadein-bDTPb {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n/* Firefox < 16 */\n\n/* Safari, Chrome and Opera > 12.1 */\n\n/* Internet Explorer */\n\n/* Opera < 12.1 */\n@keyframes cssAnimation-UJm2b {\n  0% {\n    opacity: 1;\n  }\n  90% {\n    opacity: 0.8;\n  }\n  100% {\n    opacity: 0;\n  }\n}\n";
-styleInject(css_248z);
-
-var PlannerMsgContainerSimple = function PlannerMsgContainerSimple(props) {
-  return /*#__PURE__*/jsx(PlannerMsgContainer, {
-    wcPlannerMsgContainerParentClass: wcPlannerMsgContainerParent,
-    wcPlannerMsgContainerClass: wcPlannerMsgContainer,
-    wcPlannerWarningContainerClass: wcPlannerWarningContainer,
-    wcPlannerInfoContainerClass: wcPlannerInfoContainer,
-    wcPlannerInfoContainerCollapsedClass: wcPlannerInfoContainerCollapsed,
-    wcPlannerMsgImgClass: wcPlannerMsgImg,
-    wcPlannerMsgTextClass: wcPlannerMsgText,
-    wcPlannerWarningImgClass: wcPlannerWarningImg
-    //wcPlannerInfoImgClass={wcPlannerInfoImg}
-    ,
-    wcPlannerWarningTextClass: wcPlannerWarningText,
-    wcPlannerInfoTextClass: wcPlannerInfoText,
-    wcCloseClass: wcClose,
-    wcCloseButtonClass: wcCloseButton,
-    landscapeClass: landscape,
-    portraitClass: portrait,
-    expandedClass: ""
-  });
-};
-
-export { PlannerMsgContainerSimple as default };

package/build/esm/index-80a98ab2.js

@@ -1,72 +0,0 @@
-import { s as styleInject, u as useViewHandler } from './index-bc8b9202.js';
-import classnames from 'classnames';
-import { observer } from 'mobx-react-lite';
-import { useRef, useEffect } from 'react';
-import { useTranslation } 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/objectWithoutProperties';
-import '@babel/runtime/helpers/asyncToGenerator';
-import '@babel/runtime/helpers/slicedToArray';
-import '@babel/runtime/regenerator';
-import '@babel/runtime/helpers/classCallCheck';
-import '@babel/runtime/helpers/createClass';
-import '@babel/runtime/helpers/toConsumableArray';
-import '@crystaldesign/diva-utils';
-import 'mobx';
-import '@crystaldesign/web-planner-logic';
-
-var wcTabGroupItem = "wcTabGroupItem--h1dg";
-var wcActiveStep = "wcActiveStep-DkkXm";
-var textContainer = "textContainer-5LdUc";
-var text = "text-a5N3T";
-var wcStepNum = "wcStepNum--aolz";
-var portrait = "portrait-0koj3";
-var css_248z = ".wcTabGroupItem--h1dg {\n  height: calc(100% - 1px);\n  min-width: 200px;\n  float: left;\n  display: flex;\n  flex-direction: row;\n  background-color: #fcfcfc;\n  border-top: 1px solid #f0f0f0;\n  cursor: pointer;\n}\n\n.wcTabGroupItem--h1dg.wcActiveStep-DkkXm {\n}\n\n/* \n.wcVisitedStep {\n  background-color: #b1b1b1;\n}\n\n.wcVisitedStep.wcTabGroupItem:hover {\n  background-color: #bbbbbb;\n} */\n\n.textContainer-5LdUc {\n  position: relative;\n  width: calc(100% - 50px);\n}\n.textContainer-5LdUc:hover {\n  box-shadow: 0px 2px 5px rgba(68, 49, 49, 0.445);\n  transition: 0.15s ease;\n}\n\n.wcActiveStep-DkkXm .textContainer-5LdUc:hover {\n  box-shadow: none;\n  box-shadow: initial;\n  cursor: default;\n}\n\n.text-a5N3T {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: calc(100% - 16px);\n  color: black;\n  padding-left: 18px;\n  font-weight: 300;\n  letter-spacing: 0pt;\n  font-size: 17px;\n}\n\n/* .wcVisitedStep {\n} */\n\n.wcStepNum--aolz {\n  height: 12px;\n  width: 12px;\n  padding: 20px;\n  font-size: 25px;\n  line-height: 10px;\n  background-color: #dfdfdf;\n  transition: background-color 0.3s ease-out;\n  font-weight: 300;\n  color: white;\n}\n\n.wcActiveStep-DkkXm .wcStepNum--aolz,\n.wcStepNum--aolz:hover {\n  background-color: var(--primaryColor);\n}\n.wcTabGroupItem--h1dg.portrait-0koj3 {\n  border-bottom: 1px solid #f0f0f0;\n\n  border-top: 0;\n\n  border-top: initial;\n}\n";
-styleInject(css_248z);
-
-var TabGroupItemHorizontalLessSimple = function TabGroupItemHorizontalLessSimple(_ref) {
-  var tabGroup = _ref.tabGroup,
-    width = _ref.width;
-  var viewHandler = useViewHandler();
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var tabGroupItemRef = useRef(null);
-  var curTabGroup = viewHandler.tabGroupState.curTabGroup;
-  useEffect(function () {
-    viewHandler.tabGroupState.setTabGroupItems(tabGroup.key, tabGroupItemRef.current);
-  }, [tabGroupItemRef]);
-  var onTabGroupClick = function onTabGroupClick(tabGroup) {
-    viewHandler.tabGroupState.navigateToTabgroupByPosNr(+tabGroup.posNr);
-  };
-  return /*#__PURE__*/jsxs("div", {
-    style: {
-      width: width
-    },
-    ref: tabGroupItemRef,
-    onClick: function onClick() {
-      return onTabGroupClick(tabGroup);
-    },
-    className: classnames(wcTabGroupItem,
-    //   viewHandler.uiState.isMobileLandscape ? landscape : undefined,
-    viewHandler.uiState.isMobilePortrait ? portrait : undefined, tabGroup.title == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.title) && tabGroup.posNr == (curTabGroup === null || curTabGroup === void 0 ? void 0 : curTabGroup.posNr) ? wcActiveStep : undefined, 'tabGroupItemHorizontalLessSimple'
-    /* viewHandler.tabGroupAlreadyVisited(tabGroup) &&
-      !(tabGroup.title == curTabGroup?.title && tabGroup.posNr == curTabGroup?.posNr)
-      ? wcVisitedStep
-      : undefined,*/),
-    children: [/*#__PURE__*/jsx("span", {
-      className: classnames(wcStepNum),
-      children: tabGroup.posNr
-    }), /*#__PURE__*/jsx("div", {
-      className: classnames(textContainer),
-      children: /*#__PURE__*/jsx("div", {
-        className: classnames(text),
-        children: t('configurator.' + tabGroup.title, tabGroup.title)
-      })
-    })]
-  });
-};
-var index = observer(TabGroupItemHorizontalLessSimple);
-
-export { index as default };