kitchen-simulator 7.0.9-react-18 → 10.0.0

package/es/AppContext.js

@@ -1,6 +1,3 @@
 import React from 'react';
-var AppContext = /*#__PURE__*/React.createContext({
-  translator: null,
-  catalog: null
-});
+var AppContext = /*#__PURE__*/React.createContext({});
 export default AppContext;

package/es/LiteKitchenConfigurator.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
@@ -15,20 +16,20 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // LiteKitchenConfigurator.jsx
 import styled from 'styled-components';
+import { convert } from "./utils/convert-units-lite";
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import * as constants from "./constants";
 import { base64Decode } from "./utils/helper";
-import actions, { projectActions } from "./actions/export";
+import actions from "./actions/export";
 import Catalog from "./catalog/catalog";
 import { Content } from "./components/export";
 import Translator from "./translator/translator";
 import { objectsMap } from "./utils/objects-utils";
 import { VERSION } from "./version";
-import { handleExternalEvent } from "./utils/isolate-event-handler";
-import AppContext from "./AppContext";
+import { handleExternalEvent } from "./events/external/handleExternalEvent";
 var toolbarW = 0;
 var wrapperStyle = {
   display: 'flex',
@@ -40,9 +41,23 @@ var SubCategoryItemImage = styled.img(_templateObject2 || (_templateObject2 = _t
 });
 var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
   function LiteKitchenConfigurator(props) {
+    var _utmRequestData2, _utmRequestData3, _utmRequestData4, _utmRequestData5, _utmRequestData6, _utmRequestData7, _utmRequestData8, _utmRequestData9, _utmRequestData0;
     var _this;
     _classCallCheck(this, LiteKitchenConfigurator);
     _this = _callSuper(this, LiteKitchenConfigurator, [props]);
+    var utmDetailParams = new URLSearchParams(_this.props.location && _this.props.location.search);
+    var utmStrEncoded = utmDetailParams.get('details');
+    var utmRequestData = null;
+    if (utmStrEncoded) {
+      try {
+        var _utmRequestData;
+        utmRequestData = JSON.parse(base64Decode(utmStrEncoded));
+        utmRequestData = JSON.parse((_utmRequestData = utmRequestData) === null || _utmRequestData === void 0 ? void 0 : _utmRequestData.utm);
+      } catch (e) {
+        console.error('Cannot parse utm parameter: ', e);
+        utmRequestData = null;
+      }
+    }
     _this.state = {
       savePopupVisible: false,
       quotePopupVisible: false,
@@ -75,6 +90,17 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       isSaved: false,
       isLeaving: false
     };
+    _this.utm = {
+      utm_source: ((_utmRequestData2 = utmRequestData) === null || _utmRequestData2 === void 0 ? void 0 : _utmRequestData2.source) || 'source',
+      utm_medium: ((_utmRequestData3 = utmRequestData) === null || _utmRequestData3 === void 0 ? void 0 : _utmRequestData3.medium) || 'medium',
+      utm_campaign: ((_utmRequestData4 = utmRequestData) === null || _utmRequestData4 === void 0 ? void 0 : _utmRequestData4.campaign) || 'campaign',
+      utm_term: ((_utmRequestData5 = utmRequestData) === null || _utmRequestData5 === void 0 ? void 0 : _utmRequestData5.term) || 'term',
+      utm_content: ((_utmRequestData6 = utmRequestData) === null || _utmRequestData6 === void 0 ? void 0 : _utmRequestData6.content) || 'content',
+      gclid: ((_utmRequestData7 = utmRequestData) === null || _utmRequestData7 === void 0 ? void 0 : _utmRequestData7.gclid) || 'gclid',
+      msclkid: ((_utmRequestData8 = utmRequestData) === null || _utmRequestData8 === void 0 ? void 0 : _utmRequestData8.msclkid) || 'msclkid',
+      fbclid: ((_utmRequestData9 = utmRequestData) === null || _utmRequestData9 === void 0 ? void 0 : _utmRequestData9.fbclid) || 'fbclid',
+      ttclid: ((_utmRequestData0 = utmRequestData) === null || _utmRequestData0 === void 0 ? void 0 : _utmRequestData0.ttclid) || 'ttclid'
+    };
     _this.openFloor = _this.openFloor.bind(_this);
     _this.openCabinet = _this.openCabinet.bind(_this);
     _this.openFinishing = _this.openFinishing.bind(_this);
@@ -288,22 +314,36 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       var el = document.getElementById('add_appliances_inactive');
       if (el !== null && el !== void 0 && (_el$parentElement0 = el.parentElement) !== null && _el$parentElement0 !== void 0 && _el$parentElement0.parentElement) el.parentElement.parentElement.style.zIndex = 6;
     }
+  }, {
+    key: "getChildContext",
+    value: function getChildContext() {
+      var _this2 = this;
+      return _objectSpread(_objectSpread({}, objectsMap(actions, function (actionNamespace) {
+        return _this2.props[actionNamespace];
+      })), {}, {
+        translator: this.props.translator,
+        catalog: this.props.catalog
+      });
+    }
   }, {
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _extractedState$getIn;
       window.forRedo = [];
+      var store = this.context.store;
       var _this$props = this.props,
-        catalog = _this$props.catalog,
-        extractedState = _this$props.extractedState,
-        projectActions = _this$props.projectActions;
-      var catalogReady = extractedState === null || extractedState === void 0 || (_extractedState$getIn = extractedState.getIn) === null || _extractedState$getIn === void 0 ? void 0 : _extractedState$getIn.call(extractedState, ['catalog', 'ready']);
-      if (!catalogReady) projectActions.initCatalog(catalog);
+        stateExtractor = _this$props.stateExtractor,
+        plugins = _this$props.plugins;
+
+      // keep old behavior: run plugins once on mount
+      var newplugins = _toConsumableArray(plugins);
+      newplugins.forEach(function (newplugin) {
+        return newplugin(store, stateExtractor);
+      });
     }
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
-      var _extractedState$getIn2;
+      var _extractedState$getIn;
       var _this$props2 = this.props,
         externalEvent = _this$props2.externalEvent,
         extractedState = _this$props2.extractedState,
