npm - @crystaldesign/diva-web-planner-react - Versions diffs - 24.13.0-rc.7 → 24.13.0-rc.8 - Mend

@crystaldesign/diva-web-planner-react 24.13.0-rc.7 → 24.13.0-rc.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1182) hide show

package/build/esm/index-a9ee8c18.js ADDED Viewed

@@ -0,0 +1,172 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-62e351ed.js';
+import { observer } from 'mobx-react-lite';
+import { useState, useRef, useEffect } from 'react';
+import { useLayer } from 'react-laag';
+import Tooltip from './index-13dce417.js';
+import { useTranslation, useDivaCore } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import FullscreenAr from './index-c78dbc87.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+var wcNav3DToolbar = "wc_Nav3DToolbar-NM2CK";
+var landscape = "landscape-0Dn10";
+var portrait = "portrait-Znfkx";
+var settingsHidden = "settings-hidden-X-8HL";
+var wcZoomIn = "wcZoomIn-7oss5";
+var wcZoomOut = "wcZoomOut-4EF8K";
+var wcViews = "wcViews-k2gyz";
+var wc3DDimLine = "wc3DDimLine-ERDw2";
+var wcFullScreen = "wcFullScreen-FuayU";
+var wc3DGridPlannerMode = "wc3DGridPlannerMode-2fAed";
+var arIcon = "ar-icon-1mpuy";
+var arAbsolute = "ar-absolute-IJps2";
+var css_248z = ".wc_Nav3DToolbar-NM2CK {\n  display: inline;\n  z-index: 601;\n  margin: 0;\n  position: absolute;\n  bottom: 60px;\n  left: -1.6rem;\n}\n\n@media all and (max-height: 650px) and (min-width: 900px) {\n  .wc_Nav3DToolbar-NM2CK {\n    width: 120px;\n    top: calc(50% - 200px);\n  }\n  .wc_Nav3DToolbar-NM2CK ul li {\n    float: left;\n    margin: 0 0 9.6px 9.6px;\n  }\n}\n\n.wc_Nav3DToolbar-NM2CK li {\n  width: 40px;\n  height: 40px;\n  margin: 0 auto 8px auto;\n  display: block;\n  background-color: rgba(223, 223, 223, 0.8);\n  background-repeat: no-repeat;\n  background-position: center center;\n  border-radius: 50%;\n  transition: background-color 0.15s ease;\n  cursor: pointer;\n}\n\n.wc_Nav3DToolbar-NM2CK li:hover {\n  background-color: rgba(210, 210, 210, 0.8);\n}\n.wc_Nav3DToolbar-NM2CK li:active {\n  background-color: rgba(197, 197, 197, 0.8);\n}\n\n/************landscape***************/\n.landscape-0Dn10.wc_Nav3DToolbar-NM2CK {\n  right: 10px;\n  left: auto;\n  left: initial;\n  bottom: 5px;\n}\n\n.landscape-0Dn10.wc_Nav3DToolbar-NM2CK {\n  bottom: 0px;\n  width: 70px;\n  left: 10px;\n  transform: rotate(90deg);\n  padding: 0;\n  padding: initial;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n\n.landscape-0Dn10.wc_Nav3DToolbar-NM2CK li {\n  display: none;\n}\n.portrait-Znfkx.settings-hidden-X-8HL.wc_Nav3DToolbar-NM2CK li {\n  display: block;\n}\n\n.landscape-0Dn10 .wcFunctionsToolbar-VsuSV {\n  margin-top: 8px;\n}\n\n.landscape-0Dn10.settings-hidden-X-8HL.wc_Nav3DToolbar-NM2CK {\n  bottom: 80px;\n  width: 70px;\n  left: 16px;\n  padding: 0;\n  padding: initial;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n\n/************portrait***************/\n.portrait-Znfkx.wc_Nav3DToolbar-NM2CK {\n  right: 10px;\n  left: auto;\n  left: initial;\n  bottom: 5px;\n}\n\n.portrait-Znfkx.wc_Nav3DToolbar-NM2CK li {\n  display: none;\n}\n\n.portrait-Znfkx.settings-hidden-X-8HL.wc_Nav3DToolbar-NM2CK li {\n  display: block;\n}\n\n.portrait-Znfkx.settings-hidden-X-8HL.wc_Nav3DToolbar-NM2CK {\n  bottom: 80px;\n  width: 70px;\n  left: 10px;\n  transform: none;\n  transform: initial;\n  padding: 0;\n  padding: initial;\n}\n/*------------------------Nav Icons--------------------------------------*/\n\n/* standard */\n\n.wcZoomIn-7oss5 {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M25.7363 24.7891L29.9993 28.1047%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M15.7896 19.6841H23.58%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M19.686 15.7891L19.686 23.5795%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2219.5786%22 cy%3D%2219.5786%22 r%3D%227.57858%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcZoomIn-7oss5:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M25.7363 24.7891L29.9993 28.1047%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M15.7896 19.6841H23.58%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M19.686 15.7891L19.686 23.5795%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Ccircle cx%3D%2219.5786%22 cy%3D%2219.5786%22 r%3D%227.57858%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcZoomOut-4EF8K {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M24.7362 24.7889L28.9991 28.1045M15.0002 19.9999H22.7907M26.1572 19.5786C26.1572 23.7641 22.7641 27.1572 18.5786 27.1572C14.393 27.1572 11 23.7641 11 19.5786C11 15.393 14.393 12 18.5786 12C22.7641 12 26.1572 15.393 26.1572 19.5786Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcZoomOut-4EF8K:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M24.7362 24.7889L28.9991 28.1045M15.0002 19.9999H22.7907M26.1572 19.5786C26.1572 23.7641 22.7641 27.1572 18.5786 27.1572C14.393 27.1572 11 23.7641 11 19.5786C11 15.393 14.393 12 18.5786 12C22.7641 12 26.1572 15.393 26.1572 19.5786Z%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcViews-k2gyz {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23F5F5F5%22%2F%3E%3Cpath d%3D%22M11 14.3811L20 19.0909M11 14.3811L20 10L29 14.3811M11 14.3811V25.0649L20 30M20 19.0909L29 14.3811M20 19.0909V30M29 14.3811V25.0649L20 30%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcViews-k2gyz:hover {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2240%22 height%3D%2240%22 viewBox%3D%220 0 40 40%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle cx%3D%2220%22 cy%3D%2220%22 r%3D%2220%22 fill%3D%22%23C4C4C4%22%2F%3E%3Cpath d%3D%22M11 14.3811L20 19.0909M11 14.3811L20 10L29 14.3811M11 14.3811V25.0649L20 30M20 19.0909L29 14.3811M20 19.0909V30M29 14.3811V25.0649L20 30%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wc3DDimLine-ERDw2 {\n  background-color: #f5f5f5 !important;\n}\n.wc3DDimLine-ERDw2 {\n  background-size: 80%;\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%22Ebene_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 15 12%22 style%3D%22enable-background%3Anew 0 0 15 12%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3Anone%3B %7D%3C%2Fstyle%3E%3Cpath class%3D%22st0%22 d%3D%22M14.8%2C1.3c0-0.6-0.5-1.2-1.2-1.2H1.4c-0.6%2C0-1.2%2C0.5-1.2%2C1.2v9.4c0%2C0.6%2C0.5%2C1.2%2C1.2%2C1.2h12.2%09c0.6%2C0%2C1.2-0.5%2C1.2-1.2C14.8%2C10.7%2C14.8%2C1.3%2C14.8%2C1.3z%22%2F%3E%3Cg%3E%09%3Cpath stroke%3D%22%234B4B4B%22 stroke-width%3D%220.2%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 d%3D%22M12.9%2C2.9c-0.1%2C0-0.2%2C0.1-0.2%2C0.2v5.8c0%2C0.1%2C0.1%2C0.2%2C0.2%2C0.2S13%2C9%2C13%2C8.9V3.1C13%2C3%2C12.9%2C2.9%2C12.9%2C2.9z%22%2F%3E%09%3Cpath stroke%3D%22%234B4B4B%22 stroke-width%3D%220.2%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 d%3D%22M2.1%2C2.9C2.1%2C2.9%2C2%2C3%2C2%2C3.1v5.8C2%2C9%2C2.1%2C9.1%2C2.1%2C9.1c0.1%2C0%2C0.2-0.1%2C0.2-0.2V3.1C2.3%2C3%2C2.2%2C2.9%2C2.1%2C2.9z%22%2F%3E%09%3Cpath stroke%3D%22%234B4B4B%22 stroke-width%3D%220.2%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22 d%3D%22M10.3%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0C10.1%2C5%2C10%2C5%2C10%2C5.1v0.8H5V5.1C5%2C5%2C4.9%2C5%2C4.9%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0l-1.5%2C1%09%09c0%2C0-0.1%2C0.1-0.1%2C0.1c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1l1.5%2C1c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0C4.9%2C7.1%2C5%2C7.1%2C5%2C7V6.2H10V7c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1%09%09c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0l1.5-1c0%2C0%2C0.1-0.1%2C0.1-0.1c0-0.1%2C0-0.1-0.1-0.1L10.3%2C4.9z M4.6%2C6.7L3.6%2C6l1-0.6V6.7z M10.4%2C6.7%09%09V5.4l1%2C0.6L10.4%2C6.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n}\n@media (hover: hover) {\n  .wc3DDimLine-ERDw2:hover {\n    background-color: #c4c4c4 !important;\n  }\n}\n\n.wc3DDimLine-ERDw2:active {\n  background-color: #c4c4c4 !important;\n}\n.portrait-Znfkx.wc_Nav3DToolbar-NM2CK li.wc3DDimLine-ERDw2 {\n  display: block;\n}\n\n.wc_Nav3DToolbar-NM2CK .wcFullScreen-FuayU {\n  background-size: 55%;\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M12 1H2C1.44772 1 1 1.44772 1 2V22C1 22.5523 1.44772 23 2 23H21.9999C22.5522 23 22.9999 22.5523 22.9999 22V12M16.0078 1H21.9989C22.5512 1 22.9989 1.44772 22.9989 2V7.99114M22.5002 1.5L13.3195 10.68%22 stroke%3D%22%234B4B4B%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-color: #f5f5f5;\n}\n.wcFullScreen-FuayU:hover {\n  background-color: #c4c4c4;\n}\n\n.diva-pseudo-fullscreen .wc_Nav3DToolbar-NM2CK .wcFullScreen-FuayU {\n  display: none;\n}\n.wc_Nav3DToolbar-NM2CK li.wc3DGridPlannerMode-2fAed {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2231%22 height%3D%2231%22 viewBox%3D%220 0 31 31%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M5.24023 19.5242L2.10094 15.7308L5.24023 12.1436%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M2.18441 15.7428L11.2067 15.7428%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M25.759 11.759L28.8983 15.5525L25.759 19.1397%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M28.8989 15.5395L19.7925 15.5395%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M19.3847 25.9001L15.5912 29.0393L12.004 25.9001%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M15.5917 29.0395L15.6033 19.9331%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M11.6175 5.38248L15.411 2.24319L18.9982 5.38248%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M15.4106 2.24438L15.3991 11.3508%22 stroke%3D%22white%22 stroke-opacity%3D%220.87%22 stroke-width%3D%221.5%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n  background-color: var(--primaryColor);\n  width: 55px;\n  height: 55px;\n  cursor: pointer;\n  padding: 0;\n  cursor: pointer;\n}\n\ndiv li.ar-icon-1mpuy {\n  width: 55px;\n  height: 55px;\n  cursor: pointer;\n  padding: 0;\n  border-radius: 50%;\n  background-size: 70%;\n  background-image: url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3Csvg viewBox%3D%220 0 30 30%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E  %3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M 17.88 1.861 L 14.94 0.471 C 14.79 0.401 14.62 0.401 14.47 0.471 L 11.52 1.861 C 11.1 2.061 10.91 2.571 11.11 2.991 C 11.25 3.301 11.56 3.481 11.88 3.481 C 12 3.481 12.12 3.451 12.24 3.401 L 13.85 2.641 L 13.85 4.711 C 13.85 5.181 14.23 5.561 14.7 5.561 C 15.17 5.561 15.55 5.181 15.55 4.711 L 15.55 2.641 L 17.16 3.401 C 17.58 3.601 18.09 3.421 18.29 2.991 C 18.49 2.561 18.31 2.061 17.88 1.861 Z M 17.161 7.591 L 14.701 8.751 L 12.241 7.591 C 11.821 7.391 11.311 7.571 11.111 8.001 C 10.911 8.421 11.091 8.931 11.521 9.131 L 13.821 10.211 C 13.821 10.231 13.816 10.248 13.811 10.266 C 13.806 10.283 13.801 10.301 13.801 10.321 L 13.801 12.401 C 13.801 12.871 14.181 13.251 14.651 13.251 C 15.121 13.251 15.501 12.871 15.501 12.401 L 15.501 10.321 C 15.501 10.311 15.498 10.301 15.496 10.291 C 15.493 10.281 15.491 10.271 15.491 10.261 L 17.891 9.131 C 18.311 8.931 18.501 8.421 18.301 8.001 C 18.091 7.581 17.581 7.391 17.161 7.591 Z M 21.051 3.421 L 23.681 4.681 C 23.881 4.771 24.001 4.971 24.001 5.181 L 24.001 8.211 C 24.001 8.681 23.621 9.061 23.151 9.061 C 22.681 9.061 22.301 8.681 22.301 8.211 L 22.301 7.091 L 20.911 7.741 C 20.791 7.791 20.671 7.821 20.551 7.821 C 20.231 7.821 19.921 7.641 19.781 7.331 C 19.581 6.911 19.771 6.401 20.191 6.201 L 21.571 5.551 L 20.321 4.951 C 19.901 4.751 19.721 4.241 19.921 3.821 C 20.121 3.401 20.631 3.221 21.051 3.421 Z M 9.21 6.201 L 7.83 5.551 L 9.08 4.951 C 9.5 4.751 9.68 4.241 9.48 3.821 C 9.28 3.391 8.77 3.211 8.35 3.421 L 5.72 4.681 C 5.52 4.771 5.4 4.971 5.4 5.181 L 5.4 8.201 C 5.4 8.671 5.78 9.051 6.25 9.051 C 6.72 9.051 7.1 8.681 7.1 8.211 L 7.1 7.081 L 8.49 7.731 C 8.61 7.791 8.73 7.821 8.85 7.821 C 9.17 7.821 9.48 7.641 9.62 7.331 C 9.821 6.911 9.64 6.401 9.21 6.201 Z M 22.301 13.081 C 22.301 12.611 22.681 12.231 23.151 12.231 C 23.621 12.231 24.001 12.611 24.011 13.081 L 24.011 16.101 C 24.011 16.321 23.881 16.521 23.691 16.611 L 21.061 17.871 C 20.941 17.921 20.811 17.951 20.691 17.951 C 20.371 17.951 20.071 17.771 19.921 17.471 C 19.721 17.051 19.901 16.541 20.321 16.341 L 21.571 15.741 L 20.191 15.091 C 19.761 14.891 19.581 14.391 19.781 13.961 C 19.981 13.531 20.491 13.351 20.911 13.551 L 22.301 14.201 L 22.301 13.081 Z M 9.62 13.951 C 9.42 13.531 8.91 13.341 8.49 13.541 L 7.1 14.201 L 7.1 13.081 C 7.1 12.611 6.72 12.231 6.25 12.231 C 5.78 12.231 5.4 12.611 5.4 13.081 L 5.4 16.111 C 5.4 16.321 5.52 16.521 5.71 16.611 L 8.34 17.871 C 8.46 17.931 8.58 17.951 8.71 17.951 C 9.03 17.951 9.33 17.771 9.48 17.471 C 9.68 17.051 9.5 16.541 9.08 16.341 L 7.83 15.741 L 9.21 15.091 C 9.64 14.891 9.821 14.381 9.62 13.951 Z M 15.551 18.511 L 17.161 17.751 C 17.581 17.551 18.091 17.731 18.291 18.161 C 18.491 18.581 18.301 19.091 17.881 19.291 L 14.941 20.671 C 14.791 20.741 14.611 20.741 14.461 20.671 L 11.521 19.291 C 11.091 19.091 10.911 18.581 11.111 18.161 C 11.311 17.731 11.821 17.551 12.241 17.751 L 13.851 18.511 L 13.851 16.441 C 13.851 15.971 14.231 15.591 14.701 15.591 C 15.171 15.591 15.551 15.971 15.551 16.441 L 15.551 18.511 Z%22 fill%3D%22white%22%2F%3E  %3Ctext style%3D%22fill%3A rgb(255%2C 255%2C 255)%3B font-family%3A Arial%2C sans-serif%3B font-size%3A 10px%3B font-weight%3A 700%3B letter-spacing%3A 1.9px%3B word-spacing%3A -6.7px%3B white-space%3A pre%3B%22 x%3D%227.235%22 y%3D%2228.446%22%3EAR%3C%2Ftext%3E%3C%2Fsvg%3E\");\n  background-color: var(--primaryColor);\n  background-repeat: no-repeat;\n  background-position: center center;\n  display: block;\n  transition: background-color 0.15s ease;\n}\n\ndiv .portrait-Znfkx li.ar-icon-1mpuy,\nli.ar-absolute-IJps2.ar-icon-1mpuy,\n.wc_Nav3DToolbar-NM2CK.portrait-Znfkx li.wc3DGridPlannerMode-2fAed {\n  width: 48px;\n  height: 48px;\n}\n\n.portrait-Znfkx.wc_Nav3DToolbar-NM2CK li.ar-icon-1mpuy {\n  display: block;\n}\n.ar-absolute-IJps2 {\n  position: absolute;\n  left: 12px;\n  bottom: 64px;\n  z-index: 1000;\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 ArQrCodeTooltip = function ArQrCodeTooltip(props) {
+  var _viewHandler$getViewC;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useDivaCore = useDivaCore(),
+    openModal = _useDivaCore.actions.openModal,
+    _useDivaCore$state = _useDivaCore.state,
+    isMobile = _useDivaCore$state.isMobile,
+    isTablet = _useDivaCore$state.dimensions.isTablet;
+  //tooltip is going to close itself by timer
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    autoClose = _useState2[0],
+    setAutoClose = _useState2[1];
+  var autoCloseTimeout = useRef();
+  var arQrCodeConfig = (_viewHandler$getViewC = viewHandler.getViewConfig()) === null || _viewHandler$getViewC === void 0 ? void 0 : _viewHandler$getViewC.enableAR;
+  var openAr = isMobile || isTablet;
+  //for fade animation
+  var _useState3 = useState(viewHandler.productState.arCodeWasVisibleOnce),
+    _useState4 = _slicedToArray(_useState3, 2),
+    tooltipVisible = _useState4[0],
+    setTooltipVisible = _useState4[1];
+  var showTooltip = (tooltipVisible || viewHandler.productState.doShowARQRCode) && !openAr && viewHandler.isParentViewVisible;
+  var _useLayer = useLayer({
+      isOpen: showTooltip,
+      auto: true,
+      placement: 'right-end',
+      triggerOffset: 16
+    }),
+    triggerProps = _useLayer.triggerProps,
+    layerProps = _useLayer.layerProps,
+    renderLayer = _useLayer.renderLayer,
+    arrowProps = _useLayer.arrowProps;
+  var _useState5 = useState(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    url = _useState6[0],
+    setUrl = _useState6[1];
+  useEffect(function () {
+    if (viewHandler.productState.doShowARQRCode == true) {
+      viewHandler.openARObserverConnection(function () {
+        return viewHandler.divaWebPlanner.getPlannerHandler().saveSetHQRenderScript();
+      } // request hqr onreceivehqr triggers update
+      ).then(function (url) {
+        return setUrl(url);
+      });
+    }
+  }, [viewHandler.productState.doShowARQRCode]);
+  useEffect(function () {
+    if (viewHandler.productState.doShowARQRCode && openAr) openModal({
+      content: /*#__PURE__*/jsx(FullscreenAr, {
+        url: url,
+        isArCompatible: viewHandler.productState.isArCompatible,
+        broswerSupportAR: viewHandler.productState.browserSupportAR,
+        activateAR: viewHandler.productState.activateAR
+      }),
+      fullscreen: true,
+      rejectByIcon: true,
+      dontRenderForm: true,
+      callback: function callback(value) {
+        if (!value) {
+          viewHandler.productState.setDoShowARQRCode(false);
+          viewHandler.productState.loadRTVForAr = false;
+          viewHandler.productState.onChangePlannerView(viewHandler.productState.allow3DComb ? '3DCOMB' : '3D');
+        }
+      }
+    });
+  }, [viewHandler.productState.activateAR, url]);
+  useEffect(function () {
+    //start timeout for auto open the tooltip
+    if (!viewHandler.productState.arCodeWasVisibleOnce && typeof arQrCodeConfig !== 'boolean' && arQrCodeConfig !== null && arQrCodeConfig !== void 0 && arQrCodeConfig.doAutoShow && !openAr) {
+      var _arQrCodeConfig$timeU;
+      autoCloseTimeout.current = setTimeout(function () {
+        viewHandler.productState.setArCodeWasVisibleOnce();
+        setAutoClose(true);
+        viewHandler.productState.setDoShowARQRCode(true);
+      }, ((_arQrCodeConfig$timeU = arQrCodeConfig === null || arQrCodeConfig === void 0 ? void 0 : arQrCodeConfig.timeUntilAutoShow) !== null && _arQrCodeConfig$timeU !== void 0 ? _arQrCodeConfig$timeU : 30) * 1000);
+    }
+    if (!viewHandler.productState.doShowARQRCode && autoClose) {
+      setAutoClose(false);
+    }
+    //delay the state of visible so we animate the fade out
+    if (tooltipVisible !== viewHandler.productState.doShowARQRCode) {
+      setTimeout(function () {
+        setTooltipVisible(viewHandler.productState.doShowARQRCode);
+      }, 200);
+    }
+  }, [viewHandler.productState.doShowARQRCode]);
+  var onClick = function onClick() {
+    viewHandler.productState.setDoShowARQRCode(true);
+    if (openAr) {
+      if (!viewHandler.productState.doShowRTV) {
+        viewHandler.productState.loadRTVForAr = true;
+        viewHandler.productState.onChangePlannerView(viewHandler.productState.allow3DComb ? '3DCOMB' : 'RTV');
+      }
+      openModal({
+        content: /*#__PURE__*/jsx(FullscreenAr, {
+          url: url,
+          isArCompatible: viewHandler.productState.isArCompatible,
+          broswerSupportAR: viewHandler.productState.browserSupportAR,
+          activateAR: viewHandler.productState.activateAR
+        }),
+        fullscreen: true,
+        dontRenderForm: true,
+        rejectByIcon: true,
+        callback: function callback(value) {
+          if (!value) {
+            viewHandler.productState.loadRTVForAr = false;
+            viewHandler.productState.setDoShowARQRCode(false);
+            viewHandler.productState.onChangePlannerView(viewHandler.productState.allow3DComb ? '3DCOMB' : '3D');
+          }
+        }
+      });
+    }
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("li", _objectSpread(_objectSpread(_objectSpread({}, props), {}, {
+      className: classnames(arIcon, props.className),
+      onClick: onClick,
+      title: t('configurator.ar_qr_title')
+    }, triggerProps), {}, {
+      style: {
+        visibility: viewHandler.productState.doShowRenderImage || viewHandler.productState.doShow3DComb ? 'visible' : 'hidden'
+      }
+    })), showTooltip && renderLayer(/*#__PURE__*/jsx(Tooltip, {
+      arrowProps: arrowProps,
+      layerProps: layerProps,
+      autoClose: autoClose,
+      fadeIn: tooltipVisible,
+      fadeout: !viewHandler.productState.doShowARQRCode,
+      url: url
+    }))]
+  });
+};
+var ArQrCodeIcon = observer(ArQrCodeTooltip);
+var index = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  'default': ArQrCodeIcon
+});
+export { ArQrCodeIcon as A, wcZoomIn as a, wcZoomOut as b, wcViews as c, wcFullScreen as d, wc3DDimLine as e, wc3DGridPlannerMode as f, arAbsolute as g, index as i, landscape as l, portrait as p, settingsHidden as s, wcNav3DToolbar as w };

