@crystaldesign/diva-web-planner-react 26.3.0-beta.4 → 26.3.0-beta.40

package/build/esm/{index-a3b0fb5b.js → index-1cc7b428.js}

@@ -2,17 +2,17 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { useState } from 'react';
 import { useDivaCore } from '@crystaldesign/diva-core';
 import { useHover, useLayer } from 'react-laag';
-import MetaData from './index-08a98cbb.js';
-import GenericToolTip from './index-c5e642eb.js';
-import SubTabGroup from './index-76ca5531.js';
-import InfoIcon from './index-2b4ea28b.js';
-import PricePreview from './index-c4c0bdbd.js';
+import MetaData from './index-65257b21.js';
+import GenericToolTip from './index-aa0fc26b.js';
+import SubTabGroup from './index-975cb436.js';
+import InfoIcon from './index-a5b98d98.js';
+import PricePreview from './index-541d3fca.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import 'react-dynamic-multi-render';
 import '@babel/runtime/helpers/objectWithoutProperties';
@@ -25,86 +25,89 @@ import '@crystaldesign/web-planner-logic';
 import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
-import './index-f43408be.js';
+import './index-4fd9025b.js';
 import 'react-countup';
 import 'react-collapsible';
-import './index-e41b8a9b.js';
-import './index-c788c062.js';
-import './index-4a4920c1.js';
+import './index-37d1c2d7.js';
+import './index-bf4027aa.js';
+import './index-b9a08374.js';
 import 'sift';
-import './index-bb9c255b.js';
-import './index-9c685201.js';
-import './index-690ec566.js';
-import './index-4c3350f8.js';
-import './index-8cfa9496.js';
-import './index.module-e7cb9056.js';
-import './index-d7b9d494.js';
+import './index-dda8786d.js';
+import './index-3d410951.js';
+import './index-540d3ba6.js';
+import './index-c55d02a7.js';
+import './index-455fcb30.js';
+import './index.module-6dea17c8.js';
+import './index-745045d6.js';
 import 'react-switch';
-import './index-a3f95cb6.js';
+import './index-8b5ed209.js';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';
-import './index-29f5b2d0.js';
+import './index-004b447c.js';
 import 'react-dropdown';
-import './index-cb3b20ec.js';
+import './index-99a97421.js';
 import '@babel/runtime/helpers/objectDestructuringEmpty';
-import './index-050c8cc5.js';
-import './index-e9aed872.js';
-import './index-722897dc.js';
+import './index-83a5c373.js';
+import './index-a7bdb8f2.js';
+import './index-186d08df.js';
 import '@crystaldesign/content-box';
-import './index-7407430e.js';
-import './index-c3656d24.js';
-import './index-4f1bfdab.js';
-import './index-d6330abc.js';
-import './index-cb2a0cd1.js';
-import './index-aef93a42.js';
-import './index-f458d7d4.js';
-import './index-b3e6adc8.js';
-import './index-95c9a953.js';
-import './index.module-fbb4f840.js';
-import './index-e985b067.js';
-import './index-8693b392.js';
-import './index-3b1f2166.js';
-import './index-073cdde6.js';
-import './index-7c745ab9.js';
-import './index.module-07c4c66a.js';
-import './index-e51fd956.js';
-import './index-2052475c.js';
-import './index-2f67c7a6.js';
-import './index-cd4baa3c.js';
-import './index-9e15296d.js';
-import './index-deb2581e.js';
-import './index-b77ac4d2.js';
-import './index-f51f4729.js';
-import './index-99a52150.js';
-import './index-3f9fd8b6.js';
-import './index-6f08238e.js';
+import './index-fafbc3ef.js';
+import './index-164282a5.js';
+import './index-be1508a5.js';
+import './index-333e8017.js';
 import 'swiper/react';
 import 'swiper/modules';
-import './index-05c216ca.js';
+import './UnlockCard-8e1c8aa5.js';
+import './index-29798f44.js';
+import './index-8a430faf.js';
+import './index-21fd5161.js';
+import './index-9d32da86.js';
+import './index-d20f36fe.js';
+import './index-3ba1ae5c.js';
+import './index.module-a2184200.js';
+import './index-64e1a1bd.js';
+import './index-402585db.js';
+import './index-d341421c.js';
+import './index-63a65067.js';
+import './index-24766b71.js';
+import './index.module-f2cc0585.js';
+import './index-e8e70d61.js';
+import './index-67b93891.js';
+import './index-d1836d05.js';
+import './index-b6ae2935.js';
+import './index-9b01075e.js';
+import './index-d50c2b74.js';
+import './index-3e91823b.js';
+import './index-0fa1d49b.js';
+import './index-21ae3555.js';
+import './index-9a248875.js';
+import './index-a4fa889e.js';
+import './index-7850c4e3.js';
 import 'rc-slider';
