@buerli.io/react-cad 0.0.23-beta.2 → 0.0.24-beta.0

package/build/index.cjs.js

@@ -27,7 +27,7 @@ var guid = require('uuid');
 var shallow = require('zustand/shallow');
 var threeStdlib = require('three-stdlib');
 var SelectImpl = require('antd/lib/select');
-var path = require('path');
+var pathBrowserify = require('path-browserify');
 var reactUid = require('react-uid');
 var deepmerge = require('deepmerge');
 var reactSortableHoc = require('react-sortable-hoc');
@@ -1667,6 +1667,25 @@ class ErrorBoundary extends React.Component {
 
 }
 
+const EMPTYARRAY = [];
+const NOCCID = Number.MIN_SAFE_INTEGER;
+const EMPTYSTR = '';
+
+function useDrawingArr(drawingId, selector) {
+  const res = react.useDrawing(drawingId, selector);
+  return res || EMPTYARRAY;
+}
+
+function useDrawingCCId(drawingId, selector) {
+  const res = react.useDrawing(drawingId, selector);
+  return res || NOCCID;
+}
+
+function useDrawingStr(drawingId, selector) {
+  const res = react.useDrawing(drawingId, selector);
+  return res || EMPTYSTR;
+}
+
 /**
  * !!! Important !!!
  *
@@ -1702,11 +1721,11 @@ function useDrawingVerifier(drawingId, warnings) {
   }
 }
 function useCurProductVerifier(drawingId, warnings) {
-  const currProdId = react.useDrawing(drawingId, d => {
+  const currProdId = useDrawingCCId(drawingId, d => {
     var _d$structure;
 
     return d == null ? void 0 : (_d$structure = d.structure) == null ? void 0 : _d$structure.currentProduct;
-  }) || -1;
+  });
   const currProdExists = react.useDrawing(drawingId, d => {
     var _d$structure2, _d$structure2$tree$cu;
 
@@ -1722,11 +1741,11 @@ function useCurProductVerifier(drawingId, warnings) {
   }
 }
 function useCurNodeVerifier(drawingId, warnings) {
-  const currNodeId = react.useDrawing(drawingId, d => {
+  const currNodeId = useDrawingCCId(drawingId, d => {
     var _d$structure3;
 
     return d == null ? void 0 : (_d$structure3 = d.structure) == null ? void 0 : _d$structure3.currentNode;
-  }) || -1;
+  });
   const currNodeExists = react.useDrawing(drawingId, d => {
     var _d$structure4;
 
@@ -1742,11 +1761,11 @@ function useCurNodeVerifier(drawingId, warnings) {
   }
 }
 function useRootVerifier(drawingId, warnings) {
-  const rootId = react.useDrawing(drawingId, d => {
+  const rootId = useDrawingCCId(drawingId, d => {
     var _d$structure5;
 
     return d == null ? void 0 : (_d$structure5 = d.structure) == null ? void 0 : _d$structure5.root;
-  }) || -1;
+  });
   const rootExists = react.useDrawing(drawingId, d => {
     var _d$structure6;
 
@@ -1762,21 +1781,21 @@ function useRootVerifier(drawingId, warnings) {
   }
 }
 function useRootOrProdVerifier(drawingId, warnings) {
-  const rootId = react.useDrawing(drawingId, d => {
+  const rootId = useDrawingCCId(drawingId, d => {
     var _d$structure7;
 
     return d == null ? void 0 : (_d$structure7 = d.structure) == null ? void 0 : _d$structure7.root;
-  }) || -1;
+  });
   const rootExists = react.useDrawing(drawingId, d => {
     var _d$structure8;
 
     return Boolean(d == null ? void 0 : (_d$structure8 = d.structure) == null ? void 0 : _d$structure8.tree[rootId]);
   });
-  const currProdId = react.useDrawing(drawingId, d => {
+  const currProdId = useDrawingCCId(drawingId, d => {
     var _d$structure9;
 
     return d == null ? void 0 : (_d$structure9 = d.structure) == null ? void 0 : _d$structure9.currentProduct;
-  }) || -1;
+  });
   const currProdExists = react.useDrawing(drawingId, d => {
     var _d$structure10, _d$structure10$tree$c;
 
@@ -1792,11 +1811,11 @@ function useRootOrProdVerifier(drawingId, warnings) {
   }
 }
 function usePluginObjVerifier(drawingId, pluginId, warnings) {
-  const objectId = react.usePlugin(drawingId, pluginId, p => p == null ? void 0 : p.objectId);
+  const objectId = react.usePlugin(drawingId, pluginId, p => p == null ? void 0 : p.objectId) || NOCCID;
   const objectExists = react.useDrawing(drawingId, d => {
     var _d$structure11;
 
-    return Boolean(d == null ? void 0 : (_d$structure11 = d.structure) == null ? void 0 : _d$structure11.tree[objectId || -1]);
+    return Boolean(d == null ? void 0 : (_d$structure11 = d.structure) == null ? void 0 : _d$structure11.tree[objectId]);
   });
 
   if (!objectExists) {
@@ -1809,7 +1828,7 @@ function usePluginObjVerifier(drawingId, pluginId, warnings) {
 }
 function usePartAndAssemblyContVerifier(drawingId, warnings) {
   // <<< Code below is a copypaste from `useAllObjects` hook. Check comment in the beginnig of the file.
-  const root = react.useDrawing(drawingId, d => {
+  const root = useDrawingCCId(drawingId, d => {
     var _d$structure12;
 
     return d == null ? void 0 : (_d$structure12 = d.structure) == null ? void 0 : _d$structure12.root;
@@ -1817,7 +1836,7 @@ function usePartAndAssemblyContVerifier(drawingId, warnings) {
   const rootExists = react.useDrawing(drawingId, d => {
     var _d$structure13;
 
-    return Boolean(d == null ? void 0 : (_d$structure13 = d.structure) == null ? void 0 : _d$structure13.tree[root || core.NOID]);
+    return Boolean(d == null ? void 0 : (_d$structure13 = d.structure) == null ? void 0 : _d$structure13.tree[root]);
   });
   const allObjId = React.useMemo(() => {
     const drawing = core.getDrawing(drawingId);
@@ -1850,7 +1869,7 @@ function usePartAndAssemblyContVerifier(drawingId, warnings) {
     var _getDrawing, _getDrawing$structure, _getDrawing$structure2;
 
     return ((_getDrawing = core.getDrawing(drawingId)) == null ? void 0 : (_getDrawing$structure = _getDrawing.structure) == null ? void 0 : (_getDrawing$structure2 = _getDrawing$structure.tree[id]) == null ? void 0 : _getDrawing$structure2.class) === classcad.CCClasses.CCPartContainer;
-  }) || -1;
+  }) || NOCCID;
   const partContExists = react.useDrawing(drawingId, d => {
     var _d$structure15;
 
@@ -1860,7 +1879,7 @@ function usePartAndAssemblyContVerifier(drawingId, warnings) {
     var _getDrawing$structure3, _getDrawing$structure4;
 
     return ((_getDrawing$structure3 = core.getDrawing(drawingId).structure) == null ? void 0 : (_getDrawing$structure4 = _getDrawing$structure3.tree[id]) == null ? void 0 : _getDrawing$structure4.class) === classcad.CCClasses.CCAssemblyContainer;
-  }) || -1;
+  }) || NOCCID;
   const asmContExists = react.useDrawing(drawingId, d => {
     var _d$structure16;
 
@@ -1876,16 +1895,16 @@ function usePartAndAssemblyContVerifier(drawingId, warnings) {
   }
 }
 function useExprSetVerifier(drawingId, warnings) {
-  const productId = react.useDrawing(drawingId, d => {
+  const productId = useDrawingCCId(drawingId, d => {
     var _d$structure17;
 
     return d == null ? void 0 : (_d$structure17 = d.structure) == null ? void 0 : _d$structure17.currentProduct;
-  }) || -1;
-  const exprSetId = react.useDrawing(drawingId, d => {
+  });
+  const exprSetId = useDrawingCCId(drawingId, d => {
     var _d$structure18, _d$structure18$tree$p;
 
     return d == null ? void 0 : (_d$structure18 = d.structure) == null ? void 0 : (_d$structure18$tree$p = _d$structure18.tree[productId]) == null ? void 0 : _d$structure18$tree$p.expressionSet;
-  }) || -1;
+  });
   const exprSetExists = react.useDrawing(drawingId, d => {
     var _d$structure19;
 
@@ -2112,7 +2131,7 @@ function _objectSpread$j(target) { for (var i = 1; i < arguments.length; i++) {
 const MateScope = 'HLConstraintScope';
 const createMateItem = (matePath, csys, flip, reoriented) => {
   return {
-    id: `Mate|${matePath.toString()}|${csys.id}`,
+    id: `Mate|${matePath.toString()}|${csys.id}|(${flip},${reoriented})`,
     scope: MateScope,
     data: {
       matePath,
@@ -2906,24 +2925,15 @@ const MateEditor = ({
     defaults
   } = param;
   const [matePath, csysId, flipState, reorientedState] = userValue;
+  const isSelected = matePath !== undefined && csysId !== undefined;
   const [selectorId, setSelectorId] = React.useState();
-  const selectedItem = react.useDrawing(drawingId, drawing => selectorId && drawing.selection.refs[selectorId].items[0]);
-  const [needRestore, setNeedRestore] = React.useState(!(!matePath && !csysId)); // Updating refs and values in the plugin store and switching to the next selector.
-
-  React.useEffect(() => {
-    const matePath_ = selectedItem == null ? void 0 : selectedItem.data.matePath;
-    const csysId_ = selectedItem == null ? void 0 : selectedItem.data.csys.id;
-    const flipState_ = selectedItem == null ? void 0 : selectedItem.data.flip;
-    const reorientedState_ = selectedItem == null ? void 0 : selectedItem.data.reoriented;
-
-    if (matePath_ && csysId_) {
-      setUserValue([matePath_, csysId_, flipState_, reorientedState_]);
-
-      if (selectorId !== undefined) {
-        selectorsOrder ? selectorsOrder.switchToNext(selectorId) : core.getDrawing(drawingId).api.selection.activateSelector(null);
-      }
-    }
-  }, [setUserValue, selectedItem, drawingId, selectorsOrder, selectorId]); // Update the selected item with changed flip / reoriented value(s)
+  const setMateParam = React.useCallback(selItem => {
+    const matePath_ = selItem == null ? void 0 : selItem.data.matePath;
+    const csysId_ = selItem == null ? void 0 : selItem.data.csys.id;
+    const flipState_ = (selItem == null ? void 0 : selItem.data.flip) !== undefined ? selItem == null ? void 0 : selItem.data.flip : classcad.FlipType.FLIP_Z;
+    const reorientedState_ = (selItem == null ? void 0 : selItem.data.reoriented) !== undefined ? selItem == null ? void 0 : selItem.data.reoriented : classcad.ReorientedType.REORIENTED_0;
+    setUserValue([matePath_, csysId_, flipState_, reorientedState_]);
+  }, [setUserValue]); // Update the selected item with changed flip / reoriented value(s)
   // TODO: Don't store flip / reoriented states inside the selector state at all?
 
   const setOrientation = React.useCallback(({
@@ -2936,11 +2946,9 @@ const MateEditor = ({
       const flip_ = flip !== undefined ? flip : selMate.data.flip;
       const reoriented_ = reoriented !== undefined ? reoriented : selMate.data.reoriented;
       const newItem = createMateItem(selMate.data.matePath, selMate.data.csys, flip_, reoriented_);
-      reoriented !== undefined && (newItem.data.reoriented = reoriented);
-      const selectionActions = core.getDrawing(drawingId).api.selection;
-      selectionActions.setItems(selectorId, [newItem]);
+      setMateParam(newItem);
     }
-  }, [drawingId, selectorId]);
+  }, [drawingId, setMateParam, selectorId]);
   const setFlip = React.useCallback(value => {
     setOrientation({
       flip: value
@@ -2970,15 +2978,25 @@ const MateEditor = ({
   React.useEffect(() => {
     setValidateF(validatorWrapper, 1);
     return () => setValidateF(null, 1);
-  }, [validatorWrapper, setValidateF]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, needRestore && /*#__PURE__*/React.createElement(MateRestorer, {
+  }, [validatorWrapper, setValidateF]); // Function which will be called when user clicks on the mate csys
+
+  const customSetter = React.useCallback((selId, items) => {
+    //Change reference in the param
+    setMateParam(items[0]); // If items len === 0 selector should not be switched
+
+    if (items.length !== 0) {
+      selectorsOrder ? selectorsOrder.switchToNext(selId) : core.getDrawing(drawingId).api.selection.activateSelector(null);
+    }
+  }, // TODO: there is dependency array, but customSelect will be used in Selection once on selector creating.
+  [drawingId, selectorsOrder, setMateParam]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MateRestorer, {
     drawingId: drawingId,
     matePath: matePath,
     csysId: csysId,
     flip: flipState,
     reoriented: reorientedState,
     selectorId: selectorId,
-    setNeedRestore: setNeedRestore
+    setMateParam: setMateParam
   }), /*#__PURE__*/React.createElement(Wrapper, {
     caption: caption,
     highlighted: param.isChanged()
@@ -2986,13 +3004,17 @@ const MateEditor = ({
     drawingId: drawingId,
     filter: mateFilter,
     onCreated: setSelectorId,
-    maxLen: 1
+    maxLen: 1,
+    customSelect: customSetter,
+    customUnSelect: customSetter
   }), /*#__PURE__*/React.createElement(MateFlip, {
     flipState: flipState,
-    setFlipState: setFlip
+    setFlipState: setFlip,
+    disabled: !isSelected
   }), /*#__PURE__*/React.createElement(MateReorient, {
     reorientedState: reorientedState,
-    setReorientedState: setReoriented
+    setReorientedState: setReoriented,
+    disabled: !isSelected
   }))));
 };
 