package/build/esm/index-acef1c99.js ADDED Viewed

@@ -0,0 +1,95 @@
+import { s as styleInject, u as useViewHandler } from './index-62e351ed.js';
+import 'react';
+import { useTranslation } from '@crystaldesign/diva-core';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import { A as ArQrCodeIcon } from './index-a9ee8c18.js';
+import { jsxs, Fragment, 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';
+import 'react-laag';
+import './index-13dce417.js';
+import 'react-qr-code';
+import './index-c78dbc87.js';
+var wcNav3DToolbar = "wc_Nav3DToolbar-5t7Cu";
+var settingsHidden = "settings-hidden-xs6Vf";
+var wcZoomIn = "wcZoomIn-eSnCA";
+var wcZoomOut = "wcZoomOut-rlrJR";
+var wcViews = "wcViews-H9r4w";
+var wcFullScreen = "wcFullScreen-B8USD";
+var wc3DGridPlannerMode = "wc3DGridPlannerMode-aiQCR";
+var wc3DDimLine = "wc3DDimLine-BEygX";
+var css_248z = ".wc_Nav3DToolbar-5t7Cu {\n  display: inline;\n  left: -36.8px;\n  width: 58px;\n  position: absolute;\n  z-index: 350;\n  margin: 0;\n  position: absolute;\n  top: 50%;\n  transform: translate(0, -50%);\n}\n\n@media all and (max-height: 650px) and (min-width: 900px) {\n  .wc_Nav3DToolbar-5t7Cu {\n    width: 120px;\n    top: calc(50% - 160px / 2);\n  }\n  .wc_Nav3DToolbar-5t7Cu ul li {\n    float: left;\n    margin: 0 0 9.6px 9.6px;\n  }\n}\n\n.wc_Nav3DToolbar-5t7Cu li {\n  width: 25.6px;\n  padding: 3.2px;\n  margin-left: auto;\n  margin-right: auto;\n  margin-bottom: 16px;\n  height: 25.6px;\n  display: block;\n  background-color: rgba(223, 223, 223, 0.8);\n  background-repeat: no-repeat;\n  background-position: center center;\n  border-radius: 6px;\n  transition: background-color 0.15s ease;\n}\n\n.wc_Nav3DToolbar-5t7Cu li:hover {\n  background-color: rgba(210, 210, 210, 0.8);\n}\n.wc_Nav3DToolbar-5t7Cu li:active {\n  background-color: rgba(197, 197, 197, 0.8);\n}\n\n@media all and (max-width: 900px) {\n  .wc_Nav3DToolbar-5t7Cu {\n    display: none;\n  }\n  .wcFunctionsToolbar-LnNuc {\n    margin-top: 8px;\n  }\n  .wc_Nav3DToolbar-5t7Cu {\n    display: none;\n  }\n  .settings-hidden-xs6Vf.wc_Nav3DToolbar-5t7Cu {\n    bottom: -40px;\n    top: 50%;\n    width: 32px;\n    left: 16px;\n    transform: translate(-50%, -50%);\n    padding: 0;\n    padding: initial;\n    display: block;\n    height: -moz-fit-content;\n    height: fit-content;\n  }\n  .settings-hidden-xs6Vf.wc_Nav3DToolbar-5t7Cu li {\n    margin: 0 8px 16px;\n    float: left;\n  }\n}\n\n@media all and (max-height: 1200px) and (max-width: 800px) and (orientation: portrait), all and (max-width: 500px) and (orientation: portrait) {\n  .wc_Nav3DToolbar-5t7Cu {\n    display: none;\n  }\n  .settings-hidden-xs6Vf.wc_Nav3DToolbar-5t7Cu {\n    bottom: -40px;\n    top: auto;\n    top: initial;\n    width: -moz-fit-content;\n    width: fit-content;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    padding: 0;\n    padding: initial;\n  }\n  .settings-hidden-xs6Vf.wc_Nav3DToolbar-5t7Cu li {\n    margin: 0 8px 16px;\n  }\n}\n\n/*------------------------Nav Icons--------------------------------------*/\n\n/* pfister */\n.wcZoomIn-eSnCA {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2226%22 height%3D%2224%22 viewBox%3D%220 0 26 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9.13434 17.3731C13.8328 17.3731 17.6417 13.6079 17.6417 8.96328C17.6417 4.31867 13.8328 0.553467 9.13434 0.553467C4.43584 0.553467 0.626953 4.31867 0.626953 8.96328C0.626953 13.6079 4.43584 17.3731 9.13434 17.3731Z%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22%2F%3E%3Cpath d%3D%22M24.868 22.6179L15.6235 14.5441%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M4.56201 8.96326H13.7097%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M9.13379 4.44189V13.4847%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcZoomOut-rlrJR {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2222%22 viewBox%3D%220 0 24 22%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.69615 16.6951C12.9919 16.6951 16.4743 13.2526 16.4743 9.00611C16.4743 4.75961 12.9919 1.31714 8.69615 1.31714C4.40038 1.31714 0.917969 4.75961 0.917969 9.00611C0.917969 13.2526 4.40038 16.6951 8.69615 16.6951Z%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22%2F%3E%3Cpath d%3D%22M23.0816 21.4903L14.6631 14.1379%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M4.51465 9.0061H12.8783%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wc360-EcduT {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2228%22 height%3D%2218%22 viewBox%3D%220 0 28 18%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9.18854 12L11.1301 14.9951L7.83789 16.8079%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M10.6232 14.8374C5.30499 14.2069 1.42188 12.0788 1.42188 9.55665C1.42188 8.05911 2.85694 6.71921 5.05175 5.69458%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M24.4674 6.48267C25.8181 7.34966 26.5778 8.37429 26.5778 9.55656C26.5778 12.1575 22.357 14.3644 16.7012 14.9162%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M8.87988 9.13184C8.6748 9.13184 8.47135 9.10742 8.26953 9.05859C8.06771 9.00977 7.87565 8.93652 7.69336 8.83887C7.51107 8.74121 7.34342 8.61751 7.19043 8.46777C7.03743 8.31803 6.90723 8.14225 6.7998 7.94043L7.42969 7.5498C7.51432 7.7028 7.61035 7.83464 7.71777 7.94531C7.82845 8.05599 7.94564 8.14714 8.06934 8.21875C8.19629 8.29036 8.3265 8.34408 8.45996 8.37988C8.59342 8.41243 8.72689 8.42871 8.86035 8.42871C9.13053 8.42871 9.38118 8.36361 9.6123 8.2334C9.84342 8.10319 10.0078 7.94043 10.1055 7.74512C10.2064 7.54655 10.2568 7.35124 10.2568 7.15918C10.2568 6.86296 10.1771 6.61719 10.0176 6.42188C9.85807 6.22331 9.66602 6.08496 9.44141 6.00684C9.2168 5.92871 9.01009 5.88314 8.82129 5.87012V5.26953C9.08171 5.25651 9.32096 5.19141 9.53906 5.07422C9.76042 4.95703 9.91667 4.81055 10.0078 4.63477C10.1022 4.45573 10.1494 4.27344 10.1494 4.08789C10.1494 3.84375 10.0794 3.63542 9.93945 3.46289C9.80273 3.29036 9.63835 3.16992 9.44629 3.10156C9.25749 3.0332 9.08496 2.99902 8.92871 2.99902C8.72038 2.99902 8.52507 3.04134 8.34277 3.12598C8.16374 3.20736 8.01562 3.31315 7.89844 3.44336C7.78125 3.57357 7.69173 3.70215 7.62988 3.8291L7 3.43848C7.13672 3.16504 7.32878 2.93555 7.57617 2.75C7.82357 2.5612 8.07259 2.43424 8.32324 2.36914C8.57389 2.30404 8.80501 2.27148 9.0166 2.27148C9.27051 2.27148 9.51465 2.31217 9.74902 2.39355C9.98665 2.47493 10.1966 2.59212 10.3789 2.74512C10.5645 2.89486 10.7126 3.07878 10.8232 3.29688C10.9339 3.51172 10.9893 3.7526 10.9893 4.01953C10.9893 4.30599 10.9372 4.55827 10.833 4.77637C10.7288 4.99447 10.6003 5.16211 10.4473 5.2793C10.2975 5.39648 10.1543 5.48275 10.0176 5.53809C10.2682 5.639 10.4733 5.76595 10.6328 5.91895C10.7956 6.07194 10.9128 6.25749 10.9844 6.47559C11.0592 6.69043 11.0967 6.91504 11.0967 7.14941C11.0967 7.46517 11.0332 7.74674 10.9062 7.99414C10.7826 8.24154 10.6165 8.44987 10.4082 8.61914C10.1999 8.78516 9.96224 8.91211 9.69531 9C9.43164 9.08789 9.15983 9.13184 8.87988 9.13184ZM14.6611 9.13184C14.29 9.13184 13.9694 9.05697 13.6992 8.90723C13.429 8.75423 13.2044 8.55566 13.0254 8.31152C12.8464 8.06413 12.7129 7.78255 12.625 7.4668C12.5404 7.14779 12.498 6.82227 12.498 6.49023C12.498 5.94661 12.5762 5.4388 12.7324 4.9668C12.8919 4.49479 13.1182 4.07487 13.4111 3.70703C13.7074 3.33594 14.0638 3.02832 14.4805 2.78418C14.9004 2.54004 15.3708 2.37565 15.8916 2.29102L16.0479 2.9209C15.7581 2.97298 15.4798 3.06413 15.2129 3.19434C14.9492 3.32129 14.7067 3.47917 14.4854 3.66797C14.264 3.85677 14.0687 4.06999 13.8994 4.30762C13.7334 4.54525 13.6032 4.79915 13.5088 5.06934C13.6813 4.95866 13.8701 4.86914 14.0752 4.80078C14.2835 4.73242 14.5049 4.69824 14.7393 4.69824C15.0485 4.69824 15.3236 4.76009 15.5645 4.88379C15.8053 5.00749 16.0088 5.1735 16.1748 5.38184C16.3408 5.58691 16.4678 5.82454 16.5557 6.09473C16.6436 6.36165 16.6875 6.63997 16.6875 6.92969C16.6875 7.23242 16.6403 7.51725 16.5459 7.78418C16.4548 8.05111 16.3213 8.28548 16.1455 8.4873C15.973 8.68587 15.7614 8.84375 15.5107 8.96094C15.2601 9.07487 14.9769 9.13184 14.6611 9.13184ZM14.6709 8.45801C14.8825 8.45801 15.0664 8.41569 15.2227 8.33105C15.3789 8.24316 15.5075 8.12923 15.6084 7.98926C15.7126 7.84603 15.7907 7.6849 15.8428 7.50586C15.8949 7.32357 15.9209 7.13802 15.9209 6.94922C15.9209 6.62044 15.8574 6.33073 15.7305 6.08008C15.6068 5.82617 15.4408 5.64714 15.2324 5.54297C15.0241 5.43555 14.806 5.38184 14.5781 5.38184C14.3438 5.38184 14.1273 5.41927 13.9287 5.49414C13.7301 5.56901 13.5511 5.66829 13.3916 5.79199C13.3493 6.00358 13.3281 6.23633 13.3281 6.49023C13.3281 6.70508 13.3477 6.92806 13.3867 7.15918C13.429 7.3903 13.5007 7.60352 13.6016 7.79883C13.7025 7.99089 13.8392 8.14876 14.0117 8.27246C14.1875 8.39616 14.4072 8.45801 14.6709 8.45801ZM19.9199 9.1416C19.6465 9.1416 19.3975 9.09603 19.1729 9.00488C18.9482 8.91374 18.7464 8.78841 18.5674 8.62891C18.3916 8.46615 18.2386 8.27572 18.1084 8.05762C17.9782 7.83952 17.8708 7.60352 17.7861 7.34961C17.7015 7.09245 17.638 6.82389 17.5957 6.54395C17.5566 6.264 17.5387 5.98242 17.542 5.69922C17.542 5.2207 17.5957 4.76986 17.7031 4.34668C17.8138 3.92025 17.9798 3.54264 18.2012 3.21387C18.4225 2.88509 18.6846 2.64583 18.9873 2.49609C19.29 2.34635 19.6009 2.27148 19.9199 2.27148C20.1934 2.27148 20.4408 2.31706 20.6621 2.4082C20.8867 2.49935 21.0869 2.62467 21.2627 2.78418C21.4417 2.94368 21.5947 3.13249 21.7217 3.35059C21.8519 3.56543 21.9593 3.7998 22.0439 4.05371C22.1318 4.30762 22.1953 4.57454 22.2344 4.85449C22.2767 5.13444 22.2979 5.41602 22.2979 5.69922C22.2979 6.16797 22.2409 6.62044 22.127 7.05664C22.013 7.49284 21.8438 7.87695 21.6191 8.20898C21.3978 8.54102 21.1357 8.78027 20.833 8.92676C20.5335 9.06999 20.2292 9.1416 19.9199 9.1416ZM19.9199 8.42871C20.2943 8.42871 20.6051 8.26432 20.8525 7.93555C21.0999 7.60677 21.2611 7.23405 21.3359 6.81738C21.4108 6.40072 21.4482 6.02474 21.4482 5.68945C21.4482 5.14909 21.3783 4.66081 21.2383 4.22461C21.0983 3.78516 20.9111 3.4694 20.6768 3.27734C20.4424 3.08529 20.1901 2.98926 19.9199 2.98926C19.6465 2.98926 19.4121 3.06738 19.2168 3.22363C19.0247 3.37988 18.8669 3.58659 18.7432 3.84375C18.6195 4.09766 18.5283 4.38574 18.4697 4.70801C18.4111 5.03027 18.3818 5.35742 18.3818 5.68945C18.3818 6.02474 18.4111 6.35677 18.4697 6.68555C18.5283 7.01107 18.6195 7.30404 18.7432 7.56445C18.8701 7.82161 19.0296 8.02995 19.2217 8.18945C19.417 8.34896 19.6497 8.42871 19.9199 8.42871Z%22 fill%3D%22%236F6F6F%22%2F%3E%3Cpath d%3D%22M23.2016 3.09344C23.6678 3.09344 24.0457 2.74057 24.0457 2.30527C24.0457 1.86997 23.6678 1.51709 23.2016 1.51709C22.7354 1.51709 22.3574 1.86997 22.3574 2.30527C22.3574 2.74057 22.7354 3.09344 23.2016 3.09344Z%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.75%22 stroke-miterlimit%3D%2210%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcFocus-o05ls {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2221%22 viewBox%3D%220 0 20 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M13.122 7.34912H6.94531V13.5258H13.122V7.34912Z%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M6.40838 19.568H2.17869C1.44018 19.568 0.835938 18.9638 0.835938 18.2253V13.9956%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M19.1642 13.9956V18.2253C19.1642 18.9638 18.56 19.568 17.8215 19.568H13.5918%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M13.5918 1.2395H17.8215C18.56 1.2395 19.1642 1.84374 19.1642 2.58226V6.81194%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M0.835938 6.81194V2.58226C0.835938 1.84374 1.44018 1.2395 2.17869 1.2395H6.40838%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcViews-H9r4w {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2221%22 viewBox%3D%220 0 20 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9.99973 0.613525L0.876385 4.37922C0.792685 4.37922 0.708984 4.46294 0.708984 4.6303V16.2621C0.708984 16.3458 0.792685 16.4294 0.876385 16.5131L9.91603 20.1951C9.99973 20.1951 9.99973 20.1951 10.0834 20.1951L19.1231 16.5131C19.2068 16.5131 19.2905 16.4294 19.2905 16.2621V4.6303C19.2905 4.54662 19.2068 4.4629 19.1231 4.37922L10.0834 0.697238C10.0834 0.613556 10.0834 0.613525 9.99973 0.613525ZM10.0834 1.11565L18.5372 4.6303L10.0834 8.06124L1.62969 4.6303L10.0834 1.11565ZM1.21119 4.965L9.83233 8.47965V19.6094L1.21119 16.0947V4.965ZM18.872 4.965V16.0947L10.2508 19.6094V8.47965L18.872 4.965Z%22 fill%3D%22%236F6F6F%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.5%22 stroke-miterlimit%3D%2210%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcPan-NXlrf {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2226%22 height%3D%2227%22 viewBox%3D%220 0 26 27%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9.06738 5.18778L12.9615 1.2937L16.9334 5.26566%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M16.8553 21.6209L12.9612 25.5149L8.98926 21.543%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M12.9609 1.68311V9.47127%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M12.9609 17.3374V25.1256%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M4.78373 17.2594L0.889648 13.3653L4.86161 9.39331%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M21.2166 9.47119L25.1106 13.3653L21.1387 17.3372%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M1.2793 13.3652H9.06746%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M16.9336 13.3652H24.7218%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcRoom-7RIQT {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2223%22 height%3D%2221%22 viewBox%3D%220 0 23 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M12.8291 16.5054H18.232V6.32178H12.8291V16.5054Z%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.6%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M6.36523 16.5051H12.5532V6.04627H18.5564V16.5051H21.8813V3.29395H6.36523V16.5051Z%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.6%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M22.2043 3.01889H6.22644L0.777344 0.633545V20.175L6.22644 16.8264H22.1581V3.01889H22.2043ZM1.05442 1.09227L6.04172 3.24825V16.597L1.05442 19.6246V1.09227ZM18.2329 16.5053H12.83V6.32167H18.2329V16.5053ZM21.881 16.5053H18.51V6.04644H12.5068V16.5511H6.3188V3.29412H21.881V16.5053Z%22 fill%3D%22%236F6F6F%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.6%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3Cpath d%3D%22M17.2702 11.5969H16.9932V12.6061H17.2702V11.5969Z%22 fill%3D%22%236F6F6F%22 stroke%3D%22%236F6F6F%22 stroke-width%3D%220.6%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\");\n}\n.wcFullScreen-B8USD {\n  background-image: url(\"data:image/svg+xml,%3Csvg width%3D%2220%22 height%3D%2221%22 viewBox%3D%220 0 20 21%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg clip-path%3D%22url(%23clip0)%22%3E%3Cpath d%3D%22M19.5811 10.3625V16.9734C19.5811 18.5633 18.4933 19.9023 17.2381 19.9023H2.76106C1.42215 19.9023 0.417969 18.5633 0.417969 16.9734V3.75162C0.417969 2.16167 1.50583 0.822754 2.76106 0.822754H9.87404%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M19.5813 0.822754L10.46 9.94409%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22%2F%3E%3Cpath d%3D%22M13.7236 0.822754H19.5814V6.59681%22 stroke%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath id%3D%22clip0%22%3E%3Crect width%3D%2220%22 height%3D%2220%22 fill%3D%22white%22 transform%3D%22translate(0 0.404297)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\");\n}\n.wc3DGridPlannerMode-aiQCR {\n  background-image: url(\"data:image/svg+xml,%3Csvg id%3D%22Ebene_1%22 data-name%3D%22Ebene 1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2225%22 height%3D%2225%22 viewBox%3D%220 0 393.81 393.81%22%3E%09%3Ctitle%3EPfeil%3C%2Ftitle%3E%09%3Cpath fill%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 d%3D%22M328.44%2C391.41a6%2C6%2C0%2C0%2C0-5.51-6l-137.35-11.5V353a4.74%2C4.74%2C0%2C0%2C0-8.1-3.36l-38.4%2C38.4a4.75%2C4.75%2C0%2C0%2C0%2C0%2C6.71l38.4%2C38.4a4.71%2C4.71%2C0%2C0%2C0%2C3.35%2C1.39%2C4.74%2C4.74%2C0%2C0%2C0%2C4.75-4.74V408.93L323%2C397.43A6%2C6%2C0%2C0%2C0%2C328.44%2C391.41ZM178.7%2C405.77v18.89l-33.25-33.25%2C33.25-33.26V377a3.46%2C3.46%2C0%2C0%2C0%2C3.15%2C3.43l130.64%2C10.94L181.85%2C402.34A3.43%2C3.43%2C0%2C0%2C0%2C178.7%2C405.77Z%22 transform%3D%22translate(-137.69 -194.5)%22%2F%3E%09%3Cpath fill%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 d%3D%22M530.11%2C388.05l-38.4-38.4a4.74%2C4.74%2C0%2C0%2C0-8.09%2C3.36v20.87l-137.4%2C11.5a6.05%2C6.05%2C0%2C0%2C0%2C0%2C12.05l137.36%2C11.5v20.88a4.73%2C4.73%2C0%2C0%2C0%2C2.92%2C4.38%2C4.8%2C4.8%2C0%2C0%2C0%2C1.82.36%2C4.67%2C4.67%2C0%2C0%2C0%2C3.35-1.39l38.4-38.4A4.75%2C4.75%2C0%2C0%2C0%2C530.11%2C388.05Zm-42.77%2C14.29L356.71%2C391.41l130.63-10.94a3.46%2C3.46%2C0%2C0%2C0%2C3.15-3.43V358.15l33.25%2C33.26-33.25%2C33.25V405.77A3.43%2C3.43%2C0%2C0%2C0%2C487.34%2C402.34Z%22 transform%3D%22translate(-137.69 -194.5)%22%2F%3E%09%3Cpath fill%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 d%3D%22M373%2C540.43H352.12L340.62%2C403a6.05%2C6.05%2C0%2C0%2C0-12.05%2C0l-11.5%2C137.36H296.2a4.74%2C4.74%2C0%2C0%2C0-3.36%2C8.09l38.4%2C38.4a4.74%2C4.74%2C0%2C0%2C0%2C6.71%2C0l38.4-38.4a4.74%2C4.74%2C0%2C0%2C0-3.35-8.09Zm-5.15%2C6.87L334.6%2C580.55%2C301.34%2C547.3h18.89a3.46%2C3.46%2C0%2C0%2C0%2C3.43-3.15L334.6%2C413.51l10.93%2C130.64A3.46%2C3.46%2C0%2C0%2C0%2C349%2C547.3Z%22 transform%3D%22translate(-137.69 -194.5)%22%2F%3E%09%3Cpath fill%3D%22%236F6F6F%22 stroke-miterlimit%3D%2210%22 stroke-linecap%3D%22round%22 d%3D%22M296.2%2C242.39h20.87l11.5%2C137.39a6.05%2C6.05%2C0%2C0%2C0%2C12.05%2C0l11.5-137.35H373a4.74%2C4.74%2C0%2C0%2C0%2C3.35-8.1L338%2C195.89a4.74%2C4.74%2C0%2C0%2C0-6.71%2C0l-38.4%2C38.4a4.74%2C4.74%2C0%2C0%2C0%2C3.36%2C8.1Zm5.14-6.88%2C33.26-33.25%2C33.25%2C33.25H349a3.45%2C3.45%2C0%2C0%2C0-3.42%2C3.15L334.6%2C369.3%2C323.66%2C238.66a3.47%2C3.47%2C0%2C0%2C0-3.43-3.15Z%22 transform%3D%22translate(-137.69 -194.5)%22%2F%3E%3C%2Fsvg%3E\");\n  margin: 0 0 1rem;\n}\n\n.wc3DDimLine-BEygX {\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%22Ebene_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 15 12%22 style%3D%22enable-background%3Anew 0 0 15 12%3B%22 xml%3Aspace%3D%22preserve%22%3E%3Cstyle type%3D%22text%2Fcss%22%3E%09.st0%7Bfill%3Anone%3B %7D%09.st1%7Bfill%3A%237E7E7E%3B%7D%3C%2Fstyle%3E%3Cpath class%3D%22st0%22 d%3D%22M14.8%2C1.3c0-0.6-0.5-1.2-1.2-1.2H1.4c-0.6%2C0-1.2%2C0.5-1.2%2C1.2v9.4c0%2C0.6%2C0.5%2C1.2%2C1.2%2C1.2h12.2%09c0.6%2C0%2C1.2-0.5%2C1.2-1.2C14.8%2C10.7%2C14.8%2C1.3%2C14.8%2C1.3z%22%2F%3E%3Cg%3E%09%3Cpath class%3D%22st1%22 d%3D%22M12.9%2C2.9c-0.1%2C0-0.2%2C0.1-0.2%2C0.2v5.8c0%2C0.1%2C0.1%2C0.2%2C0.2%2C0.2S13%2C9%2C13%2C8.9V3.1C13%2C3%2C12.9%2C2.9%2C12.9%2C2.9z%22%2F%3E%09%3Cpath class%3D%22st1%22 d%3D%22M2.1%2C2.9C2.1%2C2.9%2C2%2C3%2C2%2C3.1v5.8C2%2C9%2C2.1%2C9.1%2C2.1%2C9.1c0.1%2C0%2C0.2-0.1%2C0.2-0.2V3.1C2.3%2C3%2C2.2%2C2.9%2C2.1%2C2.9z%22%2F%3E%09%3Cpath class%3D%22st1%22 d%3D%22M10.3%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0C10.1%2C5%2C10%2C5%2C10%2C5.1v0.8H5V5.1C5%2C5%2C4.9%2C5%2C4.9%2C4.9c-0.1%2C0-0.1%2C0-0.2%2C0l-1.5%2C1%09%09c0%2C0-0.1%2C0.1-0.1%2C0.1c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1l1.5%2C1c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0C4.9%2C7.1%2C5%2C7.1%2C5%2C7V6.2H10V7c0%2C0.1%2C0%2C0.1%2C0.1%2C0.1%09%09c0%2C0%2C0.1%2C0%2C0.1%2C0c0%2C0%2C0.1%2C0%2C0.1%2C0l1.5-1c0%2C0%2C0.1-0.1%2C0.1-0.1c0-0.1%2C0-0.1-0.1-0.1L10.3%2C4.9z M4.6%2C6.7L3.6%2C6l1-0.6V6.7z M10.4%2C6.7%09%09V5.4l1%2C0.6L10.4%2C6.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");\n  margin: 0 0 1rem;\n}\n";
+styleInject(css_248z);
+var NavBar = function NavBar(props) {
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [viewHandler.productState.doShowNav3D && /*#__PURE__*/jsxs("ul", {
+      className: classnames(wcNav3DToolbar, viewHandler.uiState.configSettingsIsHidden ? settingsHidden : undefined),
+      children: [!viewHandler.productState.plannerRenderingIsStaticBG && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("li", {
+          className: wcZoomIn,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DZoomIn');
+          },
+          title: t('configurator.NAV3DZOOMIN_TT')
+        }), /*#__PURE__*/jsx("li", {
+          className: wcZoomOut,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DZoomOut');
+          },
+          title: t('configurator.NAV3DZOOMOUT_TT')
+        }), /*#__PURE__*/jsx("li", {
+          className: wcViews,
+          onClick: function onClick() {
+            return viewHandler.productState.onNav3DMenuSelect('Nav3DViews');
+          },
+          title: t('configurator.NAV3DVIEWS_TT')
+        })]
+      }), /*#__PURE__*/jsx("li", {
+        className: wcFullScreen,
+        onClick: function onClick() {
+          return viewHandler.productState.onNav3DMenuSelect('Nav3DFullScreen');
+        },
+        title: t('configurator.NAV3DFULLSCREEN_TT')
+      }), viewHandler.productState.doShowNav3DPlannerMode && /*#__PURE__*/jsx("li", {
+        className: wc3DGridPlannerMode,
+        onClick: function onClick() {
+          return viewHandler.productState.onNav3DMenuSelect('Nav3DPlannerMode');
+        },
+        title: t('configurator.NAV3DPLANNERMODE_TT')
+      }), viewHandler.productState.doEnableToShow3DDimensionLines && /*#__PURE__*/jsx("li", {
+        className: wc3DDimLine,
+        onClick: function onClick() {
+          return viewHandler.productState.onNav3DMenuSelect('Nav3DDimLine');
+        },
+        title: t('configurator.NAV3DDIMLINE_TT')
+      })]
+    }), viewHandler.productState.allowQRCodeAR && /*#__PURE__*/jsx("div", {
+      style: {
+        position: 'absolute',
+        bottom: viewHandler.getIsInMobileView() ? '15%' : '5%',
+        left: '3px',
+        zIndex: 110
+      },
+      children: /*#__PURE__*/jsx(ArQrCodeIcon, {})
+    })]
+  });
+};
+var index = observer(NavBar);
+export { index as default };