@@ -314,7 +354,9 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       if (prevProps.externalEvent !== externalEvent) {
         handleExternalEvent(this.props);
       }
-      var catalogReady = extractedState === null || extractedState === void 0 || (_extractedState$getIn2 = extractedState.getIn) === null || _extractedState$getIn2 === void 0 ? void 0 : _extractedState$getIn2.call(extractedState, ['catalog', 'ready']);
+
+      // same behavior: init catalog until ready
+      var catalogReady = extractedState === null || extractedState === void 0 || (_extractedState$getIn = extractedState.getIn) === null || _extractedState$getIn === void 0 ? void 0 : _extractedState$getIn.call(extractedState, ['catalog', 'ready']);
       if (!catalogReady) projectActions.initCatalog(catalog);
     }
   }, {
@@ -365,7 +407,6 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this2 = this;
       var _this$props3 = this.props,
         width = _this$props3.width,
         height = _this$props3.height,
@@ -380,15 +421,9 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
       var contentW = width - toolbarW;
       var contentH = height;
       var extracted = this.getExtractedStateWithViewer2DInit(extractedState, width, height);
-      var ctxValue = _objectSpread(_objectSpread({}, objectsMap(actions, function (actionNamespace) {
-        return _this2.props[actionNamespace];
-      })), {}, {
-        translator: this.props.translator,
-        catalog: this.props.catalog
-      });
-      return /*#__PURE__*/React.createElement(AppContext.Provider, {
-        value: ctxValue
-      }, /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("div", {
+      var firstVisit = this.state.wizardStepOpend && this.isProjectEmpty(extracted.scene);
+      var allVisible = firstVisit || signOpen || myProjectsOpen;
+      return /*#__PURE__*/React.createElement("section", null, /*#__PURE__*/React.createElement("div", {
         style: _objectSpread(_objectSpread({}, wrapperStyle), {}, {
           height: height,
           display: 'flex',
@@ -422,7 +457,7 @@ var LiteKitchenConfigurator = /*#__PURE__*/function (_Component) {
           height: 30,
           width: 30
         }
-      }), "This item is not available in the current door style. Replace it with another one."))));
+      }), "This item is not available in the current door style. Replace it with another one.")));
     }
   }]);
 }(Component);