-import './index-4b637a92.js';
-import './index-41b82621.js';
-import './index-beb8eee3.js';
-import './index-f4bc312a.js';
-import './index-9aab04af.js';
+import './index-2ce98b11.js';
+import './index-c6d3f9de.js';
+import './index-2b5e9ade.js';
+import './index-c6a8ae18.js';
+import './index-21c1fb93.js';
 import 'react-confetti-explosion';
-import './index-f84ca259.js';
-import './index-4fef9047.js';
-import './index-f4e4bf34.js';
+import './index-f7e46130.js';
+import './index-bc30b964.js';
+import './index-653b7969.js';
 import 'react-qr-code';
-import './index-7c638818.js';
-import './useCustomDimensions-5f49ad7e.js';
-import './index-6791ad70.js';
-import './ussIsSticky-15a2c4ba.js';
-import './index-d243bb6f.js';
-import './index-b084bc0f.js';
-import './index-63f9a6c9.js';
-import './index.module-4eaf3b2f.js';
-import './index-aa5f1930.js';
-import './index-27c409ec.js';
-import './index-cc35a78b.js';
-import './index-a73425dc.js';
-import './index-f383649b.js';
+import './index-10447c01.js';
+import './useCustomDimensions-b1885ea7.js';
+import './index-3d3526cb.js';
+import './ussIsSticky-863c7e0d.js';
+import './index-8f8e1205.js';
+import './index-f2ae0148.js';
+import './index-c523a468.js';
+import './index.module-8df4c86e.js';
+import './index-c10453bb.js';
+import './index-220c34b6.js';
+import './index-e55ff884.js';
+import './index-f8607a4b.js';
+import './index-c1a3d264.js';
+import './index-b4b78a04.js';
 
 var accItem = "AccItem-2APRQ";
 var wcSize = "wcSize-dO69R";

package/build/esm/{index-abc957f0.js → index-1f8c4e28.js}

@@ -1,8 +1,8 @@
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import { useTranslation } from '@crystaldesign/diva-core';
-import Toggle from './index-d7b9d494.js';
+import Toggle from './index-745045d6.js';
 import { jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-99a52150.js → index-21ae3555.js}

@@ -1,5 +1,5 @@
 import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import classnames from 'classnames';

package/build/esm/{index-9aab04af.js → index-21c1fb93.js}

@@ -1,6 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-3d6251d6.js';
 import { useState, useEffect } from 'react';
 import { observer } from 'mobx-react-lite';
 import { useDivaCore, DivaUtils } from '@crystaldesign/diva-core';

package/build/esm/{index-aef93a42.js → index-21fd5161.js}

@@ -1,5 +1,5 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import './index-1f4ff73d.js';
+import './index-3d6251d6.js';
 import 'react';
 import DynamicMultiRender from 'react-dynamic-multi-render';
 import { jsx } from 'react/jsx-runtime';

package/build/esm/{index-27c409ec.js → index-220c34b6.js}

@@ -1,10 +1,10 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import { useState, useRef, useEffect, useCallback } from 'react';
 import { observer } from 'mobx-react-lite';
 import classnames from 'classnames';
 import { useTranslation } from '@crystaldesign/diva-core';
-import { i as loadingIcon, j as generateIcon } from './index.module-4eaf3b2f.js';
+import { i as loadingIcon, j as generateIcon } from './index.module-8df4c86e.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/defineProperty';
 import 'react-dynamic-multi-render';