package/build/esm/index-ad105a49.js ADDED Viewed

@@ -0,0 +1,73 @@
+import { s as styleInject, u as useViewHandler } from './index-62e351ed.js';
+import classnames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import '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 paletteItem = "PaletteItem-Y-gaJ";
+var imageWrapper = "imageWrapper-rcOF5";
+var sel = "sel-1986q";
+var imageBackground = "imageBackground-SUtlD";
+var wcImage = "wcImage-XUaTv";
+var title = "title-Cr0ha";
+var titleSel = "title-sel-8BT-F";
+var mobile = "mobile-NUDZR";
+var css_248z = "/*Size Normal */\n\n.PaletteItem-Y-gaJ {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  width: -moz-min-content;\n  width: min-content;\n  height: 70px;\n  z-index: 100;\n  transition: all 0.15s ease;\n  cursor: pointer;\n  margin-bottom: 2px;\n  margin-left: 10px;\n}\n\n.PaletteItem-Y-gaJ:active {\n  z-index: 200;\n  transition: 0.15s ease;\n}\n.PaletteItem-Y-gaJ:hover {\n  z-index: 200;\n  transition: 0.15s ease;\n}\n\n.imageWrapper-rcOF5 {\n  border-radius: 50%;\n  border: 1px transparent solid;\n  width: 68px;\n  height: 68px;\n  transition: 0.15s ease;\n  border-style: double;\n}\n\n.sel-1986q .imageWrapper-rcOF5,\n.small-oHSfx.sel-1986q .imageWrapper-rcOF5 {\n  box-shadow: 0px 1px 4px rgba(68, 49, 49, 0.15);\n}\n\n.imageBackground-SUtlD {\n  border-radius: 50%;\n  border: 4px white solid;\n  width: 60px;\n  height: 60px;\n  transition: 0.15s ease;\n}\n\n.sel-1986q .imageBackground-SUtlD {\n  border: 4px var(--primaryColor) solid;\n}\n\n.wcImage-XUaTv {\n  width: 100%;\n  height: 60px;\n  border-radius: 50%;\n  background-size: cover;\n  user-select: none;\n  -moz-user-select: none;\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n}\n\n.title-Cr0ha {\n  text-align: center;\n  margin: 16px;\n  padding: 8px 16px;\n  font-size: 14px;\n  line-height: 24px;\n  z-index: 400;\n  font-weight: 600;\n  color: var(--secondaryColor);\n  font-family: var(--diva-typography-font-family);\n  margin-left: 12px;\n  text-align: left;\n  white-space: nowrap;\n  background-color: #eee;\n  border-radius: 70px;\n  opacity: 0;\n  transition: opacity 0.2s ease-in-out;\n}\n\n.PaletteItem-Y-gaJ:hover .title-Cr0ha,\n.title-sel-8BT-F {\n  opacity: 1;\n}\n\n.mobile-NUDZR.PaletteItem-Y-gaJ {\n  width: 45px;\n  height: 45px;\n}\n\n.mobile-NUDZR .title-Cr0ha {\n  margin-right: 12px;\n}\n.mobile-NUDZR .imageWrapper-rcOF5 {\n  width: 43px;\n  height: 43px;\n}\n\n.mobile-NUDZR .imageBackground-SUtlD {\n  width: 39px;\n  height: 39px;\n  border-width: 2px;\n}\n\n.mobile-NUDZR .wcImage-XUaTv {\n  height: 39px;\n}\n\n.mobile-NUDZR .title-Cr0ha {\n  line-height: 2px;\n  font-size: 12px;\n  padding: 14px;\n  margin: 8px;\n}\n\n/* \n@media all and (max-width: 1800px) {\n  .PaletteItem {\n    width: 81px;\n    height: 81px;\n  }\n  .imageWrapper {\n    width: 79px;\n    height: 79px;\n  }\n  .imageBackground {\n    width: 71px;\n    height: 71px;\n  }\n  .wcImage {\n    height: 71px;\n  }\n  .title {\n    line-height: 81px;\n    font-size: 12px;\n  } \n}\n*/\n";
+styleInject(css_248z);
+var Room = function Room(_ref) {
+  var itemP = _ref.item,
+    from = _ref.from,
+    isVP = _ref.isVP;
+  var item = itemP;
+  var viewHandler = useViewHandler();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var onClick = function onClick() {
+    viewHandler.productState.setRoomListExpanded(true); //reset the timeout
+    if (isVP) {
+      viewHandler.paletteViewHandler.clickedOnStaticVPPalette(item, !!from);
+    } else {
+      viewHandler.paletteViewHandler.clickedOnStaticRoomPalette(item, !!from);
+    }
+  };
+  return /*#__PURE__*/jsxs("div", {
+    onClick: onClick,
+    className: classnames(paletteItem, viewHandler.uiState.isInMobileView ? mobile : undefined),
+    children: [/*#__PURE__*/jsx("div", {
+      className: classnames(item.sel ? sel : undefined),
+      children: /*#__PURE__*/jsx("div", {
+        className: classnames(imageWrapper),
+        children: /*#__PURE__*/jsx("div", {
+          className: classnames(imageBackground),
+          children: /*#__PURE__*/jsx("div", {
+            "data-test-id": "select-room",
+            className: wcImage,
+            style: {
+              backgroundImage: "url(".concat(item.url, ")")
+            }
+          })
+        })
+      })
+    }), !isVP && /*#__PURE__*/jsx("div", {
+      className: classnames(item.sel ? titleSel : undefined, title),
+      children: t('configurator.' + item.N)
+    })]
+  });
+};
+var RoomRound = observer(Room);
+export { RoomRound as default };