@@ -442,6 +477,15 @@ LiteKitchenConfigurator.propTypes = {
   // ✅ injected by connect
   externalEvent: PropTypes.object
 };
+LiteKitchenConfigurator.contextTypes = {
+  store: PropTypes.object.isRequired
+};
+LiteKitchenConfigurator.childContextTypes = _objectSpread(_objectSpread({}, objectsMap(actions, function () {
+  return PropTypes.object;
+})), {}, {
+  translator: PropTypes.object,
+  catalog: PropTypes.object
+});
 LiteKitchenConfigurator.defaultProps = {
   translator: new Translator(),
   catalog: new Catalog(),

package/es/LiteRenderer.js

@@ -1,19 +1,12 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-var _excluded = ["width", "height", "configData", "externalEvent", "onInternalEvent", "onError", "onViewer2DChange"];
+var _excluded = ["width", "height", "configData", "externalEvent", "onInternalEvent", "onError", "holes"];
 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; }
 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; }
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // LiteRenderer.jsx
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import PropTypes from 'prop-types';
@@ -29,10 +22,9 @@ import AppContext from "./AppContext";
 import Catalog from "./catalog/catalog";
 import * as Areas from "./catalog/areas/area/planner-element";
 import * as Lines from "./catalog/lines/wall/planner-element";
-import * as Holes from "./catalog/holes/export";
+import { buildHoleElements, registerDynamicHoles } from "./mappings/holesToCatalog";
 import { ConsoleDebugger, Keyboard } from "./plugins/export";
 import LiteKitchenConfigurator from "./LiteKitchenConfigurator";
-import { toPlainObject } from "../es/utils/helper";
 var isBrowser = typeof window !== 'undefined';
 if (isBrowser) window.THREE = THREE;
 
@@ -81,50 +73,15 @@ function serializeError(err) {
   }
 }
 
