@crystaldesign/diva-web-planner-react 26.3.0-beta.47 → 26.3.0-beta.49

package/build/esm/index-c5bb687c.js

@@ -0,0 +1,48 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { u as useViewHandler } from './index-27c2a5a2.js';
+import { useEffect } from 'react';
+import { observer } from 'mobx-react-lite';
+import ItemVariant from './index-571820cd.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var TabGroupHorizontal = function TabGroupHorizontal(props) {
+  var viewHandler = useViewHandler();
+  useEffect(function () {
+    viewHandler.tabGroupState.scrollToCurTabgroupHorizontal();
+  }, [viewHandler.tabGroupState.curTabGroup]);
+  if (!viewHandler.tabGroupState.allTabGroups) return /*#__PURE__*/jsx(Fragment, {});
+  var tabGroups = Object.entries(viewHandler.tabGroupState.allTabGroups);
+  return /*#__PURE__*/jsx(Fragment, {
+    children: tabGroups.map(function (_ref) {
+      var _viewHandler$tabGroup, _viewHandler$tabGroup2;
+      var _ref2 = _slicedToArray(_ref, 2),
+        key = _ref2[0],
+        tabGroup = _ref2[1];
+      return /*#__PURE__*/jsx(ItemVariant, {
+        tabGroup: tabGroup,
+        width: 'calc(' + ((_viewHandler$tabGroup = (_viewHandler$tabGroup2 = viewHandler.tabGroupState) === null || _viewHandler$tabGroup2 === void 0 || (_viewHandler$tabGroup2 = _viewHandler$tabGroup2.tabGroupScroller) === null || _viewHandler$tabGroup2 === void 0 ? void 0 : _viewHandler$tabGroup2.getBoundingClientRect().width) !== null && _viewHandler$tabGroup !== void 0 ? _viewHandler$tabGroup : 0) + 'px / ' + tabGroups.length + ')'
+      }, key);
+    })
+  });
+};
+var TabGroupHorizontal$1 = observer(TabGroupHorizontal);
+
+export { TabGroupHorizontal$1 as default };

package/build/esm/index-c7975306.js

@@ -0,0 +1,85 @@
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { u as useViewHandler } from './index-27c2a5a2.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import 'react-dynamic-multi-render';
+import '@babel/runtime/helpers/asyncToGenerator';
+import '@babel/runtime/regenerator';
+import '@babel/runtime/helpers/classCallCheck';
+import '@babel/runtime/helpers/createClass';
+import '@babel/runtime/helpers/toConsumableArray';
+import '@crystaldesign/diva-utils';
+import 'mobx';
+import '@crystaldesign/web-planner-logic';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var _excluded = ["className"];
+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 buttonBase = {
+  padding: '4px 15px',
+  borderRadius: 6,
+  border: '1px solid #d9d9d9',
+  cursor: 'pointer',
+  fontSize: 14,
+  lineHeight: '22px',
+  background: '#fff',
+  color: 'rgba(0,0,0,0.88)'
+};
+var primaryButton = _objectSpread(_objectSpread({}, buttonBase), {}, {
+  background: 'var(--primaryColor, #1677ff)',
+  borderColor: 'var(--primaryColor, #1677ff)',
+  color: '#fff'
+});
+var ActionNavigation = function ActionNavigation(_ref) {
+  var className = _ref.className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _viewHandler$actionBu = viewHandler.actionButtonState,
+    isOnFirstStep = _viewHandler$actionBu.isOnFirstStep,
+    isOnFirstStepDisabled = _viewHandler$actionBu.isOnFirstStepDisabled,
+    isOnLastStep = _viewHandler$actionBu.isOnLastStep;
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, props), {}, {
+    className: classnames(className),
+    children: /*#__PURE__*/jsxs("div", {
+      style: {
+        display: 'flex',
+        gap: 8,
+        flexWrap: 'wrap'
+      },
+      children: [!isOnFirstStep && /*#__PURE__*/jsx("button", {
+        style: buttonBase,
+        onClick: function onClick() {
+          window.lastNavigationType = 'NAVIGATION_STANDARD_BACK_BUTTON';
+          viewHandler.actionButtonState.onClickConfiguratorSettingsBack();
+        },
+        children: t('configurator.Back')
+      }), !isOnLastStep && /*#__PURE__*/jsx("button", {
+        id: "wcConfigurator-action-next",
+        style: _objectSpread(_objectSpread({}, primaryButton), {}, {
+          opacity: isOnFirstStepDisabled ? 0.5 : 1
+        }),
+        disabled: isOnFirstStepDisabled,
+        onClick: function onClick() {
+          window.lastNavigationType = 'NAVIGATION_STANDARD_FORWARD_BUTTON';
+          viewHandler.actionButtonState.onClickConfiguratorSettingsForth();
+        },
+        children: t('configurator.Next')
+      })]
+    })
+  }));
+};
+var index = observer(ActionNavigation);
+
+export { index as default };