package/build/esm/index-ae2c167c.js ADDED Viewed

@@ -0,0 +1,125 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { s as styleInject, u as useViewHandler } from './index-62e351ed.js';
+import Dropdown from 'react-dropdown';
+import { useState, useEffect } from 'react';
+import { observer } from 'mobx-react-lite';
+import classnames from 'classnames';
+import InfoIcon from './index-91dad7cd.js';
+import { jsx, jsxs } 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/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 wcDropDownSelect = "wcDropDownSelect-RE7qJ";
+var dropDownArea = "dropDownArea-yEewD";
+var dropOption = "dropOption-i-M5T";
+var row = "row-80qIj";
+var title = "title-2mKgp";
+var colum = "colum-cjf3n";
+var dropdownWidth = "dropdownWidth-D5Fng";
+var image = "image-7MOa9";
+var css_248z = ".wcDropDownSelect-RE7qJ {\n  padding: 8px 24px 8px 8px !important;\n  box-sizing: border-box !important;\n}\n\n.wcDropDownSelect-RE7qJ {\n  height: 2.4375rem;\n  padding: 0.5rem;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  border: 1px solid #cacaca;\n  border-radius: 4px;\n  background-color: #fefefe;\n  font-family: inherit;\n  font-size: 13px;\n  line-height: 22px;\n  color: #0a0a0a;\n  background-origin: content-box;\n  background-position: right -1rem center;\n  background-repeat: no-repeat;\n  background-size: 9px 6px;\n  padding-right: 1.5rem;\n  transition: box-shadow 0.5s, border-color 0.25s ease-in-out;\n  font-weight: 300;\n}\n\n.dropDownArea-yEewD {\n  max-height: 520px !important;\n  width: -moz-fit-content !important;\n  width: fit-content !important;\n  display: inline-block !important;\n}\n\n.dropDownArea-yEewD {\n\n  right: 0;\n  min-width: 152px;\n  max-width: 370px;\n  letter-spacing: 0px;\n  font-size: 13px;\n  font-weight: 300;\n}\n\n.dropDownArea-yEewD .dropOption-i-M5T {\n  white-space: nowrap;\n}\n.wcDropDownSelect-RE7qJ .dropOption-i-M5T {\n  width: 110px;\n  overflow: hidden;\n  white-space: nowrap;\n}\n.row-80qIj {\n  width: 100%;\n  height: -moz-fit-content;\n  height: fit-content;\n  position: relative;\n  display: flex;\n  padding-bottom: 4px;\n  padding-top: 4px;\n}\n\n.title-2mKgp {\n  text-align: left;\n  padding-bottom: 9px;\n  padding-top: 9px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n\n.colum-cjf3n {\n  width: 50%;\n}\n.dropdownWidth-D5Fng {\n  width: 155px;\n  margin: 10px 15px;\n  height: -moz-fit-content;\n  height: fit-content;\n}\n\n.image-7MOa9 {\n  width: 45%;\n}\n";
+styleInject(css_248z);
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+var DropDowmText = function DropDowmText(_ref) {
+  var _item$selectedElement;
+  var item = _ref.item,
+    paletteId = _ref.paletteId;
+  var viewHandler = useViewHandler();
+  var allItemsP = item.groups.flatMap(function (group) {
+    return group.items;
+  });
+  var allItems = allItemsP;
+  var sel = allItems.find(function (item) {
+    return item.sel;
+  });
+  var _useState = useState(sel === null || sel === void 0 ? void 0 : sel.text),
+    _useState2 = _slicedToArray(_useState, 2),
+    actValue = _useState2[0],
+    setActValue = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    forceClick = _useState4[0],
+    setForceClick = _useState4[1];
+  useEffect(function () {
+    var val = allItems.find(function (item) {
+      return item.codex == actValue;
+    });
+    if (val) viewHandler.paletteViewHandler.clickedOnConfigPalette(val, undefined, paletteId);
+  }, [actValue, forceClick]);
+  var selOption = undefined;
+  var options = [];
+  var onChange = function onChange(val) {
+    setActValue(val.value);
+    setForceClick(!forceClick);
+  };
+  var _iterator = _createForOfIteratorHelper(allItems),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var _item = _step.value;
+      var option = {
+        label: /*#__PURE__*/jsx("div", {
+          className: dropOption,
+          dangerouslySetInnerHTML: {
+            __html: _item.text
+          }
+        }),
+        text: _item.text,
+        value: _item.codex
+      };
+      if (_item.sel) selOption = option;
+      options.push(option);
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  var contentItem = (_item$selectedElement = item.selectedElements) !== null && _item$selectedElement !== void 0 && _item$selectedElement[0].contentItemId ? item.selectedElements[0] : item.optionContentItemId ? {
+    contentItemId: item.optionContentItemId,
+    codex: item.configStepKey
+  } : undefined;
+  return /*#__PURE__*/jsxs("div", {
+    className: row,
+    ref: function ref(_ref2) {
+      return item.htmlRef = _ref2;
+    },
+    children: [/*#__PURE__*/jsx("div", {
+      className: classnames(colum, title),
+      children: item.name
+    }), /*#__PURE__*/jsx(Dropdown, {
+      className: dropdownWidth,
+      controlClassName: wcDropDownSelect,
+      menuClassName: dropDownArea,
+      options: options,
+      value: selOption,
+      placeholderClassName: dropOption,
+      onChange: onChange
+    }), item.type == 'DROPDOWN_IMAGE' && (sel === null || sel === void 0 ? void 0 : sel.image) && /*#__PURE__*/jsx("img", {
+      className: image,
+      src: sel.image.replace('_gal.', '.')
+    }), contentItem && /*#__PURE__*/jsx(InfoIcon, {
+      item: contentItem,
+      style: {
+        bottom: 'calc(50% - 8px)',
+        right: '-5%'
+      }
+    })]
+  });
+};
+var index = observer(DropDowmText);
+export { index as default };