-/* ---------- Error Boundary that pushes into buffer ---------- */
-var ToolErrorBoundary = /*#__PURE__*/function (_React$Component) {
-  function ToolErrorBoundary() {
-    _classCallCheck(this, ToolErrorBoundary);
-    return _callSuper(this, ToolErrorBoundary, arguments);
-  }
-  _inherits(ToolErrorBoundary, _React$Component);
-  return _createClass(ToolErrorBoundary, [{
-    key: "componentDidCatch",
-    value: function componentDidCatch(error, info) {
-      var pushError = this.props.pushError;
-      pushError({
-        type: 'render-error',
-        error: serializeError(error),
-        info: {
-          componentStack: info === null || info === void 0 ? void 0 : info.componentStack
-        }
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return this.props.children;
-    }
-  }]);
-}(React.Component);
-ToolErrorBoundary.propTypes = {
-  pushError: PropTypes.func.isRequired,
-  children: PropTypes.any
-};
-
 // ----------------- catalog init -----------------
 function initCatalogOnce(catalog) {
   if (!catalog) return;
-  if (catalog.__ksInitialized) return;
-  for (var x in Areas) catalog.registerElement(Areas[x]);
-  for (var _x in Lines) catalog.registerElement(Lines[_x]);
-  for (var _x2 in Holes) catalog.registerElement(Holes[_x2]);
-  catalog.registerCategory('Windows', 'Windows', [Holes.windowClear, Holes.windowCross, Holes.windowDoubleHung, Holes.windowVertical]);
-  catalog.registerCategory('Doors', 'Doors', [Holes.doorInterior, Holes.doorExterior, Holes.doorCloset, Holes.doorSliding, Holes.doorwayFramed, Holes.doorwayFrameless]);
-  catalog.__ksInitialized = true;
+  if (!catalog.__ksInitialized) {
+    for (var x in Areas) catalog.registerElement(Areas[x]);
+    for (var _x in Lines) catalog.registerElement(Lines[_x]);
+    catalog.__ksInitialized = true;
+  }
 }
-
-// ----------------- store factory -----------------
 function createInstanceStore() {
   var AppState = Map({
     KitchenConfigurator: new State()
@@ -157,10 +114,6 @@ function createInstanceStore() {
 function createPlugins() {
   return [Keyboard(), ConsoleDebugger()];
 }
-function shallowEqualViewer(a, b) {
-  if (!a || !b) return a === b;
-  return a.a === b.a && a.d === b.d && a.e === b.e && a.f === b.f && a.viewerWidth === b.viewerWidth && a.viewerHeight === b.viewerHeight && a.SVGWidth === b.SVGWidth && a.SVGHeight === b.SVGHeight;
-}
 export default function LiteRenderer(props) {
   ensureSentryInit();
   var width = props.width,
@@ -169,57 +122,23 @@ export default function LiteRenderer(props) {
     externalEvent = props.externalEvent,
     onInternalEvent = props.onInternalEvent,
     onError = props.onError,
-    onViewer2DChange = props.onViewer2DChange,
+    holes = props.holes,
     passThrough = _objectWithoutProperties(props, _excluded);
-  useEffect(function () {
-    return function () {
-      if (flushTimerRef.current) {
-        clearTimeout(flushTimerRef.current);
-        flushTimerRef.current = null;
-      }
-    };
-  }, []);
+  var holePayload = useMemo(function () {
+    return buildHoleElements(holes);
+  }, [holes]);
 
   // ✅ instance-scoped store (no module singleton)
   var storeRef = useRef(null);
   if (!storeRef.current) storeRef.current = createInstanceStore();
-  var prevRef = useRef(null);
-  useEffect(function () {
-    var _state$viewer2D2, _state$get2;
-    if (!onViewer2DChange) return;
-    if (!storeRef.current) return;
-
-    // you must have `store` in scope here (however LiteRenderer gets it)
-    var unsub = storeRef.current.subscribe(function () {
-      var _state$viewer2D, _state$get;
-      var state = storeRef.current.getState();
-
-      // viewer2D might be immutable or plain
-      var viewer2D = toPlainObject((_state$viewer2D = state.viewer2D) !== null && _state$viewer2D !== void 0 ? _state$viewer2D : (_state$get = state.get) === null || _state$get === void 0 ? void 0 : _state$get.call(state, 'viewer2D'));
-
-      // emit only when changed
-      if (!shallowEqualViewer(prevRef.current, viewer2D)) {
-        prevRef.current = viewer2D;
-        onViewer2DChange(viewer2D);
-      }
-    });
-
-    // emit once immediately
-    var state = storeRef.current.getState();
-    var viewer2D = toPlainObject((_state$viewer2D2 = state.viewer2D) !== null && _state$viewer2D2 !== void 0 ? _state$viewer2D2 : (_state$get2 = state.get) === null || _state$get2 === void 0 ? void 0 : _state$get2.call(state, 'viewer2D'));
-    prevRef.current = viewer2D;
-    onViewer2DChange(viewer2D);
-    return function () {
-      return unsub();
-    };
-  }, [onViewer2DChange]);
 
   // ✅ instance-scoped catalog (no module singleton)
   var catalogRef = useRef(null);
   if (!catalogRef.current) {
     catalogRef.current = new Catalog();
-    initCatalogOnce(catalogRef.current);
   }
+  initCatalogOnce(catalogRef.current);
+  registerDynamicHoles(catalogRef.current, holePayload);
 
   // ✅ stable plugins array
   var plugins = useMemo(function () {
@@ -355,13 +274,8 @@ export default function LiteRenderer(props) {
   var _ref = configData || {},
     logoImg = _ref.logoImg,
     companyUrl = _ref.companyUrl;
-  if (!catalogRef.current) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(Provider, {
+  return /*#__PURE__*/React.createElement(AppContext.Provider, null, /*#__PURE__*/React.createElement(Provider, {
     store: storeRef.current
-  }, /*#__PURE__*/React.createElement(ToolErrorBoundary, {
-    pushError: pushError
   }, /*#__PURE__*/React.createElement(LiteKitchenConfigurator, _extends({
     catalog: catalogRef.current,
     width: width,
@@ -395,5 +309,6 @@ LiteRenderer.propTypes = {
   externalEvent: PropTypes.object,
   onInternalEvent: PropTypes.func,
   onError: PropTypes.func,
+  holes: PropTypes.array,
   store: PropTypes.object
 };

package/es/actions/export.js

@@ -8,16 +8,29 @@ import * as verticesActions from "./vertices-actions";
 import * as itemsActions from "./items-actions";
 import * as areaActions from "./area-actions";
 import * as groupsActions from "./groups-actions";
-export { projectActions, viewer2DActions, viewer3DActions, linesActions, holesActions, sceneActions, verticesActions, itemsActions, areaActions, groupsActions };
+
+export {
+  projectActions,
+  viewer2DActions,
+  viewer3DActions,
+  linesActions,
+  holesActions,
+  sceneActions,
+  verticesActions,
+  itemsActions,
+  areaActions,
+  groupsActions
+};
+
 export default {
-  projectActions: projectActions,
-  viewer2DActions: viewer2DActions,
-  viewer3DActions: viewer3DActions,
-  linesActions: linesActions,
-  holesActions: holesActions,
-  sceneActions: sceneActions,
-  verticesActions: verticesActions,
-  itemsActions: itemsActions,
-  areaActions: areaActions,
-  groupsActions: groupsActions
-};
+  projectActions,
+  viewer2DActions,
+  viewer3DActions,
+  linesActions,
+  holesActions,
+  sceneActions,
+  verticesActions,
+  itemsActions,
+  areaActions,
+  groupsActions
+};

package/es/actions/items-actions.js

@@ -1,4 +1,5 @@
 import { TOGGLE_LOADING_CABINET, SELECT_ITEM, SELECT_TOOL_DRAWING_ITEM, UPDATE_DRAWING_ITEM, END_DRAWING_ITEM, BEGIN_DRAGGING_ITEM, BEGIN_DRAGGING_ITEM_3D, UPDATE_DRAGGING_ITEM, UPDATE_DRAGGING_ITEM_3DX, UPDATE_DRAGGING_ITEM_3DY, END_DRAGGING_ITEM, END_DRAGGING_ITEM_3D, UPDATE_DRAGGING_ITEM_CHANGED, UPDATE_ROTATING_ITEM_CHANGED, BEGIN_ROTATING_ITEM, BEGIN_ROTATING_ITEM_3D, UPDATE_ROTATING_ITEM, UPDATE_ROTATING, END_ROTATING_ITEM, END_ROTATING_ITEM_3D, REPLACE_SUBMODULE, ANIMATE_OBJECT, REMOVE_REPLACE_SUBMODULE, ITEM_MOVE_UP, SELECT_TOOL_DRAWING_ITEM_3D, SET_DOOR_STYLE, SET_HANDLE_MATERIAL, SET_INITIAL_DOOR_STYLE, SET_DISTANT, SET_DOOR_HANDLE, SET_WALL_COLOR, END_CREATING_CABINET, UPDATE_POPUP_OPEN, SET_MODELLING, SET_COUNTER_TOP, SET_BACKSPLASH, SET_BACKSPLASH_VISIBLE, SET_APPLIANCE_MATERIAL, DUPLICATE_SELECTED, EDIT_WIDTH, END_LOADING, STORE_DIST_ARRAY, SET_MOLDING, UPDATE_MOLDING, VALIDATE_ITEM_POSTIONS, REPLACE_ITEM, SET_MOVE_STATUS, SET_ROTATE_STATUS } from "../constants";
+import { SET_ITEMS_CCDF } from "../constants";
 export function storeDistArray(layerID, itemID, distArray) {
   return {
     type: STORE_DIST_ARRAY,
@@ -227,12 +228,13 @@ export function updateItemsAltitude(layerID, itemID, value) {
     value: value
   };
 }
-export function setDoorStyle(doorStyle, itemCDS, isAll) {
+export function setDoorStyle(doorStyle, itemCDS, applyScope, itemIds) {
   return {
     type: SET_DOOR_STYLE,
     doorStyle: doorStyle,
     itemCDS: itemCDS,
-    isAll: isAll
+    applyScope: applyScope,
+    itemIds: itemIds
   };
 }
 export function setCounterTop(counterTop) {
@@ -313,4 +315,18 @@ export function setRotateStatus(status) {
     type: SET_ROTATE_STATUS,
     status: status
   };
+}
+
+// Persist selected ccdf onto placed scene items (instances) so SYNC can return it.
+// ccdf_list entries are matched by `door_finish_id` (== doorStyle.id).
+export function setItemsCCDF(ccdf_list, applyScope) {
+  var itemIds = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+  var doorFinishId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+  return {
+    type: SET_ITEMS_CCDF,
+    ccdf_list: ccdf_list,
+    applyScope: applyScope,
+    itemIds: itemIds,
+    doorFinishId: doorFinishId
+  };
 }

package/es/analytics/ga4.js

@@ -0,0 +1,188 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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; }
+import ReactGA from 'react-ga4';
+
+// ---------- Helpers ----------
+function nowMs() {
+  return Date.now();
+}
+function getClientName() {
+  return sessionStorage.getItem('visualizerName');
+}
+function isDesktopUA() {
+  // Lightweight heuristic; GA4 also provides device.category. This flag can help ad-hoc filtering.
+  var ua = navigator.userAgent.toLowerCase();
+  var isMobile = /mobi|android|iphone|ipad|ipod|windows phone/.test(ua);
+  return !isMobile;
+}
+
+// ---------- Keys for storage ----------
+var SSN_KEYS = {
+  sessionStartMs: 'ga4_session_start_ms',
+  introChoiceMs: 'ga4_intro_choice_ms',
+  firstCabinetPlaced: 'ga4_first_cabinet_placed',
+  contextBooted: 'ga4_context_booted',
+  enteredCanvasSent: 'ga4_entered_canvas_sent'
+};
+
+// ---------- Core GA wrapper ----------
+export var GA = {
+  init: function init(_ref) {
+    var measurementId = _ref.measurementId;
+    ReactGA.initialize([{
+      trackingId: measurementId
+    }], {
+      testMode: false
+    });
+  },
+  resetSessionKeys: function resetSessionKeys() {
+    Object.values(SSN_KEYS).forEach(function (key) {
+      sessionStorage.removeItem(key);
+    });
+  },
+  /**
+   * Must be called ONCE per page load, *before* other events.
+   * Sets user properties (project_entry, cross_auth) and sends an initial page_view with client_name.
+   */
+  bootSessionContext: function bootSessionContext(_ref2) {
+    var projectEntry = _ref2.projectEntry,
+      crossAuth = _ref2.crossAuth;
+    try {
+      var resolvedClient = getClientName();
+
+      // Persist session start for timing metrics (if not already set for this tab)
+      if (!sessionStorage.getItem(SSN_KEYS.sessionStartMs)) {
+        sessionStorage.setItem(SSN_KEYS.sessionStartMs, String(nowMs()));
+      }
+
+      // Mark context as booted to avoid duplicate property sets on hot reloads
+      if (!sessionStorage.getItem(SSN_KEYS.contextBooted)) {
+        sessionStorage.setItem(SSN_KEYS.contextBooted, '1');
+
+        // Set GA4 user_properties (user-scoped dimensions)
+        ReactGA.gtag('set', 'user_properties', {
+          project_entry: projectEntry,
+          // user scope dimension
+          cross_auth: crossAuth // user scope dimension (boolean serialized)
+        });
+      }
+
+      // Send first page_view hit enriched with event-scoped client_name
+      ReactGA.send({
+        hitType: 'pageview',
+        page: window.location.pathname + window.location.search,
+        // @ts-expect-error react-ga4 passes along additional params into gtag
+        client_name: resolvedClient
+      });
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.warn('GA.bootSessionContext error', e);
+    }
+  },
+  // Utility to derive cross_auth from URL (token or details query params)
+  deriveCrossAuthFromUrl: function deriveCrossAuthFromUrl(search) {
+    var sp = new URLSearchParams(search);
+    return sp.has('token') || sp.has('details');
+  },
+  // Utility to derive project entry (best-effort). You can also pass explicitly from router logic.
+  deriveProjectEntry: function deriveProjectEntry() {
+    var projectId = sessionStorage.getItem('projectId');
+
+    // If a project id exists, consider it "open_existing"; otherwise fallback to "new"
+    if (projectId) return 'open_existing';
+    return 'new';
+  },
+  // ---------- Event API ----------
+  events: {
+    /**
+     * intro_choice(option) — records the user's entry choice.
+     * Also stores a timestamp for later time_to_canvas calculation.
+     */
+    introChoice: function introChoice(option, extra) {
+      var client_name = getClientName();
+      sessionStorage.setItem(SSN_KEYS.introChoiceMs, String(nowMs()));
+      ReactGA.event('intro_choice', _objectSpread({
+        client_name: client_name,
+        option: option
+      }, extra || {}));
+    },
+    /**
+     * entered_canvas(time_to_canvas) — compute (now - intro_choice)
+     */
+    enteredCanvas: function enteredCanvas() {
+      // fire only once per tab/session
+      if (sessionStorage.getItem(SSN_KEYS.enteredCanvasSent)) return;
+      var client_name = getClientName();
+      var introMs = Number(sessionStorage.getItem(SSN_KEYS.introChoiceMs) || 0);
+      var timeSec = introMs ? Math.max(0, Math.round((Date.now() - introMs) / 1000)) : undefined;
+      ReactGA.event('entered_canvas', _objectSpread({
+        client_name: client_name
+      }, typeof timeSec === 'number' ? {
+        time_to_canvas: timeSec
+      } : {}));
+      sessionStorage.setItem(SSN_KEYS.enteredCanvasSent, '1'); // 👈 lock it
+    },
+    /**
+     * cabinet_placed(time_to_first_cabinet) — send only for the *first* cabinet of the session.
+     */
+    cabinetPlaced: function cabinetPlaced() {
+      var already = sessionStorage.getItem(SSN_KEYS.firstCabinetPlaced);
+      var client_name = getClientName();
+      var params = {
+        client_name: client_name
+      };
+      if (!already) {
+        var startMs = Number(sessionStorage.getItem(SSN_KEYS.sessionStartMs) || 0);
+        var timeSec = startMs ? Math.max(0, Math.round((nowMs() - startMs) / 1000)) : undefined;
+        if (typeof timeSec === 'number') params.time_to_first_cabinet = timeSec; // custom metric (seconds)
+        sessionStorage.setItem(SSN_KEYS.firstCabinetPlaced, '1');
+      }
+      ReactGA.event('cabinet_placed', params);
+    },
+    /**
+     * door_changed(door_id)
+     */
+    doorChanged: function doorChanged(door_id) {
+      var client_name = getClientName();
+      ReactGA.event('door_changed', {
+        client_name: client_name,
+        door_id: door_id
+      });
+    },
+    /**
+     * project_saved(project_id, save_method) — mark as conversion in GA UI.
+     */
+    projectSaved: function projectSaved(project_id, save_method) {
+      var client_name = getClientName();
+      ReactGA.event('project_saved', {
+        client_name: client_name,
+        project_id: project_id,
+        save_method: save_method
+      });
+    },
+    /**
+     * assistance_requested(method, project_id) — mark as conversion in GA UI.
+     */
+    assistanceRequested: function assistanceRequested(method, project_id) {
+      var client_name = getClientName();
+      ReactGA.event('assistance_requested', {
+        client_name: client_name,
+        method: method,
+        project_id: project_id
+      });
+    },
+    /**
+     * add_to_cart(project_id, sku_count, price_total) — mark as conversion in GA UI.
+     */
+    addToCart: function addToCart(project_id, sku_count, price_total) {
+      var client_name = getClientName();
+      ReactGA.event('add_to_cart', {
+        client_name: client_name,
+        project_id: project_id,
+        sku_count: sku_count,
+        price_total: price_total
+      });
+    }
+  }
+};