package/build/esm/index-c7f363c0.js

@@ -0,0 +1,44 @@
+import { s as styleInject } from './index-27c2a5a2.js';
+import 'react';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+import 'mobx-react-lite';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var pdfButton = "pdfButton-4l4zL";
+var css_248z = ".pdfButton-4l4zL {\n  border-radius: 50%;\n  border: solid 2px var(--primaryColor);\n  width: 26px;\n  height: 26px;\n  cursor: pointer;\n  margin-left: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.pdfButton-4l4zL img {\n  width: 80%;\n}\n";
+styleInject(css_248z);
+
+var pdfIcon = "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224px%22%20fill%3D%22%23000000%22%3E%3Cpath%20d%3D%22M0%200h24v24H0V0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M20%202H8c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h12c1.1%200%202-.9%202-2V4c0-1.1-.9-2-2-2zm0%2014H8V4h12v12zM4%206H2v14c0%201.1.9%202%202%202h14v-2H4V6zm12%206V9c0-.55-.45-1-1-1h-2v5h2c.55%200%201-.45%201-1zm-2-3h1v3h-1V9zm4%202h1v-1h-1V9h1V8h-2v5h1zm-8%200h1c.55%200%201-.45%201-1V9c0-.55-.45-1-1-1H9v5h1v-2zm0-2h1v1h-1V9z%22%2F%3E%3C%2Fsvg%3E";
+
+var PDFButton = function PDFButton(_ref) {
+  var pdfUrl = _ref.pdfUrl;
+  return /*#__PURE__*/jsx("div", {
+    className: pdfButton,
+    onClick: function onClick() {
+      return window.open(pdfUrl, '_blank');
+    },
+    children: /*#__PURE__*/jsx("img", {
+      src: pdfIcon
+    })
+  });
+};
+
+export { PDFButton as default };

package/build/esm/index-c86bc512.js

@@ -0,0 +1,33 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-27c2a5a2.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@crystaldesign/diva-core';
+import 'mobx-react-lite';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+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 ProductHeader = function ProductHeader(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Product/ProductHeader/ProductHeader"
+  }));
+};
+
+export { ProductHeader as default };

package/build/esm/index-c9684562.js