@@ -172,8 +172,9 @@ var UploadItem = function UploadItem(_ref) {
     setGeneratingPromise = _useState2[1];
   var onButtonClick = function onButtonClick(e) {
     e.stopPropagation();
-    if (!item.onButtonClick) return;
-    setGeneratingPromise(item.onButtonClick(viewHandler.aiState.setHash, imageBase64));
+    if (!imageBase64) return;
+    var hash = viewHandler.aiState.setHash;
+    setGeneratingPromise(viewHandler.aiState.generateAiImageWithReferenceImages(item.key, hash, imageBase64));
   };
   var generated$1 = viewHandler.aiState.aiGeneratedRooms[item.key] !== undefined;
   var loading$1 = generatingPromise;

package/build/esm/{index-b13bee36.js → index-23a02cac.js}

@@ -1,6 +1,6 @@
-import { s as styleInject } from './index-1f4ff73d.js';
+import { s as styleInject } from './index-3d6251d6.js';
 import { observer } from 'mobx-react-lite';
-import Arrow from './index-e9aed872.js';
+import Arrow from './index-a7bdb8f2.js';
 import 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';

package/build/esm/{index-a6123c62.js → index-242e71e1.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import 'react';
 import classnames from 'classnames';
 import { useTranslation } from '@crystaldesign/diva-core';

package/build/esm/{index-7c745ab9.js → index-24766b71.js}

@@ -1,10 +1,10 @@
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-3d6251d6.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';
 import { useTranslation } from '@crystaldesign/diva-core';
-import { p as paletteItem, w as wcSize, a as wcSizeNormal, b as wcImage, t as textContainer, c as wcConfiguratorSettingsTitle } from './index.module-07c4c66a.js';
-import IsActive from './index-e985b067.js';
+import { p as paletteItem, w as wcSize, a as wcSizeNormal, b as wcImage, t as textContainer, c as wcConfiguratorSettingsTitle } from './index.module-f2cc0585.js';
+import IsActive from './index-64e1a1bd.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';

package/build/esm/{index-4d365129.js → index-24f4b1cd.js}

@@ -1,4 +1,4 @@
-import { a as usePlannerUIHandler } from './index-1f4ff73d.js';
+import { a as usePlannerUIHandler } from './index-3d6251d6.js';
 import classnames from 'classnames';
 import { observer } from 'mobx-react-lite';
 import 'react';

package/build/esm/{index-443fb6f6.js → index-26d1c61b.js}

@@ -1,4 +1,4 @@
-import { s as styleInject, u as useViewHandler } from './index-1f4ff73d.js';
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
 import classnames from 'classnames';
 import { toJS } from 'mobx';
 import { observer } from 'mobx-react-lite';

package/build/esm/index-27565a42.js

@@ -0,0 +1,175 @@
+import { s as styleInject, u as useViewHandler } from './index-3d6251d6.js';
+import 'react';
+import { Rnd } from 'react-rnd';
+import { jsxs, 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';
+
+var container = "container-efJ5C";
+var header = "header-1CJv0";
+var headerTitle = "headerTitle-uXM2j";
+var closeBtn = "closeBtn-5GDgH";
+var body = "body-x-0by";
+var bodyScroll = "bodyScroll-7BmZx";
+var css_248z = ".container-efJ5C {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\n  border-radius: 6px;\n  overflow: hidden;\n  background: #fff;\n  z-index: 1500;\n}\n\n.header-1CJv0 {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 8px 12px;\n  background: #f3f3f3;\n  border-bottom: 1px solid #e0e0e0;\n  cursor: move;\n  flex-shrink: 0;\n}\n\n.headerTitle-uXM2j {\n  font-weight: 600;\n  font-size: 14px;\n}\n\n.closeBtn-5GDgH {\n  background: none;\n  border: none;\n  font-size: 20px;\n  line-height: 1;\n  cursor: pointer;\n  padding: 0 4px;\n  color: #666;\n}\n\n.closeBtn-5GDgH:hover {\n  color: #333;\n}\n\n.body-x-0by {\n  flex: 1 1 0;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.bodyScroll-7BmZx {\n  flex: 1 1 0;\n  min-height: 0;\n  overflow-x: hidden;\n  overflow-y: auto;\n  -webkit-overflow-scrolling: touch;\n}\n\n/* Dark mode – matches backoffice (portaled to body) */\nbody.darkmode .container-efJ5C {\n  background: rgb(20, 20, 20);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);\n}\n\nbody.darkmode .header-1CJv0 {\n  background: rgb(30, 30, 30);\n  border-bottom-color: rgba(255, 255, 255, 0.12);\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .headerTitle-uXM2j {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .closeBtn-5GDgH {\n  color: rgba(255, 255, 255, 0.65);\n}\n\nbody.darkmode .closeBtn-5GDgH:hover {\n  color: rgb(255, 255, 255);\n}\n\nbody.darkmode .body-x-0by {\n  background: rgb(20, 20, 20);\n  color: rgb(255, 255, 255);\n}\n";
+styleInject(css_248z);
+
+var SNAP_THRESHOLD = 24;
+
+/** Snaps position to viewport edges when within threshold (dock-style snapping). */
+function getSnappedBounds(x, y, width, height) {
+  var vw = window.innerWidth;
+  var vh = window.innerHeight;
+  var nx = x;
+  var ny = y;
+  if (x <= SNAP_THRESHOLD) nx = 0;
+  if (x + width >= vw - SNAP_THRESHOLD) nx = Math.max(0, vw - width);
+  if (y <= SNAP_THRESHOLD) ny = 0;
+  if (y + height >= vh - SNAP_THRESHOLD) ny = Math.max(0, vh - height);
+  return {
+    x: nx,
+    y: ny
+  };
+}
+/** Resize handle styles – positioned inside the container so they are not clipped by overflow:hidden. */
+var resizeHandleStyles = {
+  top: {
+    top: 0,
+    height: 12
+  },
+  right: {
+    right: 0,
+    left: 'auto',
+    width: 12
+  },
+  bottom: {
+    bottom: 0,
+    top: 'auto',
+    height: 12
+  },
+  left: {
+    left: 0,
+    width: 12
+  },
+  topRight: {
+    top: 0,
+    right: 0,
+    left: 'auto',
+    bottom: 'auto',
+    width: 16,
+    height: 16
+  },
+  bottomRight: {
+    bottom: 0,
+    right: 0,
+    left: 'auto',
+    top: 'auto',
+    width: 16,
+    height: 16
+  },
+  bottomLeft: {
+    bottom: 0,
+    left: 0,
+    right: 'auto',
+    top: 'auto',
+    width: 16,
+    height: 16
+  },
+  topLeft: {
+    top: 0,
+    left: 0,
+    right: 'auto',
+    bottom: 'auto',
+    width: 16,
+    height: 16
+  }
+};
+var FloatingWindow = function FloatingWindow(_ref) {
+  var windowType = _ref.windowType,
+    title = _ref.title,
+    bounds = _ref.bounds,
+    children = _ref.children;
+  var viewHandler = useViewHandler();
+  var handleDragStop = function handleDragStop(_e, d) {
+    var snapped = getSnappedBounds(d.x, d.y, bounds.width, bounds.height);
+    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, snapped);
+  };
+  var handleResizeStop = function handleResizeStop(_e, _direction, ref, _delta, position) {
+    var _ref$style$width, _ref$style$height;
+    var width = parseInt((_ref$style$width = ref.style.width) !== null && _ref$style$width !== void 0 ? _ref$style$width : String(bounds.width), 10);
+    var height = parseInt((_ref$style$height = ref.style.height) !== null && _ref$style$height !== void 0 ? _ref$style$height : String(bounds.height), 10);
+    viewHandler.wysiwygDebugState.updateWysiwygWindowBounds(windowType, {
+      x: position.x,
+      y: position.y,
+      width: width,
+      height: height
+    });
+  };
+  var handleClose = function handleClose() {
+    viewHandler.wysiwygDebugState.removeWysiwygWindow(windowType);
+  };
+  return /*#__PURE__*/jsxs(Rnd, {
+    position: {
+      x: bounds.x,
+      y: bounds.y
+    },
+    size: {
+      width: bounds.width,
+      height: bounds.height
+    },
+    onDragStop: function onDragStop(e, d) {
+      return handleDragStop(e, d);
+    },
+    onResizeStop: handleResizeStop,
+    dragHandleClassName: header,
+    minWidth: 280,
+    minHeight: 200,
+    className: container,
+    style: {
+      display: 'flex',
+      flexDirection: 'column'
+    },
+    bounds: "window",
+    resizeHandleStyles: resizeHandleStyles,
+    resizeHandleWrapperStyle: {
+      zIndex: 1000
+    },
+    children: [/*#__PURE__*/jsxs("div", {
+      className: header,
+      children: [/*#__PURE__*/jsx("span", {
+        className: headerTitle,
+        children: title
+      }), /*#__PURE__*/jsx("button", {
+        type: "button",
+        className: closeBtn,
+        onClick: handleClose,
+        "aria-label": "Close",
+        children: "\xD7"
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: body,
+      children: /*#__PURE__*/jsx("div", {
+        className: bodyScroll,
+        children: children
+      })
+    })]
+  });
+};
+
+export { FloatingWindow as default };

package/build/esm/{index-d6330abc.js → index-29798f44.js}

@@ -1,12 +1,12 @@
-import { u as useViewHandler } from './index-1f4ff73d.js';
+import { u as useViewHandler } from './index-3d6251d6.js';
 import 'react';
 import classnames from 'classnames';
-import { r as row, b as columToggleName, t as title, n as name, s as sel, a as toggle } from './index.module-e7cb9056.js';
-import Toggle from './index-d7b9d494.js';
+import { r as row, b as columToggleName, t as title, n as name, s as sel, a as toggle } from './index.module-6dea17c8.js';
+import Toggle from './index-745045d6.js';
 import { getLogger } from '@crystaldesign/diva-core';
-import InfoIcon from './index-2b4ea28b.js';
-import PricePreview from './index-c4c0bdbd.js';
-import ReverseCheck from './index-a3f95cb6.js';
+import InfoIcon from './index-a5b98d98.js';
+import PricePreview from './index-541d3fca.js';
+import ReverseCheck from './index-8b5ed209.js';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/defineProperty';
@@ -25,7 +25,7 @@ import 'qrcode.react';
 import '@babel/runtime/helpers/typeof';
 import 'flat';
 import 'react-switch';
-import './index-f43408be.js';
+import './index-4fd9025b.js';
 import 'react-countup';
 import '@mui/icons-material/Block';
 import '@mui/icons-material/Warning';