package/build/esm/index-ae57581c.js ADDED Viewed

@@ -0,0 +1,77 @@
+import { u as useViewHandler } from './index-62e351ed.js';
+import { observer } from 'mobx-react-lite';
+import React, { Suspense } from 'react';
+import Planner2DGrid from './index-6f326311.js';
+import Planner3DImage from './index-548b3897.js';
+import { w as wcConfiguratorProductCenter, p as portrait, l as landscape, s as settingsHidden, f as fullscreen, a as wcConfiguratorArticleImage, c as center, b as foldback, d as foldbackLeft, e as foldup } from './index.module-93e8e774.js';
+import classnames from 'classnames';
+import Planner3DGrid from './index-23004ea0.js';
+import PlannerMsgContainer from './index-e228fa67.js';
+import PlannerUIVariant from './index-657064eb.js';
+import RotateInfo from './index-e348b193.js';
+import PromotedOpvs from './index-2ff07b97.js';
+import OrbitInteraction from './index-8dff9fb3.js';
+import { jsxs, 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 './index-a86358e7.js';
+import './index-b7624242.js';
+import '@crystaldesign/content-box';
+var Planner3D = /*#__PURE__*/React.lazy(function () {
+  return import('./index-d29c4cfb.js');
+});
+var PlannerRTV = /*#__PURE__*/React.lazy(function () {
+  return import('./index-0182885c.js');
+});
+var ProductCenter = function ProductCenter(_ref) {
+  var style = _ref.style,
+    _ref$folderPosition = _ref.folderPosition,
+    folderPosition = _ref$folderPosition === void 0 ? 'right' : _ref$folderPosition;
+  var viewHandler = useViewHandler();
+  var showFolderButton = !viewHandler.uiState.ViewConfig.hideMobileFolder || viewHandler.uiState.ViewConfig.showSettingsFolder && viewHandler.productState.promotionVisible;
+  var showFoldup = !viewHandler.uiState.ViewConfig.hideMobileFolder && !viewHandler.uiState.configSettingsIsFoldedUp && !viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isMobilePortrait && !viewHandler.productState.roomListExpanded;
+  var showFoldDown = viewHandler.uiState.configSettingsIsHidden && viewHandler.uiState.isInMobileView || viewHandler.uiState.ViewConfig.showSettingsFolder && viewHandler.productState.promotionVisible;
+  var showOrbitCube = viewHandler.productState.doShowRenderImage && (!viewHandler.uiState.ViewConfig.dontShowOrbitInMobile || !viewHandler.getIsInMobileView()) && viewHandler.viewPlannerHandler.getCurPlannerViewMode() == '3DImage' && viewHandler.productState.doShowRenderImage && !viewHandler.productState.plannerRenderingIsStaticBG;
+  return /*#__PURE__*/jsxs("div", {
+    style: style,
+    className: classnames(wcConfiguratorProductCenter, viewHandler.uiState.isMobilePortrait ? portrait : undefined, viewHandler.uiState.isMobileLandscape ? landscape : undefined, viewHandler.uiState.configSettingsIsHidden ? settingsHidden : undefined, viewHandler.uiState.ViewConfig.landscapeProductNotFullscreen ? undefined : fullscreen),
+    children: [/*#__PURE__*/jsx(PlannerMsgContainer, {}), /*#__PURE__*/jsx(Planner3DImage, {}), viewHandler.productState.allow3DComb && viewHandler.isParentViewVisible && /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx(Fragment, {}),
+      children: /*#__PURE__*/jsx(Planner3D, {})
+    }), /*#__PURE__*/jsx(Planner3DGrid, {}), (viewHandler.productState.allowRTV || viewHandler.productState.allowQRCodeAR) && viewHandler.isParentViewVisible && /*#__PURE__*/jsx(Suspense, {
+      fallback: /*#__PURE__*/jsx(Fragment, {}),
+      children: /*#__PURE__*/jsx(PlannerRTV, {})
+    }), showOrbitCube && /*#__PURE__*/jsx(OrbitInteraction, {}), /*#__PURE__*/jsx(Planner2DGrid, {}), /*#__PURE__*/jsx(RotateInfo, {}), /*#__PURE__*/jsx(PromotedOpvs, {}), !viewHandler.productState.hidePlannerUiIcons && !(viewHandler.productState.doShowRTV || viewHandler.productState.doShow3DComb) && /*#__PURE__*/jsx(PlannerUIVariant, {}), viewHandler.productState.plannerMode == 'No' && /*#__PURE__*/jsx("div", {
+      className: wcConfiguratorArticleImage,
+      children: viewHandler.productState.articleImage && /*#__PURE__*/jsx("img", {
+        src: viewHandler.productState.articleImage,
+        className: center
+      })
+    }), showFolderButton && /*#__PURE__*/jsxs(Fragment, {
+      children: [showFoldDown && /*#__PURE__*/jsx("div", {
+        className: classnames(foldback, folderPosition === 'left' ? foldbackLeft : undefined),
+        onClick: viewHandler.uiState.onClickHideConfigSettings,
+        id: "btnFoldDown"
+      }), showFoldup && /*#__PURE__*/jsx("div", {
+        id: "btnFoldUp",
+        className: classnames(foldup),
+        onClick: viewHandler.uiState.onClickFoldupConfigSettings
+      })]
+    })]
+  });
+};
+var ProductCenter$1 = observer(ProductCenter);
+export { ProductCenter$1 as default };