@@ -0,0 +1,159 @@
+import { s as styleInject, u as useViewHandler } from './index-27c2a5a2.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import Group from './index-f31dd494.js';
+import { useDivaCore } from '@crystaldesign/diva-core';
+import StandradGroup from './index-aa9613df.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+import './index-176007f0.js';
+import 'sift';
+import './index-4b9fb535.js';
+import './index-f5107af7.js';
+import './index-bf90baf2.js';
+import './index-035a3061.js';
+import './index.module-1ae711b9.js';
+import './index-508fe61c.js';
+import './index-1db7c1e3.js';
+import '@mui/icons-material/Block';
+import '@mui/icons-material/Warning';
+import './index-5a905c88.js';
+import 'react-dropdown';
+import './index-076a86a1.js';
+import '@babel/runtime/helpers/objectDestructuringEmpty';
+import './index-3defced5.js';
+import './index-672aa0da.js';
+import './index-47a478ef.js';
+import '@crystaldesign/content-box';
+import './index-e1b1dd89.js';
+import './index-a9577f62.js';
+import './index-0c0d21f0.js';
+import './index-1f429140.js';
+import 'swiper/react';
+import 'swiper/modules';
+import './UnlockCard-37d6fe9a.js';
+import './index-842034e2.js';
+import './index-910d4fa0.js';
+import './index-b3cbe15f.js';
+import './index-48aed6fd.js';
+import './index-15635ce5.js';
+import './index-a431bc68.js';
+import 'react-laag';
+import './index.module-8c244ec6.js';
+import './index-ee5378f1.js';
+import './index-32ace380.js';
+import './index-dcfd446d.js';
+import './index-cd817345.js';
+import './index-650da417.js';
+import './index.module-9a196a62.js';
+import './index-b2bbea86.js';
+import './index-a60d07ef.js';
+import './index-ee9ef21b.js';
+import './index-6ea9bca7.js';
+import './index-179911c8.js';
+import './index-e41859f0.js';
+import './index-03f77196.js';
+import './index-17f657d3.js';
+import './index-a72790d8.js';
+import './index-25aaf69d.js';
+import './index-e522a094.js';
+import './index-4ae2abe7.js';
+import './index-e525b7e2.js';
+import 'rc-slider';
+import './index-fef66ebe.js';
+import './index-531b7c6b.js';
+import './index-6e5202b1.js';
+import './index-fb1fd5ea.js';
+import './index-ddb3b7d0.js';
+import 'react-confetti-explosion';
+import './index-fd282f47.js';
+import './index-ef3266f6.js';
+import './index-b2338016.js';
+import 'react-qr-code';
+import './index-bc3840b9.js';
+import './useCustomDimensions-707b4f3a.js';
+import './index-14d2b44d.js';
+import './ussIsSticky-1af0d71d.js';
+import './index-9af20dae.js';
+import './index-841097a4.js';
+import './index-be63324b.js';
+import './index.module-675e62c5.js';
+import './index-d3c10709.js';
+import './index-13f8df1f.js';
+import './index-6701c63b.js';
+import './index-b8a1d1ed.js';
+import './index-07340ea6.js';
+import 'react-collapsible';
+
+var container = "container-UypgK";
+var css_248z = ".container-UypgK {\n  display: flex;\n  flex-wrap: wrap;\n  position: relative;\n  width: 100%;\n}\n";
+styleInject(css_248z);
+
+var PaletteGroup = function PaletteGroup(_ref) {
+  var itemPalette = _ref.itemPalette,
+    groups = _ref.groups,
+    PaletteComponent = _ref.PaletteComponent,
+    contentInnerClassName = _ref.contentInnerClassName,
+    _ref$rowCount = _ref.rowCount,
+    rowCount = _ref$rowCount === void 0 ? 12 : _ref$rowCount;
+  var viewHandler = useViewHandler();
+  if (!viewHandler.uiState.isInMobileView) return /*#__PURE__*/jsx(StandradGroup, {
+    contentInnerClassName: contentInnerClassName,
+    itemPalette: itemPalette,
+    groups: groups,
+    PaletteComponent: PaletteComponent,
+    rowCount: rowCount
+  });
+  var _useDivaCore = useDivaCore(),
+    width = _useDivaCore.state.dimensions.width;
+  var itemCount = 0;
+  if (width) while (width / rowCount < 60) {
+    rowCount = rowCount - 1;
+  }
+  return /*#__PURE__*/jsx("div", {
+    className: container,
+    children: groups.map(function (group) {
+      var renderEmptyBox = false;
+      if (itemCount % rowCount === rowCount - 1 && group.items.length > 1) {
+        renderEmptyBox = true;
+        itemCount++;
+      }
+      itemCount = itemCount + group.items.length;
+      return /*#__PURE__*/jsxs(Fragment, {
+        children: [renderEmptyBox && /*#__PURE__*/jsx("div", {
+          style: {
+            background: 'rgba(242, 242, 242, 0.6)',
+            width: 100 / rowCount + '%'
+          }
+        }), /*#__PURE__*/jsx(Group, {
+          PaletteComponent: PaletteComponent,
+          contentInnerClassName: contentInnerClassName,
+          paletteType: itemPalette.type,
+          group: group,
+          paletteId: itemPalette.id,
+          rowCount: rowCount
+        })]
+      });
+    })
+  });
+};
+var index = observer(PaletteGroup);
+
+export { index as default };