@@ -3003,7 +3025,7 @@ const MateRestorer = ({
   flip,
   reoriented,
   selectorId,
-  setNeedRestore
+  setMateParam
 }) => {
   const selItems = React.useMemo(() => {
     if (!matePath || !csysId) {
@@ -3016,10 +3038,14 @@ const MateRestorer = ({
   }, [drawingId, matePath, csysId, flip, reoriented]);
   React.useEffect(() => {
     if (!selectorId) return;
-    const selectionActions = core.getDrawing(drawingId).api.selection;
-    selectionActions.setItems(selectorId, selItems);
-    setNeedRestore(false);
-  }, [drawingId, selItems, setNeedRestore, selectorId]);
+    const selector = core.getDrawing(drawingId).selection.refs[selectorId];
+    const selApi = core.getDrawing(drawingId).api.selection;
+
+    if (!selApi.areItemsSelected(selItems, selectorId) || selItems.length !== selector.items.length) {
+      setMateParam(selItems[0]);
+      selApi.setItems(selectorId, selItems);
+    }
+  }, [drawingId, selItems, setMateParam, selectorId]);
   return null;
 };
 
@@ -3064,7 +3090,8 @@ const flipStates = {
 
 const MateFlip = ({
   flipState,
-  setFlipState
+  setFlipState,
+  disabled = false
 }) => {
   const {
     Group,
@@ -3083,7 +3110,8 @@ const MateFlip = ({
     value: flipState,
     onChange: onChange,
     showArrow: false,
-    bordered: false
+    bordered: false,
+    disabled: disabled
   }, flipTypes.map(flip => /*#__PURE__*/React.createElement(Select.Option, {
     key: flip,
     value: flip,
@@ -3106,7 +3134,8 @@ const reorientedTypes = [classcad.ReorientedType.REORIENTED_0, classcad.Reorient
 
 const MateReorient = ({
   reorientedState,
-  setReorientedState
+  setReorientedState,
+  disabled = false
 }) => {
   const {
     Group,
@@ -3125,7 +3154,8 @@ const MateReorient = ({
     value: reorientedState,
     onChange: onChange,
     showArrow: false,
-    bordered: false
+    bordered: false,
+    disabled: disabled
   }, reorientedTypes.map(reoriented => /*#__PURE__*/React.createElement(Select.Option, {
     key: reoriented,
     value: reoriented,
@@ -5641,7 +5671,6 @@ var index$g = /*#__PURE__*/Object.freeze({
   description: description$g
 });
 
-const UNDEFINEDID = -1;
 // TODO use it as key in object
 // TODO: move to view/handlers ?
 let HandlersList;
@@ -5841,7 +5870,7 @@ const initialState = {
   handlers: {},
   tmpObjects: {},
   selected: [],
-  hovered: UNDEFINEDID,
+  hovered: NOCCID,
   highlighted: [],
   scale: 1,
   step: 1,
@@ -6114,7 +6143,7 @@ const unhover = (drawingId, pluginId, hoveredId) => {
     const highlighted = state_.highlighted;
     const highlightedConstraints = highlighted.filter(id => is2DConstraint(tree[id]));
     return {
-      hovered: state_.hovered === hoveredId ? UNDEFINEDID : state_.hovered,
+      hovered: state_.hovered === hoveredId ? NOCCID : state_.hovered,
       highlighted: highlightedConstraints
     };
   });
@@ -6226,7 +6255,7 @@ const snapToGrid = mousePosition => {
 
 const snapPoint = point => {
   let snapResult = {
-    objId: UNDEFINEDID,
+    objId: NOCCID,
     distance: snapDistance,
     point: new THREE__namespace.Vector3()
   };
@@ -6246,7 +6275,7 @@ const snapPoint = point => {
     }
   });
 
-  if (snapResult.objId !== UNDEFINEDID) {
+  if (snapResult.objId !== NOCCID) {
     return snapResult.point;
   } else {
     return snapToGrid(point);
@@ -6373,7 +6402,7 @@ function Drag(drawingId, pluginId, camControls) {
   let isRectSelectionActive = false;
   let rectClickPoint = new THREE__namespace.Vector3();
   let rectSelected = [];
-  let pressedId = UNDEFINEDID;
+  let pressedId = NOCCID;
   let moveFrom = new THREE__namespace.Vector3();
   let promise = null;
   let defferedDiff = null;
@@ -6426,7 +6455,7 @@ function Drag(drawingId, pluginId, camControls) {
   };
 
   const deleteHandler = () => {
-    if (pressedId !== UNDEFINEDID) {
+    if (pressedId !== NOCCID) {
       return;
     }
 
@@ -6461,7 +6490,7 @@ function Drag(drawingId, pluginId, camControls) {
 
       isRectSelectionActive = true;
       rectClickPoint = e.point.project(e.camera);
-      pressedId = UNDEFINEDID;
+      pressedId = NOCCID;
       camControls.enabled = false;
       e.target.setPointerCapture(e.pointerId);
       e.stopPropagation();
@@ -6470,13 +6499,13 @@ function Drag(drawingId, pluginId, camControls) {
           min: rectClickPoint.clone(),
           max: rectClickPoint.clone()
         },
-        hovered: UNDEFINEDID
+        hovered: NOCCID
       });
       return;
     }
 
     if (pressedObj.class === classcad.CCClasses.CCSketch) {
-      pressedId = UNDEFINEDID;
+      pressedId = NOCCID;
       return;
     }
 
@@ -6518,7 +6547,7 @@ function Drag(drawingId, pluginId, camControls) {
     }
 
     if (isMoved === false) {
-      if (pressedId === UNDEFINEDID) {
+      if (pressedId === NOCCID) {
         clearSelection();
         return;
       }
@@ -6528,7 +6557,7 @@ function Drag(drawingId, pluginId, camControls) {
 
     clearIgnoreList();
     clearDraggedPoints();
-    pressedId = UNDEFINEDID;
+    pressedId = NOCCID;
     e.target.releasePointerCapture(e.pointerId);
     e.stopPropagation();
   };
@@ -6596,7 +6625,7 @@ function Drag(drawingId, pluginId, camControls) {
       return;
     }
 
-    if (pressedId === UNDEFINEDID) return;
+    if (pressedId === NOCCID) return;
     const pressedObj = core.getDrawing(drawingId).structure.tree[pressedId];
     if (is2DConstraint(pressedObj)) return;
     const intersectionPosition = getPointOnPlane(e.unprojectedPoint, e.camera, getGlobalToLocalMatrix(drawingId, sketchId));
@@ -6736,7 +6765,7 @@ function DrawLine(drawingId, pluginId) {
   const sketchId = core.getPlugin(drawingId, pluginId).objectId; // Local state:
 
   let firstPointIsSet = false;
-  let lastAddedEndPointId = UNDEFINEDID;
+  let lastAddedEndPointId = NOCCID;
   let isMoved = false;
   let promise = null;
   const tmpStartPId = guid();
@@ -6760,7 +6789,7 @@ function DrawLine(drawingId, pluginId) {
 
   const destructor = () => {
     firstPointIsSet = false;
-    lastAddedEndPointId = UNDEFINEDID;
+    lastAddedEndPointId = NOCCID;
     set({
       tmpObjects: {},
       mousePos: undefined
@@ -6777,7 +6806,7 @@ function DrawLine(drawingId, pluginId) {
       return true;
     } else {
       firstPointIsSet = false;
-      lastAddedEndPointId = UNDEFINEDID;
+      lastAddedEndPointId = NOCCID;
       set(state => ({
         tmpObjects: {
           [tmpEndPId]: state.tmpObjects[tmpEndPId]
@@ -6825,7 +6854,7 @@ function DrawLine(drawingId, pluginId) {
       const startPos = tmpObjects[tmpStartPId].position.clone();
       const endPos = tmpObjects[tmpEndPId].position.clone();
 
-      if (lastAddedEndPointId === UNDEFINEDID) {
+      if (lastAddedEndPointId === NOCCID) {
         promise = classcad.ccAPI.sketcher.addGeometry(drawingId, sketchId, 'Line', [startPos, endPos], {
           fixation: true,
           incidence: true,
@@ -7273,7 +7302,7 @@ function DrawArc(drawingId, pluginId, arcType) {
   const sketch = core.getDrawing(drawingId).structure.tree[sketchId]; // Local state:
 
   let additionIndex = 0;
-  let lastAddedEndPointId = UNDEFINEDID;
+  let lastAddedEndPointId = NOCCID;
   let isMoved = false;
   let tangent = new THREE__namespace.Vector3();
   let lastMousePos = new THREE__namespace.Vector3();
@@ -7300,7 +7329,7 @@ function DrawArc(drawingId, pluginId, arcType) {
 
   const destructor = () => {
     additionIndex = 0;
-    lastAddedEndPointId = UNDEFINEDID;
+    lastAddedEndPointId = NOCCID;
     set({
       tmpObjects: {},
       mousePos: undefined
@@ -7317,7 +7346,7 @@ function DrawArc(drawingId, pluginId, arcType) {
       return true;
     } else if (additionIndex === 1 || additionIndex === 2 && arcType === HandlersList.DRAWARCTANGENT) {
       additionIndex = 0;
-      lastAddedEndPointId = UNDEFINEDID;
+      lastAddedEndPointId = NOCCID;
       set(state => {
         const tmpStartP = _objectSpread$b(_objectSpread$b({}, state.tmpObjects[tmpStartPId]), {}, {
           position: lastMousePos.clone()
@@ -7521,7 +7550,7 @@ function DrawArc(drawingId, pluginId, arcType) {
         radius: 1
       }); // calculateMidPoint(startPos, endPos, centerPos, clockwise)
 
-      if (lastAddedEndPointId === UNDEFINEDID) {
+      if (lastAddedEndPointId === NOCCID) {
         promise = classcad.ccAPI.sketcher.addGeometry(drawingId, sketchId, 'Arc', [startPos, midInfo.mid, endPos], {
           fixation: true,
           incidence: true,
@@ -8509,7 +8538,7 @@ function Trim(drawingId, pluginId) {
 
   const onPointerOut = e => {
     set({
-      hovered: UNDEFINEDID,
+      hovered: NOCCID,
       highlighted: []
     });
     e.stopPropagation();
@@ -8750,7 +8779,7 @@ const getOriginByPoint = (drawingId, pointId, objectIds) => {
 
 const getDefaultOriginId = (drawingId, objectIds) => {
   const tree = core.getDrawing(drawingId).structure.tree;
-  let originId = UNDEFINEDID;
+  let originId = NOCCID;
   let currentMinPos = new THREE__namespace.Vector3(Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY, 0.0);
   objectIds.forEach(objId => {
     const object = tree[objId];
@@ -8916,7 +8945,7 @@ const CircPattern = () => {
     }
 
     const tree = core.getDrawing(drawingId).structure.tree;
-    const selectedOrigin = originId !== UNDEFINEDID ? tree[originId] : undefined;
+    const selectedOrigin = originId !== NOCCID ? tree[originId] : undefined;
     const rotationOriginPoint = selectedOrigin ? convertToVector(selectedOrigin.members.pos) : new THREE__namespace.Vector3(0.0, 0.0, 0.0);
     const angleStep = degreesToRadians(angle);
     classcad.ccAPI.sketcher.copyCircularPattern(drawingId, sketchId, rigidSetId, rotationOriginPoint, angleStep, numSteps - 1).then(() => {
@@ -10807,14 +10836,14 @@ core.api.subscribe(drawingIds => {
 }, state => state.drawing.ids); //#endregion buerli store subscription
 
 const useCurrentProduct = drawingId => {
-  const currProdId = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const currProd = react.useDrawing(drawingId, d => d.structure.tree[currProdId || -1]);
+  const currProdId = useDrawingCCId(drawingId, d => d.structure.currentProduct);
+  const currProd = react.useDrawing(drawingId, d => d.structure.tree[currProdId]);
   return currProd;
 };
 
 const useCurrentNode = drawingId => {
-  const currNodeId = react.useDrawing(drawingId, d => d.structure.currentNode);
-  const currNode = react.useDrawing(drawingId, d => d.structure.tree[currNodeId || -1]);
+  const currNodeId = useDrawingCCId(drawingId, d => d.structure.currentNode);
+  const currNode = react.useDrawing(drawingId, d => d.structure.tree[currNodeId]);
   return currNode;
 };
 
@@ -10827,17 +10856,17 @@ let EditMode;
 })(EditMode || (EditMode = {}));
 
 const useEditMode = drawingId => {
-  const rootId = react.useDrawing(drawingId, d => d.structure.root);
-  const currProdId = react.useDrawing(drawingId, d => d.structure.currentProduct);
+  const rootId = useDrawingCCId(drawingId, d => d.structure.root);
+  const currProdId = useDrawingCCId(drawingId, d => d.structure.currentProduct);
   const rootClass = react.useDrawing(drawingId, d => {
-    var _d$structure$tree;
+    var _d$structure$tree$roo;
 
-    return (_d$structure$tree = d.structure.tree[rootId || -1]) == null ? void 0 : _d$structure$tree.class;
+    return (_d$structure$tree$roo = d.structure.tree[rootId]) == null ? void 0 : _d$structure$tree$roo.class;
   });
   const currProdClass = react.useDrawing(drawingId, d => {
-    var _d$structure$tree2;
+    var _d$structure$tree$cur;
 
-    return (_d$structure$tree2 = d.structure.tree[currProdId || -1]) == null ? void 0 : _d$structure$tree2.class;
+    return (_d$structure$tree$cur = d.structure.tree[currProdId]) == null ? void 0 : _d$structure$tree$cur.class;
   });
   return React.useMemo(() => {
     const isPartRoot = Boolean(rootClass === classcad.CCClasses.CCPart);
@@ -10850,8 +10879,8 @@ const useEditMode = drawingId => {
 
 const useObjectDetails = (drawingId, objectId) => {
   const rootId = react.useDrawing(drawingId, d => d.structure.root);
-  const currProdId = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const currNodeId = react.useDrawing(drawingId, d => d.structure.currentNode);
+  const currProdId = useDrawingCCId(drawingId, d => d.structure.currentProduct);
+  const currNodeId = useDrawingCCId(drawingId, d => d.structure.currentNode);
   return React.useMemo(() => {
     const drawing = core.getDrawing(drawingId);
 
@@ -10859,7 +10888,7 @@ const useObjectDetails = (drawingId, objectId) => {
       const {
         tree
       } = drawing.structure;
-      const obj = tree[objectId || -1];
+      const obj = tree[objectId];
 
       if (obj) {
         const clazz = obj.class;
@@ -10900,12 +10929,12 @@ const useOperationSequence = (drawingId, partId) => {
       } = drawing.structure;
 
       if (children) {
-        const opSeqId = children == null ? void 0 : children.find(id => {
+        const opSeqId = (children == null ? void 0 : children.find(id => {
           var _tree$id;
 
           return ((_tree$id = tree[id]) == null ? void 0 : _tree$id.class) === classcad.CCClasses.CCOperationSequence;
-        });
-        const opSeq = tree[opSeqId || -1];
+        })) || NOCCID;
+        const opSeq = tree[opSeqId];
 
         if (opSeq) {
           return opSeq.id;
@@ -10918,11 +10947,11 @@ const useOperationSequence = (drawingId, partId) => {
 };
 
 const useRollbackBar = (drawingId, partId) => {
-  const opSeqId = useOperationSequence(drawingId, partId);
+  const opSeqId = useOperationSequence(drawingId, partId) || NOCCID;
   const opSeqChildren = react.useDrawing(drawingId, d => {
-    var _d$structure$tree;
+    var _d$structure$tree$opS;
 
-    return (_d$structure$tree = d.structure.tree[opSeqId || -1]) == null ? void 0 : _d$structure$tree.children;
+    return (_d$structure$tree$opS = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS.children;
   });
   return React.useMemo(() => {
     const drawing = core.getDrawing(drawingId);
@@ -10931,18 +10960,18 @@ const useRollbackBar = (drawingId, partId) => {
       const {
         tree
       } = drawing.structure;
-      const opSeq = tree[opSeqId || -1];
+      const opSeq = tree[opSeqId];
 
       if (opSeq && opSeqChildren) {
-        const rollbackBarId = opSeqChildren == null ? void 0 : opSeqChildren.find(id => {
+        const rollbackBarId = (opSeqChildren == null ? void 0 : opSeqChildren.find(id => {
           var _tree$id;
 
           return ((_tree$id = tree[id]) == null ? void 0 : _tree$id.class) === classcad.CCClasses.CCRollbackBar;
-        });
-        const rollbackBarIndex = (opSeqChildren == null ? void 0 : opSeqChildren.indexOf(rollbackBarId || -1)) || -1;
+        })) || NOCCID;
+        const rollbackBarIndex = (opSeqChildren == null ? void 0 : opSeqChildren.indexOf(rollbackBarId)) || -1;
         return {
           operationSequence: opSeq,
-          rollbackBar: tree[rollbackBarId || -1],
+          rollbackBar: tree[rollbackBarId],
           rollbackBarIndex: rollbackBarIndex
         };
       }
@@ -11177,8 +11206,8 @@ const ObjTitle = ({
     drawingId,
     pluginId
   } = React.useContext(RootContext);
-  const name = react.useDrawing(drawingId, d => d.structure.tree[objId].name) || '';
-  const objClass = react.useDrawing(drawingId, d => d.structure.tree[objId].class);
+  const name = useDrawingStr(drawingId, d => d.structure.tree[objId].name);
+  const objClass = useDrawingStr(drawingId, d => d.structure.tree[objId].class);
   const isHovered = useSketchState(drawingId, pluginId, s => s.hovered === objId);
   const isSelected = useSketchState(drawingId, pluginId, s => s.selected.indexOf(objId) !== -1);
   const color = isSelected ? '#ffa500' : isHovered ? '#28d79f' : undefined; // TODO: Rename resources so that they have more generic names, i.e. 'CC_Point' instead of 'drawPoint', etc
@@ -11258,7 +11287,7 @@ const SketchObj = ({
   const {
     drawingId
   } = React.useContext(RootContext);
-  const children = react.useDrawing(drawingId, d => d.structure.tree[objId].children || []);
+  const children = useDrawingArr(drawingId, d => d.structure.tree[objId].children);
   const [collapsed, setCollapsed] = React.useState(true);
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlexRow, null, /*#__PURE__*/React.createElement(Indents, {
     level: level
@@ -11337,8 +11366,8 @@ const PlaneSelectionMode = ({
   } = react.useBuerli(buerli => buerli.options.elements);
   const sketchId = react.usePlugin(drawingId, pluginId, plugin => plugin.objectId);
   const curProduct = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const opSeqId = useOperationSequence(drawingId, curProduct) || -1;
-  const opSeqChildren = react.useDrawing(drawingId, d => d.structure.tree[opSeqId].children || []); // Makes base planes visible when just created, and turns them off after initialization (i.e. selecting a plane)
+  const opSeqId = useOperationSequence(drawingId, curProduct) || NOCCID;
+  const opSeqChildren = useDrawingArr(drawingId, d => d.structure.tree[opSeqId].children); // Makes base planes visible when just created, and turns them off after initialization (i.e. selecting a plane)
 
   React.useEffect(() => {
     if (opSeqChildren.length < 7) {
@@ -11527,7 +11556,7 @@ const RootImpl$f = ({
         plugin.set({
           tmpObjects: {},
           selected: [],
-          hovered: UNDEFINEDID,
+          hovered: NOCCID,
           highlighted: []
         });
       }
@@ -11611,8 +11640,8 @@ function useRefsReset(type, refs) {
 }
 
 const useAllObjects = drawingId => {
-  const root = react.useDrawing(drawingId, d => d.structure.root);
-  const rootExists = react.useDrawing(drawingId, d => Boolean(d.structure.tree[root || core.NOID]));
+  const root = useDrawingCCId(drawingId, d => d.structure.root);
+  const rootExists = react.useDrawing(drawingId, d => Boolean(d.structure.tree[root]));
   return React.useMemo(() => {
     const drawing = core.getDrawing(drawingId);
 
@@ -12579,8 +12608,8 @@ function RootImpl$b({
 
         // We do not expect that the 'currentProduct' can change while a plugin is open,
         // so we don't have to listen for changes to 'currentProduct' and access it statically.
-        const geomSetId = (_structure$tree = structure.tree[structure.currentProduct]) == null ? void 0 : _structure$tree.geometrySet;
-        const geomSet = structure.tree[geomSetId || -1];
+        const geomSetId = ((_structure$tree = structure.tree[structure.currentProduct]) == null ? void 0 : _structure$tree.geometrySet) || NOCCID;
+        const geomSet = structure.tree[geomSetId];
 
         if (geomSet && geomSet.children && geomSet.children.length > 0) {
           const geomObjects = geomSet.children.map(childId => structure.tree[childId]);
@@ -13767,30 +13796,30 @@ function useFeaturesIds(drawingId, curNodeId) {
 
     return curNodeId;
   });
-  const opSeqId = useOperationSequence(drawingId, prodId);
-  const opSeqChildren = react.useDrawing(drawingId, d => {
-    var _d$structure$tree;
+  const opSeqId = useOperationSequence(drawingId, prodId) || NOCCID;
+  const opSeqChildren = useDrawingArr(drawingId, d => {
+    var _d$structure$tree$opS;
 
-    return (_d$structure$tree = d.structure.tree[opSeqId || -1]) == null ? void 0 : _d$structure$tree.children;
+    return (_d$structure$tree$opS = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS.children;
   });
   const tree = core.getDrawing(drawingId).structure.tree;
-  const featureIds = (opSeqChildren == null ? void 0 : opSeqChildren.map(refId => tree[refId].members.refObj.value)) || [];
+  const featureIds = opSeqChildren.map(refId => tree[refId].members.refObj.value);
   return featureIds;
 }
 function getFeaturesIds(drawingId, curNodeId) {
-  var _tree$prodId, _tree;
+  var _tree$prodId, _tree$opSeqId;
 
   const tree = core.getDrawing(drawingId).structure.tree;
   const curClass = tree[curNodeId].class;
   const prodId = curClass === classcad.CCClasses.CCProductReference || curClass === classcad.CCClasses.CCProductReferenceET ? tree[curNodeId].members.productId.value : curNodeId;
-  const prodChildren = (_tree$prodId = tree[prodId]) == null ? void 0 : _tree$prodId.children;
-  const opSeqId = prodChildren == null ? void 0 : prodChildren.find(id => {
+  const prodChildren = ((_tree$prodId = tree[prodId]) == null ? void 0 : _tree$prodId.children) || [];
+  const opSeqId = prodChildren.find(id => {
     var _tree$id;
 
     return ((_tree$id = tree[id]) == null ? void 0 : _tree$id.class) === classcad.CCClasses.CCOperationSequence;
-  });
-  const opSeqChildren = (_tree = tree[opSeqId || -1]) == null ? void 0 : _tree.children;
-  const featureIds = (opSeqChildren == null ? void 0 : opSeqChildren.map(refId => tree[refId].members.refObj.value)) || [];
+  }) || NOCCID;
+  const opSeqChildren = ((_tree$opSeqId = tree[opSeqId]) == null ? void 0 : _tree$opSeqId.children) || [];
+  const featureIds = opSeqChildren.map(refId => tree[refId].members.refObj.value);
   return featureIds;
 }
 
@@ -15708,10 +15737,10 @@ function RootImpl$1({
       const reader = new FileReader();
 
       reader.onload = async () => {
-        const fileName = path.basename(file.name);
+        const fileName = pathBrowserify.basename(file.name);
         resolve({
           result: reader.result,
-          type: path.extname(file.name).replace('.', ''),
+          type: pathBrowserify.extname(file.name).replace('.', ''),
           name: fileName.substr(0, fileName.lastIndexOf('.')) || fileName
         });
       };
@@ -16217,20 +16246,20 @@ const Parts = ({
   pluginId
 }) => {
   const allObjId = useAllObjects(drawingId);
-  const allObjsChilds = react.useDrawing(drawingId, d => {
+  const allObjsChilds = useDrawingArr(drawingId, d => {
     var _d$structure$tree$all;
 
-    return ((_d$structure$tree$all = d.structure.tree[allObjId]) == null ? void 0 : _d$structure$tree$all.children) || [];
+    return (_d$structure$tree$all = d.structure.tree[allObjId]) == null ? void 0 : _d$structure$tree$all.children;
   });
   const partContId = allObjsChilds.find(id => {
     var _getDrawing$structure;
 
     return ((_getDrawing$structure = core.getDrawing(drawingId).structure.tree[id]) == null ? void 0 : _getDrawing$structure.class) === classcad.CCClasses.CCPartContainer;
   });
-  const partsIds = react.useDrawing(drawingId, d => {
+  const partsIds = useDrawingArr(drawingId, d => {
     var _d$structure$tree$par;
 
-    return ((_d$structure$tree$par = d.structure.tree[partContId]) == null ? void 0 : _d$structure$tree$par.children) || [];
+    return (_d$structure$tree$par = d.structure.tree[partContId]) == null ? void 0 : _d$structure$tree$par.children;
   });
   const [createMode, setCreateMode] = React.useState(false);
   const data = useTableData(partsIds, 'part', createMode);
@@ -16265,20 +16294,20 @@ const Assemblies = ({
   pluginId
 }) => {
   const allObjId = useAllObjects(drawingId);
-  const allObjsChilds = react.useDrawing(drawingId, d => {
+  const allObjsChilds = useDrawingArr(drawingId, d => {
     var _d$structure$tree$all2;
 
-    return ((_d$structure$tree$all2 = d.structure.tree[allObjId]) == null ? void 0 : _d$structure$tree$all2.children) || [];
+    return (_d$structure$tree$all2 = d.structure.tree[allObjId]) == null ? void 0 : _d$structure$tree$all2.children;
   });
   const assemblyContId = allObjsChilds.find(id => {
     var _getDrawing$structure2;
 
     return ((_getDrawing$structure2 = core.getDrawing(drawingId).structure.tree[id]) == null ? void 0 : _getDrawing$structure2.class) === classcad.CCClasses.CCAssemblyContainer;
   });
-  const assembliesIds = react.useDrawing(drawingId, d => {
+  const assembliesIds = useDrawingArr(drawingId, d => {
     var _d$structure$tree$ass;
 
-    return ((_d$structure$tree$ass = d.structure.tree[assemblyContId]) == null ? void 0 : _d$structure$tree$ass.children) || [];
+    return (_d$structure$tree$ass = d.structure.tree[assemblyContId]) == null ? void 0 : _d$structure$tree$ass.children;
   });
   const [createMode, setCreateMode] = React.useState(false);
   const data = useTableData(assembliesIds, 'asm', createMode);
@@ -16317,7 +16346,7 @@ const ImportModel = ({
         file,
         content
       }) => {
-        const type = path.extname(file.name).replace('.', '');
+        const type = pathBrowserify.extname(file.name).replace('.', '');
         classcad.ccAPI.assemblyBuilder.loadProduct(drawingId, content, type, file.name).catch();
       });
     }, undefined, true);
@@ -16526,7 +16555,7 @@ const load = (file, singleDrawingApp) => {
         if (drawingId) {
           try {
             core.api.getState().api.setActiveDrawing(drawingId);
-            const type = path.extname(file.name).replace('.', '');
+            const type = pathBrowserify.extname(file.name).replace('.', '');
             await classcad.ccAPI.baseModeler.load(drawingId, result, type, file.name);
 
             if (oldDrawingId && singleDrawingApp) {
@@ -17815,14 +17844,14 @@ const FPluginWindow = ({
 const FeaturePlugin = ({
   drawingId
 }) => {
-  const activeFeature = react.useDrawing(drawingId, d => d.plugin.active.feature); // Feature plugins are lazy loaded, so it's possible that recently activated feature plugins hasn't been created yet
+  const activeFeature = react.useDrawing(drawingId, d => d.plugin.active.feature) || NOCCID; // Feature plugins are lazy loaded, so it's possible that recently activated feature plugins hasn't been created yet
 
-  const isCreated = react.usePluginExists(drawingId, activeFeature || -1);
-  const name = react.useDrawing(drawingId, d => {
-    if (!activeFeature || !isCreated) return '';
+  const isCreated = react.usePluginExists(drawingId, activeFeature);
+  const name = useDrawingStr(drawingId, d => {
+    if (!activeFeature || !isCreated) return undefined;
     const objId = d.plugin.refs[activeFeature].objectId;
     const plugin = d.structure.tree[objId];
-    return (plugin == null ? void 0 : plugin.name) || '';
+    return plugin == null ? void 0 : plugin.name;
   });
   const pluginAPI = core.getDrawing(drawingId).api.plugin;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DraggableModalProvider, null, activeFeature && isCreated && /*#__PURE__*/React.createElement(DraggableModal, {
@@ -17924,35 +17953,35 @@ function useMenuItems$2(drawingId, featureId, isActive, setEditName) {
 
 function useIsCustom(drawingId, featureRefId) {
   const curProduct = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const opSeqId = useOperationSequence(drawingId, curProduct);
-  const opSeqChildren = react.useDrawing(drawingId, d => {
-    var _d$structure$tree;
+  const opSeqId = useOperationSequence(drawingId, curProduct) || NOCCID;
+  const opSeqChildren = useDrawingArr(drawingId, d => {
+    var _d$structure$tree$opS;
 
-    return (_d$structure$tree = d.structure.tree[opSeqId || -1]) == null ? void 0 : _d$structure$tree.children;
-  }) || []; // First 7 elements in operationSequence are features created by default (origin, x,y,z axes and planes) => they're not custom
+    return (_d$structure$tree$opS = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS.children;
+  }); // First 7 elements in operationSequence are features created by default (origin, x,y,z axes and planes) => they're not custom
 
   return opSeqChildren.indexOf(featureRefId) > 6;
 }
 
 function usePrecheckErrorId(drawingId, featureId) {
   const curProduct = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const opSeqId = useOperationSequence(drawingId, curProduct) || -1;
-  const opSeqChildren = react.useDrawing(drawingId, d => {
-    var _d$structure$tree$opS;
+  const opSeqId = useOperationSequence(drawingId, curProduct) || NOCCID;
+  const opSeqChildren = useDrawingArr(drawingId, d => {
+    var _d$structure$tree$opS2;
 
-    return (_d$structure$tree$opS = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS.children;
-  }) || [];
+    return (_d$structure$tree$opS2 = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS2.children;
+  });
   const refId = opSeqChildren.find(chId => {
     var _ref_$members;
 
     const ref_ = core.getDrawing(drawingId).structure.tree[chId];
     return featureId === (ref_ == null ? void 0 : (_ref_$members = ref_.members) == null ? void 0 : _ref_$members.refObj.value);
-  });
-  const refChildren = react.useDrawing(drawingId, d => {
-    var _d$structure$tree2;
+  }) || NOCCID;
+  const refChildren = useDrawingArr(drawingId, d => {
+    var _d$structure$tree$ref;
 
-    return (_d$structure$tree2 = d.structure.tree[refId || -1]) == null ? void 0 : _d$structure$tree2.children;
-  }) || [];
+    return (_d$structure$tree$ref = d.structure.tree[refId]) == null ? void 0 : _d$structure$tree$ref.children;
+  });
   const errorId = refChildren.find(chId => {
     var _getDrawing$structure;
 
@@ -18117,21 +18146,21 @@ const Item$1 = ({
   featureRefId
 }) => {
   const curPartId = react.useDrawing(drawingId, d => d.structure.currentProduct || d.structure.root);
-  const opSeqId = useOperationSequence(drawingId, curPartId);
+  const opSeqId = useOperationSequence(drawingId, curPartId) || NOCCID;
   const idx = react.useDrawing(drawingId, d => {
-    var _d$structure$tree, _d$structure$tree$chi;
+    var _d$structure$tree$opS, _d$structure$tree$opS2;
 
-    return (_d$structure$tree = d.structure.tree[opSeqId || -1]) == null ? void 0 : (_d$structure$tree$chi = _d$structure$tree.children) == null ? void 0 : _d$structure$tree$chi.indexOf(featureRefId);
+    return (_d$structure$tree$opS = d.structure.tree[opSeqId]) == null ? void 0 : (_d$structure$tree$opS2 = _d$structure$tree$opS.children) == null ? void 0 : _d$structure$tree$opS2.indexOf(featureRefId);
   }) || -1;
   const featureId = react.useDrawing(drawingId, d => {
     var _d$structure$tree$fea, _d$structure$tree$fea2;
 
     return (_d$structure$tree$fea = d.structure.tree[featureRefId]) == null ? void 0 : (_d$structure$tree$fea2 = _d$structure$tree$fea.members) == null ? void 0 : _d$structure$tree$fea2.refObj.value;
   });
-  const objClass = react.useDrawing(drawingId, d => {
+  const objClass = useDrawingStr(drawingId, d => {
     var _d$structure$tree$fea3;
 
-    return ((_d$structure$tree$fea3 = d.structure.tree[featureId]) == null ? void 0 : _d$structure$tree$fea3.class) || '';
+    return (_d$structure$tree$fea3 = d.structure.tree[featureId]) == null ? void 0 : _d$structure$tree$fea3.class;
   });
   const isFeatureActive = react.useDrawing(drawingId, d => d.plugin.active.feature !== null) || false;
   const isRollbackBar = objClass === classcad.CCClasses.CCRollbackBar;
@@ -18149,12 +18178,12 @@ const List$2 = ({
   drawingId
 }) => {
   const curPartId = react.useDrawing(drawingId, d => d.structure.currentProduct || d.structure.root);
-  const opSeqId = useOperationSequence(drawingId, curPartId);
-  const featureRefIds = react.useDrawing(drawingId, d => {
-    var _d$structure$tree2;
+  const opSeqId = useOperationSequence(drawingId, curPartId) || NOCCID;
+  const featureRefIds = useDrawingArr(drawingId, d => {
+    var _d$structure$tree$opS3;
 
-    return (_d$structure$tree2 = d.structure.tree[opSeqId || -1]) == null ? void 0 : _d$structure$tree2.children;
-  }) || [];
+    return (_d$structure$tree$opS3 = d.structure.tree[opSeqId]) == null ? void 0 : _d$structure$tree$opS3.children;
+  });
   return /*#__PURE__*/React.createElement(SortableCont, {
     helperClass: "row-dragging",
     lockAxis: "y",
@@ -18289,7 +18318,7 @@ const ProdReferenceNode = ({
   level,
   onClick
 }) => {
-  const children = react.useDrawing(drawingId, d => d.structure.tree[refId].children || []);
+  const children = useDrawingArr(drawingId, d => d.structure.tree[refId].children);
   const [collapsed, setCollapsed] = React.useState(true);
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlexRow, null, /*#__PURE__*/React.createElement(Indents, {
     level: level
@@ -18373,7 +18402,7 @@ const AssemblyTreeHeader = ({
   const mode = useEditMode(drawingId);
   const currProd = useCurrentProduct(drawingId);
   const currNode = useCurrentNode(drawingId);
-  const objDetails = useObjectDetails(drawingId, (currNode == null ? void 0 : currNode.id) || -1);
+  const objDetails = useObjectDetails(drawingId, (currNode == null ? void 0 : currNode.id) || NOCCID);
   const showBackBtn = React.useMemo(() => pStackNotEmpty || !objDetails.isRoot && (objDetails.isAssemblyNode || objDetails.isAssembly), [objDetails.isAssembly, objDetails.isAssemblyNode, objDetails.isRoot, pStackNotEmpty]);
   const isFeatureActive = react.useDrawing(drawingId, d => d.plugin.active.feature !== null) || false;
   const name = currProd ? currProd.name : currNode ? currNode.name : '';
@@ -18421,7 +18450,7 @@ const AssemblyTreeHeader = ({
   }));
   const nameComponent = rename ? /*#__PURE__*/React.createElement(NameEdit, {
     drawingId: drawingId,
-    objId: (currProd == null ? void 0 : currProd.id) || -1,
+    objId: (currProd == null ? void 0 : currProd.id) || NOCCID,
     setEditName: setRename,
     name: name
   }) : /*#__PURE__*/React.createElement(EntityName, {
@@ -18506,10 +18535,10 @@ const AssemblyTreeImpl = ({
   const api = useCADStore(s => s.api);
   const mode = useEditMode(drawingId);
   const currNode = useCurrentNode(drawingId);
-  const children = react.useDrawing(drawingId, d => {
+  const children = useDrawingArr(drawingId, d => {
     var _d$structure$tree;
 
-    return ((_d$structure$tree = d.structure.tree[(currNode == null ? void 0 : currNode.id) || -1]) == null ? void 0 : _d$structure$tree.children) || [];
+    return (_d$structure$tree = d.structure.tree[(currNode == null ? void 0 : currNode.id) || NOCCID]) == null ? void 0 : _d$structure$tree.children;
   });
   return /*#__PURE__*/React.createElement("div", {
     style: {
@@ -18526,13 +18555,13 @@ const AssemblyTreeImpl = ({
     }
   }, mode === EditMode.Part && /*#__PURE__*/React.createElement(FeatureList, {
     drawingId: drawingId
-  }), mode === EditMode.Assembly && (children == null ? void 0 : children.map(childId => /*#__PURE__*/React.createElement(AssemblyNode, {
+  }), mode === EditMode.Assembly && children.map(childId => /*#__PURE__*/React.createElement(AssemblyNode, {
     drawingId: drawingId,
     nodeId: childId,
     key: childId,
     level: 0,
     onClick: refId => api.assemblyTree.startProdEditing(drawingId, refId)
-  })))));
+  }))));
 };
 
 const AssemblyTree = ({
@@ -18568,12 +18597,11 @@ const Constraints = ({
   drawingId
 }) => {
   const curProdId = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const prodChildren = react.useDrawing(drawingId, d => {
+  const prodChildren = useDrawingArr(drawingId, d => {
     var _d$structure$tree$cur;
 
-    return ((_d$structure$tree$cur = d.structure.tree[curProdId]) == null ? void 0 : _d$structure$tree$cur.children) || [];
-  }); // TODO: sometimes it's undefined?
-
+    return (_d$structure$tree$cur = d.structure.tree[curProdId]) == null ? void 0 : _d$structure$tree$cur.children;
+  });
   const constrSetId = React.useMemo(() => {
     const tree = core.getDrawing(drawingId).structure.tree;
     return prodChildren.find(childId => tree[childId].class === classcad.CCClasses.CCConstraintSet) || null;
@@ -18701,11 +18729,11 @@ const ColorPicker = ({
 
     return (_d$geometry$cache$sol3 = d.geometry.cache[solidId]) == null ? void 0 : (_d$geometry$cache$sol4 = _d$geometry$cache$sol3.meshes[0]) == null ? void 0 : _d$geometry$cache$sol4.opacity;
   }) || 1;
-  const solidOwner = react.useDrawing(drawingId, d => {
+  const solidOwner = useDrawingCCId(drawingId, d => {
     var _d$graphic$containers;
 
     return (_d$graphic$containers = d.graphic.containers[solidId]) == null ? void 0 : _d$graphic$containers.owner;
-  }) || -1; // Color which is set by colorPicker
+  }); // Color which is set by colorPicker
 
   const [userColor, setUColor] = React.useState({
     r,
@@ -18855,11 +18883,11 @@ const Solid = ({
   drawingId,
   solidId
 }) => {
-  const solidOwner = react.useDrawing(drawingId, d => {
+  const solidOwner = useDrawingCCId(drawingId, d => {
     var _d$graphic$containers;
 
     return (_d$graphic$containers = d.graphic.containers[solidId]) == null ? void 0 : _d$graphic$containers.owner;
-  }) || -1;
+  });
   const ccSolid = react.useDrawing(drawingId, d => d.structure.tree[solidOwner]);
   const [rename, setRename] = React.useState(false);
   const [isMenuHovered, setIsMenuHovered] = React.useState(false);
@@ -18900,7 +18928,7 @@ const Solids = ({
   drawingId
 }) => {
   const curProdId = react.useDrawing(drawingId, d => d.structure.currentProduct);
-  const solidsIds = react.useDrawing(drawingId, d => d.structure.tree[curProdId].solids) || [];
+  const solidsIds = useDrawingArr(drawingId, d => d.structure.tree[curProdId].solids);
   return /*#__PURE__*/React.createElement("div", {
     style: {
       display: 'flex',