package/build/esm/index-cb9d9234.js

@@ -0,0 +1,67 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject } from './index-27c2a5a2.js';
+import { useTranslation } from '@crystaldesign/diva-core';
+import { useState, useRef, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import 'mobx-react-lite';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var wrapper = "wrapper-MPQ1D";
+var searchText = "search-text-h7Q58";
+var icon = "icon-yltss";
+var css_248z = ".wrapper-MPQ1D {\n  display: flex;\n  height: 100%;\n  align-items: center;\n}\n\n.search-text-h7Q58 {\n  width: 130px;\n  height: 30px;\n  line-height: 28px;\n  border-radius: 5px;\n  -webkit-tap-highlight-color: transparent;\n  outline: 0;\n  background-color: #fff;\n  padding: 0 1.6rem;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  position: relative;\n  border: 0;\n}\n\n.icon-yltss {\n  width: 36px;\n  height: 36px;\n  background: center / contain no-repeat url(\"data:image/svg+xml,%3Csvg width%3D%2259%22 height%3D%2259%22 viewBox%3D%220 0 59 59%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M39.9163 41.38C40.3208 41.7844 40.9765 41.7844 41.3809 41.38C41.7854 40.9755 41.7854 40.3198 41.3809 39.9153L39.9163 41.38ZM36.851 27.5286C36.851 32.6767 32.6776 36.85 27.5296 36.85V38.9215C33.8216 38.9215 38.9224 33.8206 38.9224 27.5286H36.851ZM27.5296 36.85C22.3815 36.85 18.2081 32.6767 18.2081 27.5286H16.1367C16.1367 33.8206 21.2375 38.9215 27.5296 38.9215V36.85ZM18.2081 27.5286C18.2081 22.3805 22.3815 18.2072 27.5296 18.2072V16.1357C21.2375 16.1357 16.1367 21.2365 16.1367 27.5286H18.2081ZM27.5296 18.2072C32.6776 18.2072 36.851 22.3805 36.851 27.5286H38.9224C38.9224 21.2365 33.8216 16.1357 27.5296 16.1357V18.2072ZM41.3809 39.9153L35.5982 34.1325L34.1334 35.5972L39.9163 41.38L41.3809 39.9153Z%22 fill%3D%22%234F4F4F%22%2F%3E%3C%2Fsvg%3E\");\n  margin-left: 12px;\n  margin-right: 12px;\n}\n";
+styleInject(css_248z);
+
+var Search = function Search(_ref) {
+  var _ref$searchState = _slicedToArray(_ref.searchState, 2),
+    search = _ref$searchState[0],
+    setSearch = _ref$searchState[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var inputRef = useRef(null);
+  useEffect(function () {
+    if (value && value.length > 2) setSearch(value);else if ((search === null || search === void 0 ? void 0 : search.length) !== 0) {
+      setSearch(undefined);
+    }
+  }, [value]);
+  useEffect(function () {
+    if (!(search !== null && search !== void 0 && search.length)) setValue('');
+  }, [search]);
+  return /*#__PURE__*/jsxs("div", {
+    className: wrapper,
+    children: [/*#__PURE__*/jsx("input", {
+      ref: inputRef,
+      onChange: function onChange(e) {
+        return setValue(e.target.value);
+      },
+      type: 'text',
+      value: value,
+      className: searchText,
+      placeholder: t('filter.global')
+    }), /*#__PURE__*/jsx("div", {
+      className: icon
+    })]
+  });
+};
+
+export { Search as default };

package/build/esm/index-ccc2c706.js

@@ -0,0 +1,93 @@
+import { s as styleInject, u as useViewHandler } from './index-27c2a5a2.js';
+import { observer } from 'mobx-react-lite';
+import 'react';
+import RoomRound from './index-7461d162.js';
+import classnames from 'classnames';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@babel/runtime/helpers/defineProperty';
+import 'react-dynamic-multi-render';
+import '@crystaldesign/diva-core';
+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 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+var roomItem = "roomItem-Uuc6r";
+var roomItemSel = "roomItem-sel-ePWgY";
+var mobile = "mobile-gsjDz";
+var selectionWrapper = "selectionWrapper-osHpS";
+var roomItemContainer = "roomItem-container-3jH8Z";
+var viewItemContainer = "viewItem-container-OlPAR";
+var tablet = "tablet--t8lH";
+var css_248z = ".roomItem-Uuc6r {\n  width: 70px;\n  height: 70px;\n  background-color: #fff;\n  opacity: 0.8;\n  background-repeat: no-repeat;\n  background-position: center;\n  border-radius: 50%;\n  background-size: 62%;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2242%22 height%3D%2235%22 viewBox%3D%220 0 42 35%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M11.6329 26.5973L1 33.4896V1.48962L11.6329 4.93578M11.6329 26.5973V4.93578M11.6329 26.5973H21.2532M11.6329 4.93578H41V26.5973H30.3671M21.2532 26.5973V11.8281H30.3671V26.5973M21.2532 26.5973H30.3671%22 stroke%3D%22%234A4543%22 stroke-width%3D%223%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  transition: background-color 0.2s ease-in-out;\n  opacity: 0.8;\n  border: 1px solid #ddd;\n  position: absolute;\n  left: 29px;\n}\n.roomItem-sel-ePWgY {\n  background-color: rgba(217,217,217,0.66667);\n}\n.mobile-gsjDz.roomItem-Uuc6r {\n  width: 32px;\n  height: 32px;\n  display: block;\n  position: relative;\n  left: auto;\n  left: initial;\n  bottom: auto;\n  bottom: initial;\n}\n\n.selectionWrapper-osHpS {\n  position: relative;\n  overflow: visible;\n  width: 100%;\n  height: 100%;\n}\n\n.roomItem-container-3jH8Z {\n  position: absolute;\n  bottom: 74px;\n  left: 0px;\n  z-index: 700;\n  min-width: 300px;\n  overflow-y: auto;\n  overflow-x: visible;\n  /*hide scrollbar*/\n  -ms-overflow-style: none;\n  scrollbar-width: none; /* Firefox */\n}\n.roomItem-container-3jH8Z::-webkit-scrollbar {\n  display: none;\n}\n\n.viewItem-container-OlPAR {\n  position: absolute;\n  display: flex;\n  bottom: -2px;\n  left: 86px;\n  z-index: 700;\n  flex-direction: row;\n  overflow-y: visible;\n  overflow-x: auto;\n}\n\n.mobile-gsjDz.roomItem-container-3jH8Z {\n  bottom: 38px;\n  left: -6px;\n}\n\n.tablet--t8lH.roomItem-container-3jH8Z {\n  bottom: 52px;\n  left: -2px;\n}\n\n.mobile-gsjDz.viewItem-container-OlPAR {\n  display: none;\n}\n";
+styleInject(css_248z);
+
+var RoomListSelection = function RoomListSelection(_ref) {
+  var _viewHandler$productS;
+  var style = _ref.style;
+  var viewHandler = useViewHandler();
+  var rooms = viewHandler.paletteViewHandler.getRoomList();
+  var views = viewHandler.paletteViewHandler.getRoomViewList();
+  if (!viewHandler.uiState.ViewConfig.roomListInProduct || !viewHandler.settingsState.roomListInitialized || !viewHandler.productState.doShowRenderImage && !viewHandler.productState.doShow3DComb || viewHandler.settingsState.infoBoxContent || viewHandler.uiState.isMobileLandscape) return /*#__PURE__*/jsx(Fragment, {});
+  var divSize = (_viewHandler$productS = viewHandler.productState.planner3DImageSvgArea) === null || _viewHandler$productS === void 0 ? void 0 : _viewHandler$productS.getBoundingClientRect();
+  var stopPropagation = function stopPropagation(e) {
+    e.stopPropagation();
+  };
+  return /*#__PURE__*/jsx(Fragment, {
+    children: /*#__PURE__*/jsx("div", {
+      id: "room-list-selection",
+      "data-test-id": "room-list-selection",
+      className: classnames(roomItem, viewHandler.productState.roomListExpanded ? roomItemSel : undefined, viewHandler.uiState.isInMobileView ? mobile : undefined, viewHandler.uiState.isTablet ? tablet : undefined),
+      onClick: function onClick() {
+        viewHandler.productState.setRoomListExpanded(!viewHandler.productState.roomListExpanded);
+      },
+      onMouseDown: stopPropagation,
+      onTouchStart: stopPropagation,
+      style: style,
+      children: viewHandler.productState.roomListExpanded && /*#__PURE__*/jsxs("div", {
+        className: selectionWrapper,
+        children: [/*#__PURE__*/jsx("div", {
+          "data-test-id": "room-selection-expanded",
+          id: "views-selection-expanded",
+          style: {
+            maxHeight: 'calc(' + (divSize === null || divSize === void 0 ? void 0 : divSize.height) + 'px - 80px)'
+          },
+          className: classnames(roomItemContainer, viewHandler.uiState.isInMobileView ? mobile : undefined, viewHandler.uiState.isTablet ? tablet : undefined),
+          children: rooms.map(function (item) {
+            return /*#__PURE__*/jsx(RoomRound, {
+              item: item,
+              from: viewHandler.settingsState.roomListInitialized
+            }, item.codex);
+          })
+        }), /*#__PURE__*/jsx("div", {
+          id: "rooms-selection-expanded",
+          style: {
+            maxWidth: 'calc(' + (divSize === null || divSize === void 0 ? void 0 : divSize.width) + 'px - 100px)'
+          },
+          className: classnames(viewItemContainer, viewHandler.uiState.isInMobileView ? mobile : undefined),
+          children: views.map(function (item) {
+            return /*#__PURE__*/jsx(RoomRound, {
+              item: item,
+              from: viewHandler.settingsState.roomListInitialized,
+              isVP: true
+            }, item.codex);
+          })
+        })]
+      })
+    })
+  });
+};
+var index = observer(RoomListSelection);
+
+export { index as default };

package/build/esm/index-cd817345.js

@@ -0,0 +1,33 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import './index-27c2a5a2.js';
+import 'react';
+import DynamicMultiRender from 'react-dynamic-multi-render';
+import { jsx } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/slicedToArray';
+import '@crystaldesign/diva-core';
+import 'mobx-react-lite';
+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 'classnames';
+import 'qrcode.react';
+import '@babel/runtime/helpers/typeof';
+import 'flat';
+import 'react-switch';
+import 'react-countup';
+
+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 SettingsItemRoomTemplate = function SettingsItemRoomTemplate(props) {
+  return /*#__PURE__*/jsx(DynamicMultiRender, _objectSpread(_objectSpread({}, props), {}, {
+    componentName: "Settings/SettingsScroller/SettingsItem/ItemPalette/Options/Default/Room/RoomItem"
+  }));
+};
+
+export { SettingsItemRoomTemplate as default };