@threekit-tools/treble 0.0.89-next-006 → 0.0.90

package/dist/hooks/useNestedConfigurator/index.js

@@ -57,7 +57,8 @@ var useNestedConfigurator = function (address) {
                 return;
             if (playerLoading)
                 return;
-            configurator.current = window.threekit.configurator.getNestedConfigurator([address].flat());
+            configurator.current =
+                window.threekit.treble.getNestedConfigurator(address);
             if (!configurator.current)
                 return;
             var updatedAttrs = configurator.current.getDisplayAttributes();

package/dist/hooks/useRoomBuilder/RoomBuilderState.d.ts

@@ -10,32 +10,16 @@ export declare class RoomBuilderState {
     private _errorElement;
     private _showDimensions;
     private _angleSnappingEnabled;
-    private _canvasDimensions;
-    private _zoom;
-    private _zoomLimits;
-    private _translate;
-    private _translateLimits;
     private _state;
     constructor(config: IRoomBuilderStateProps);
     get walls(): IWalls;
-    get wallsToDraw(): {
-        line: ICoordinatesLine;
-        path: undefined;
-        assetId: string;
-        height?: number | undefined;
-        thickness?: number | undefined;
-        connections: [elementType: IFeatureName, index: number][];
-    }[];
     set walls(walls: IWalls);
     get wallCount(): number;
     get wallLines(): ICoordinatesLine[];
     get vertices(): IVerticesState;
-    get verticesToDraw(): IVerticesState;
     set vertices(vertices: IVerticesState);
     get verticesList(): Array<IVertex>;
-    get verticesListToDraw(): Array<IVertex>;
     get features(): IFeatures;
-    get featuresToDraw(): Record<string, IFeature[]>;
     set features(features: IFeatures);
     get getHydratedFeatures(): undefined | IFeaturesHydrated;
     get featureCount(): number;
@@ -46,27 +30,7 @@ export declare class RoomBuilderState {
     set showDimensions(val: boolean);
     get angleSnappingEnabled(): boolean;
     set angleSnappingEnabled(val: boolean);
-    get enclosedSpacesToDraw(): Array<IEnclosedSpace>;
-    get canvasDimensions(): ICoordinate2D;
-    get canvasWidth(): number;
-    get canvasHeight(): number;
-    set canvasDimensions(dimensions: ICoordinate2D);
-    get zoom(): number;
-    get zoomFactor(): number;
-    get zoomMin(): number;
-    get zoomMax(): number;
-    setZoom(delta: number): number | undefined;
-    get translate(): ICoordinate2D;
-    get translateMin(): ICoordinate2D;
-    get translateMax(): ICoordinate2D;
-    set translate(position: ICoordinate2D);
-    get isDrawWallActive(): boolean;
-    transformLengthFromCanvas(length: number): number;
-    transformLengthToCanvas(length: number): number;
-    transformPointToCanvas(point: ICoordinate2D): ICoordinate2D;
-    transformPointFromCanvas(point: ICoordinate2D): ICoordinate2D;
-    transformLineToCanvas(line: ICoordinatesLine): ICoordinatesLine;
-    transformLineFromCanvas(line: ICoordinatesLine): ICoordinatesLine;
+    get enclosedSpaces(): Array<IEnclosedSpace>;
     private getWall;
     private addWall;
     private addWalls;
@@ -75,7 +39,7 @@ export declare class RoomBuilderState {
     private getWallConnectionsHydrated;
     private getWallDimensions;
     private getWallDetailedDimensions;
-    private getAllWallDimensionsToDraw;
+    private getAllWallDimensions;
     private shiftAllFeaturesOnWall;
     private addFeatureToWall;
     private removeFeatureFromWall;
@@ -106,24 +70,23 @@ export declare class RoomBuilderState {
     private snapVertexToAbsoluteAngle;
     private getFeatureAtPoint;
     private getElementAtPoint;
-    getClickedElement(cursorPoint: ICoordinate2D): undefined | IElementUi;
+    getClickedElement(point: ICoordinate2D): undefined | IElementUi;
     private getPointProximity;
     private reevaluateFeatureConnections;
     private pushStateToConfigurator;
     setAttributesToState(attributes?: Record<string, IHydratedAttribute>): void;
     deleteAll(): void;
     private resetInternalState;
-    highlightElementIfInProximity(canvas: HTMLCanvasElement, cursorPoint: ICoordinate2D): void;
+    highlightElementIfInProximity(canvas: HTMLCanvasElement, point: ICoordinate2D): void;
     startDrawNewWall(startPoint: ICoordinate2D): void;
     drawNewWall(canvas: HTMLCanvasElement, endPoint: ICoordinate2D): void;
     cancelDrawNewWall(canvas: HTMLCanvasElement): void;
     finishDrawNewWall(canvas: HTMLCanvasElement, assetId: string): Promise<void>;
-    drawNewWallGuides(canvas: HTMLCanvasElement, cursorPoint: ICoordinate2D): void;
     private moveActiveVertex;
     private finishMoveActiveVertex;
     private moveActiveFeature;
     private finishMoveActiveFeature;
-    selectElementIfInProximity(canvas: HTMLCanvasElement, cursorPoint: ICoordinate2D): void;
+    selectElementIfInProximity(canvas: HTMLCanvasElement, point: ICoordinate2D): void;
     moveActiveElement(canvas: HTMLCanvasElement, moveToPoint: ICoordinate2D): void;
     finishMoveActiveElement(canvas: HTMLCanvasElement): void;
     cancelMoveActiveElement(canvas: HTMLCanvasElement): void;

package/dist/hooks/useRoomBuilder/RoomBuilderState.js

@@ -109,7 +109,7 @@ var RoomBuilderState = (function () {
                     _this._activeElement.snapPoint = snapPoint;
                     _this.repositionVertex(_this._activeElement.index, (_c = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _c !== void 0 ? _c : point);
                     _this.drawRoom(canvas);
-                    (0, draw_1.drawVertex)(canvas, _this.transformPointToCanvas((_d = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _d !== void 0 ? _d : point), _this._config.config.styles.vertex, types_1.IElementStyleModes.HIGHLIGHT);
+                    (0, draw_1.drawVertex)(canvas, (_d = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _d !== void 0 ? _d : point, _this._config.config.styles.vertex, types_1.IElementStyleModes.HIGHLIGHT);
                     break;
             }
         };
@@ -191,11 +191,6 @@ var RoomBuilderState = (function () {
         this._showDimensions = true;
         this._angleSnappingEnabled = true;
         this._attributesState = null;
-        this._canvasDimensions = [0, 0];
-        this._zoom = config.config.zoomDefault;
-        this._zoomLimits = [constants_1.ZOOM_MIN, constants_1.ZOOM_MAX];
-        this._translate = config.config.translateDefault;
-        this._translateLimits = [constants_1.TRANSLATE_MIN, constants_1.TRANSLATE_MAX];
     }
     Object.defineProperty(RoomBuilderState.prototype, "walls", {
         get: function () {
@@ -207,14 +202,6 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "wallsToDraw", {
-        get: function () {
-            var _this = this;
-            return this._state[types_2.IElements.WALL].map(function (wall) { return (__assign(__assign({}, wall), { line: _this.transformLineToCanvas(wall.line), path: undefined })); });
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(RoomBuilderState.prototype, "wallCount", {
         get: function () {
             return this.walls.length;
@@ -242,13 +229,6 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "verticesToDraw", {
-        get: function () {
-            return this._state[types_2.IElements.VERTEX];
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(RoomBuilderState.prototype, "verticesList", {
         get: function () {
             return Object.entries(this.vertices).map(function (_a) {
@@ -262,14 +242,6 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "verticesListToDraw", {
-        get: function () {
-            var _this = this;
-            return this.verticesList.map(function (vertex) { return (__assign(__assign({}, vertex), { point: _this.transformPointToCanvas(vertex.point) })); });
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(RoomBuilderState.prototype, "features", {
         get: function () {
             return this._state[types_2.IElements.FEATURE];
@@ -280,20 +252,6 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "featuresToDraw", {
-        get: function () {
-            var _this = this;
-            return Object.entries(this.features).reduce(function (output, _a) {
-                var _b;
-                var type = _a[0], featureArr = _a[1];
-                return Object.assign(output, (_b = {},
-                    _b[type] = featureArr.map(function (feature) { return (__assign(__assign({}, feature), { path: undefined, offset: _this.transformLengthToCanvas(feature.offset), length: _this.transformLengthToCanvas(feature.length) })); }),
-                    _b));
-            }, {});
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(RoomBuilderState.prototype, "getHydratedFeatures", {
         get: function () {
             var _this = this;
@@ -358,7 +316,7 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "enclosedSpacesToDraw", {
+    Object.defineProperty(RoomBuilderState.prototype, "enclosedSpaces", {
         get: function () {
             var _this = this;
             var loops = (0, findLoops_1.findLoops)(this.wallLines).inner;
@@ -367,7 +325,7 @@ var RoomBuilderState = (function () {
                 var area = screenSpaceArea * Math.pow(_this._config.config.scale, 2);
                 var convertedArea = (0, dataHandlers_1.convertAreaUnit)(area, types_1.IUnits.METER, _this._config.config.unit);
                 var enclosedSpace = {
-                    loop: loop.map(function (point) { return _this.transformPointToCanvas(point); }),
+                    loop: loop,
                     area: (0, dataHandlers_1.prepAreaForUser)(convertedArea, _this._config.config.unit),
                     center: loop.reduce(function (centerPoint, point) {
                         centerPoint[0] += point[0] / loop.length;
@@ -375,7 +333,6 @@ var RoomBuilderState = (function () {
                         return centerPoint;
                     }, [0, 0]),
                 };
-                enclosedSpace.center = _this.transformPointToCanvas(enclosedSpace.center);
                 output.push(enclosedSpace);
                 return output;
             }, []);
@@ -383,145 +340,6 @@ var RoomBuilderState = (function () {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(RoomBuilderState.prototype, "canvasDimensions", {
-        get: function () {
-            return this._canvasDimensions;
-        },
-        set: function (dimensions) {
-            this._canvasDimensions = dimensions;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "canvasWidth", {
-        get: function () {
-            return this.canvasDimensions[0];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "canvasHeight", {
-        get: function () {
-            return this.canvasDimensions[1];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "zoom", {
-        get: function () {
-            return this._zoom;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "zoomFactor", {
-        get: function () {
-            return this._zoom / this.zoomMin;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "zoomMin", {
-        get: function () {
-            return this._zoomLimits[0];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "zoomMax", {
-        get: function () {
-            return this._zoomLimits[1];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    RoomBuilderState.prototype.setZoom = function (delta) {
-        var newZoom = this.zoom + delta;
-        var preppedZoom = newZoom < this.zoomMin
-            ? this.zoomMin
-            : newZoom > this.zoomMax
-                ? this.zoomMax
-                : newZoom;
-        if (preppedZoom === this.zoom)
-            return;
-        this._zoom = preppedZoom;
-        return this.zoom;
-    };
-    Object.defineProperty(RoomBuilderState.prototype, "translate", {
-        get: function () {
-            return this._translate;
-        },
-        set: function (position) {
-            var zoomFactor = this._zoom / this.zoomMin;
-            var delta = [
-                (position[0] - this._translate[0]) / zoomFactor,
-                (position[1] - this._translate[1]) / zoomFactor,
-            ];
-            this._translate = [
-                this._translate[0] + delta[0],
-                this._translate[1] + delta[1],
-            ];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "translateMin", {
-        get: function () {
-            return this._translateLimits[0];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "translateMax", {
-        get: function () {
-            return this._translateLimits[1];
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RoomBuilderState.prototype, "isDrawWallActive", {
-        get: function () {
-            return !!this._newWall;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    RoomBuilderState.prototype.transformLengthFromCanvas = function (length) {
-        return length / this.zoomFactor;
-    };
-    RoomBuilderState.prototype.transformLengthToCanvas = function (length) {
-        return length * this.zoomFactor;
-    };
-    RoomBuilderState.prototype.transformPointToCanvas = function (point) {
-        var widthOffset = this.canvasWidth / 2;
-        var heightOffset = this.canvasHeight / 2;
-        return [
-            this.transformLengthToCanvas(point[0] + this.translate[0]) -
-                widthOffset * (this.zoomFactor - 1),
-            this.transformLengthToCanvas(point[1] + this.translate[1]) -
-                heightOffset * (this.zoomFactor - 1),
-        ];
-    };
-    RoomBuilderState.prototype.transformPointFromCanvas = function (point) {
-        var widthOffset = this.canvasWidth / 2;
-        var heightOffset = this.canvasHeight / 2;
-        return [
-            this.transformLengthFromCanvas(point[0] + widthOffset * (this.zoomFactor - 1)) - this.translate[0],
-            this.transformLengthFromCanvas(point[1] + heightOffset * (this.zoomFactor - 1)) - this.translate[1],
-        ];
-    };
-    RoomBuilderState.prototype.transformLineToCanvas = function (line) {
-        return [
-            this.transformPointToCanvas(line[0]),
-            this.transformPointToCanvas(line[1]),
-        ];
-    };
-    RoomBuilderState.prototype.transformLineFromCanvas = function (line) {
-        return [
-            this.transformPointFromCanvas(line[0]),
-            this.transformPointFromCanvas(line[1]),
-        ];
-    };
     RoomBuilderState.prototype.getWall = function (index) {
         return this.walls[index];
     };
@@ -624,11 +442,11 @@ var RoomBuilderState = (function () {
         }, []);
         return lines;
     };
-    RoomBuilderState.prototype.getAllWallDimensionsToDraw = function (detailedWallsIndexes) {
+    RoomBuilderState.prototype.getAllWallDimensions = function (detailedWallsIndexes) {
         var _this = this;
         if (detailedWallsIndexes === void 0) { detailedWallsIndexes = []; }
         var indexes = new Set([detailedWallsIndexes].flat());
-        var dimensionsList = this.walls.reduce(function (output, _, i) {
+        return this.walls.reduce(function (output, _, i) {
             var dimensions = indexes.has(i)
                 ? _this.getWallDetailedDimensions(i)
                 : _this.getWallDimensions(i);
@@ -640,7 +458,6 @@ var RoomBuilderState = (function () {
                 output.push(dimensions);
             return output;
         }, []);
-        return dimensionsList.map(function (dimension) { return (__assign(__assign({}, dimension), { line: _this.transformLineToCanvas(dimension.line) })); });
     };
     RoomBuilderState.prototype.shiftAllFeaturesOnWall = function (index, shift) {
         var _this = this;
@@ -805,8 +622,7 @@ var RoomBuilderState = (function () {
         if (!wall)
             return undefined;
         var line = (0, geometry_1.getParallelLineSegmentAtDistance)(wall.line, constants_1.UI_ANCHOR_DISTANCE);
-        var point = (0, geometry_1.getMidpointOfLineSegment)(line);
-        return this.transformPointToCanvas(point);
+        return (0, geometry_1.getMidpointOfLineSegment)(line);
     };
     RoomBuilderState.prototype.getVertex = function (index) {
         return this.verticesList[index];
@@ -878,7 +694,6 @@ var RoomBuilderState = (function () {
         });
     };
     RoomBuilderState.prototype.addFeature = function (type, feature, addToWallIndex) {
-        var _a;
         var offset = undefined;
         var index = undefined;
         if (addToWallIndex !== undefined && feature.offset !== undefined) {
@@ -906,13 +721,13 @@ var RoomBuilderState = (function () {
             return;
         var newFeature = __assign(__assign({}, feature), { offset: offset, connectedTo: [types_2.IElements.WALL, index] });
         var newFeatureIndex;
-        if ((_a = this._state[types_2.IElements.FEATURE][type]) === null || _a === void 0 ? void 0 : _a.length) {
-            newFeatureIndex = this._state[types_2.IElements.FEATURE][type].length;
+        if (this._state[types_2.IElements.FEATURE][type]) {
             this._state[types_2.IElements.FEATURE][type].push(newFeature);
+            newFeatureIndex = this._state[types_2.IElements.FEATURE][type].length;
         }
         else {
             this._state[types_2.IElements.FEATURE][type] = [newFeature];
-            newFeatureIndex = 0;
+            newFeatureIndex = 1;
         }
         this.addFeatureToWall(index, [type, newFeatureIndex]);
         this.pushStateToConfigurator();
@@ -946,8 +761,7 @@ var RoomBuilderState = (function () {
         if (!feature)
             return;
         var line = (0, geometry_1.getParallelLineSegmentAtDistance)(feature.line, constants_1.UI_ANCHOR_DISTANCE);
-        var point = (0, geometry_1.getMidpointOfLineSegment)(line);
-        return this.transformPointToCanvas(point);
+        return (0, geometry_1.getMidpointOfLineSegment)(line);
     };
     RoomBuilderState.prototype.deleteElement = function (type, index) {
         if (type === types_2.IElements.VERTEX)
@@ -958,11 +772,11 @@ var RoomBuilderState = (function () {
             this.deleteFeature(type, index);
     };
     RoomBuilderState.prototype.getVertexInProximity = function (point) {
+        var _this = this;
         if (!point)
             return undefined;
-        var snapProximity = this.transformLengthFromCanvas(this._config.config.snapProximity);
         var index = this.verticesList.findIndex(function (vertex) {
-            return (0, geometry_1.arePointsWithinProximity)(vertex.point, point, snapProximity);
+            return (0, geometry_1.arePointsWithinProximity)(vertex.point, point, _this._config.config.snapProximity);
         });
         if (index === -1)
             return undefined;
@@ -1020,17 +834,17 @@ var RoomBuilderState = (function () {
         return __assign({ type: types_2.IElements.WALL, index: index }, intersection);
     };
     RoomBuilderState.prototype.snapPointToAbsoluteAngle = function (point, anchorPoint, angle) {
-        if (angle === void 0) { angle = 30; }
-        var snapProximity = this.transformLengthFromCanvas(this._config.config.snapProximity);
+        if (angle === void 0) { angle = 15; }
+        var snapProximity = this._config.config.snapProximity;
         if (Math.abs(point[0] - anchorPoint[0]) < snapProximity) {
             return {
-                type: types_1.SNAPPING_TYPES.ANGLE,
+                type: 'Angle',
                 point: [anchorPoint[0], point[1]],
             };
         }
         else if (Math.abs(point[1] - anchorPoint[1]) < snapProximity) {
             return {
-                type: types_1.SNAPPING_TYPES.ANGLE,
+                type: 'Angle',
                 point: [point[0], anchorPoint[1]],
             };
         }
@@ -1040,7 +854,7 @@ var RoomBuilderState = (function () {
             var radians = degrees * (Math.PI / 180);
             if ((0, geometry_1.getDistanceToLine)(anchorPoint, radians, point) < snapProximity)
                 return {
-                    type: types_1.SNAPPING_TYPES.ANGLE,
+                    type: 'Angle',
                     point: (0, geometry_1.closestPointOnLine)(anchorPoint, radians, point),
                 };
         }
@@ -1051,7 +865,6 @@ var RoomBuilderState = (function () {
         var vertex = this.getVertex(vertexIndex);
         if (!vertex)
             return undefined;
-        var snapProximity = this.transformLengthFromCanvas(this._config.config.snapProximity);
         var point = vertex.connections.reduce(function (output, connection) {
             var _a;
             var line = (_a = _this.getWall(connection[0])) === null || _a === void 0 ? void 0 : _a.line;
@@ -1059,16 +872,16 @@ var RoomBuilderState = (function () {
                 return output;
             var _b = output || updatedPoint, x = _b[0], y = _b[1];
             var _c = line[connection[1] === 0 ? 1 : 0], xAnchor = _c[0], yAnchor = _c[1];
-            if (Math.abs(x - xAnchor) < snapProximity)
+            if (Math.abs(x - xAnchor) < _this._config.config.snapProximity)
                 return [xAnchor, y];
-            else if (Math.abs(y - yAnchor) < snapProximity)
+            else if (Math.abs(y - yAnchor) < _this._config.config.snapProximity)
                 return [x, yAnchor];
             return output;
         }, undefined);
         if (!point)
             return point;
         return {
-            type: types_1.SNAPPING_TYPES.ANGLE,
+            type: 'Angle',
             point: point,
         };
     };
@@ -1114,8 +927,7 @@ var RoomBuilderState = (function () {
             return { type: types_2.IElements.WALL, index: wallInProximity };
         return undefined;
     };
-    RoomBuilderState.prototype.getClickedElement = function (cursorPoint) {
-        var point = this.transformPointFromCanvas(cursorPoint);
+    RoomBuilderState.prototype.getClickedElement = function (point) {
         var element = this.getElementAtPoint(point);
         if (!element)
             return;
@@ -1162,6 +974,8 @@ var RoomBuilderState = (function () {
     RoomBuilderState.prototype.setAttributesToState = function (attributes) {
         if (!attributes)
             return;
+        if (!attributes[this._config.attributes[types_2.IElements.WALL]])
+            return;
         this._attributesState = attributes;
         var data = (0, dataHandlers_1.prepAttributesIncoming)(attributes, this._config);
         this.walls = data[types_2.IElements.WALL];
@@ -1182,9 +996,8 @@ var RoomBuilderState = (function () {
         if (this._attributesState)
             this.setAttributesToState(this._attributesState);
     };
-    RoomBuilderState.prototype.highlightElementIfInProximity = function (canvas, cursorPoint) {
+    RoomBuilderState.prototype.highlightElementIfInProximity = function (canvas, point) {
         var _a, _b;
-        var point = this.transformPointFromCanvas(cursorPoint);
         var elementAtPoint = this.getElementAtPoint(point);
         if ((!elementAtPoint && !this._highlightedElement) ||
             Array.isArray(this._highlightedElement))
@@ -1200,14 +1013,13 @@ var RoomBuilderState = (function () {
     };
     RoomBuilderState.prototype.startDrawNewWall = function (startPoint) {
         var _a;
-        var point = this.transformPointFromCanvas(startPoint);
-        var snapPoint = this.getPointProximity(point);
+        var snapPoint = this.getPointProximity(startPoint);
         if ((snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.type) === types_2.IElements.WINDOW ||
             (snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.type) === types_2.IElements.OPENING ||
             (snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.type) === types_2.IElements.DOOR)
             return;
         this._newWall = {
-            start: (_a = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _a !== void 0 ? _a : point,
+            start: (_a = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _a !== void 0 ? _a : startPoint,
             snapStartTo: snapPoint,
         };
     };
@@ -1215,13 +1027,12 @@ var RoomBuilderState = (function () {
         var _a, _b, _c, _d, _e;
         if (!this._newWall)
             return;
-        var point = this.transformPointFromCanvas(endPoint);
-        var snapPoint = this.getPointProximity(point);
+        var snapPoint = this.getPointProximity(endPoint);
         if (!snapPoint && this._angleSnappingEnabled)
-            snapPoint = this.snapPointToAbsoluteAngle(point, (_b = (_a = this._newWall.snapStartTo) === null || _a === void 0 ? void 0 : _a.point) !== null && _b !== void 0 ? _b : this._newWall.start);
+            snapPoint = this.snapPointToAbsoluteAngle(endPoint, (_b = (_a = this._newWall.snapStartTo) === null || _a === void 0 ? void 0 : _a.point) !== null && _b !== void 0 ? _b : this._newWall.start);
         var wallLine = [
             this._newWall.start,
-            (_c = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _c !== void 0 ? _c : point,
+            (_c = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _c !== void 0 ? _c : endPoint,
         ];
         var validationData = {
             walls: this.walls,
@@ -1246,7 +1057,7 @@ var RoomBuilderState = (function () {
             case types_1.IErrorTypes.WARN:
             case null:
             default:
-                this._newWall.end = (_e = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _e !== void 0 ? _e : point;
+                this._newWall.end = (_e = snapPoint === null || snapPoint === void 0 ? void 0 : snapPoint.point) !== null && _e !== void 0 ? _e : endPoint;
                 this._newWall.snapEndTo = snapPoint;
                 this.drawRoom(canvas);
                 break;
@@ -1307,6 +1118,8 @@ var RoomBuilderState = (function () {
                 this.addWalls(newWallLines.map(function (line) { return ({
                     assetId: assetId,
                     line: line,
+                    height: 1,
+                    thickness: 0.6,
                     connections: [],
                 }); }));
                 this._newWall = null;
@@ -1317,13 +1130,7 @@ var RoomBuilderState = (function () {
             });
         });
     };
-    RoomBuilderState.prototype.drawNewWallGuides = function (canvas, cursorPoint) {
-        var point = this.transformPointFromCanvas(cursorPoint);
-        if (canvas)
-            console.log(point);
-    };
-    RoomBuilderState.prototype.selectElementIfInProximity = function (canvas, cursorPoint) {
-        var point = this.transformPointFromCanvas(cursorPoint);
+    RoomBuilderState.prototype.selectElementIfInProximity = function (canvas, point) {
         var elementAtPoint = this.getElementAtPoint(point);
         if (!elementAtPoint || elementAtPoint.type === types_2.IElements.WALL)
             return;
@@ -1342,14 +1149,13 @@ var RoomBuilderState = (function () {
             return;
         if (!this._activeElement)
             return;
-        var point = this.transformPointFromCanvas(moveToPoint);
         var type = this._activeElement.type;
         if (type === types_2.IElements.VERTEX)
-            this.moveActiveVertex(canvas, point);
+            this.moveActiveVertex(canvas, moveToPoint);
         else if (type === types_2.IElements.WINDOW ||
             type === types_2.IElements.DOOR ||
             type === types_2.IElements.OPENING)
-            this.moveActiveFeature(canvas, point);
+            this.moveActiveFeature(canvas, moveToPoint);
     };
     RoomBuilderState.prototype.finishMoveActiveElement = function (canvas) {
         if (!this._activeElement)
@@ -1418,11 +1224,11 @@ var RoomBuilderState = (function () {
                 ((_c = this._activeElement) === null || _c === void 0 ? void 0 : _c.type) === types_2.IElements.DOOR ||
                 ((_d = this._activeElement) === null || _d === void 0 ? void 0 : _d.type) === types_2.IElements.OPENING))
             activeWallIndex = (_e = this.getFeature(this._activeElement.type, this._activeElement.index)) === null || _e === void 0 ? void 0 : _e.connectedTo[1];
-        (0, draw_1.drawRoom)(canvas, this.enclosedSpacesToDraw, this.wallsToDraw, this.verticesListToDraw, this.featuresToDraw, this._showDimensions
-            ? this.getAllWallDimensionsToDraw(activeWallIndex)
+        (0, draw_1.drawRoom)(canvas, this.enclosedSpaces, this.walls, this.verticesList, this.features, this._showDimensions
+            ? this.getAllWallDimensions(activeWallIndex)
             : undefined, selection, this._config.config);
         if (((_f = this._newWall) === null || _f === void 0 ? void 0 : _f.start) && ((_g = this._newWall) === null || _g === void 0 ? void 0 : _g.end)) {
-            (0, draw_1.drawNewWall)(canvas, this.transformLineToCanvas([this._newWall.start, this._newWall.end]), this._config.config.styles, this._errorElement ? types_1.IElementStyleModes.ERROR : undefined);
+            (0, draw_1.drawNewWall)(canvas, [this._newWall.start, this._newWall.end], this._config.config.styles, this._errorElement ? types_1.IElementStyleModes.ERROR : undefined);
         }
     };
     return RoomBuilderState;

package/dist/hooks/useRoomBuilder/constants.d.ts

@@ -1,37 +1,22 @@
-import { ICoordinate2D } from './types';
-export declare enum IRoomBuilderAttributes {
-    WALLS = "_tkSpace_walls",
-    WINDOWS = "_tkSpace_windows",
-    DOORS = "_tkSpace_doors",
-    OPENINGS = "_tkSpace_openings"
-}
 export declare enum IWallAttributes {
-    START_X = "_tkSpace_startX",
-    START_Y = "_tkSpace_startY",
-    START_Z = "_tkSpace_startZ",
-    END_X = "_tkSpace_endX",
-    END_Y = "_tkSpace_endY",
-    END_Z = "_tkSpace_endZ",
-    CONNECTIONS = "_tkSpace_connections",
-    WALL_HEIGHT = "_tkSpace_wallHeight",
-    WALL_THICKNESS = "_tkSpace_wallThickness"
+    START_X = "Start X",
+    START_Z = "Start Z",
+    END_X = "End X",
+    END_Z = "End Z",
+    HEIGHT = "Height",
+    THICKNESS = "Thickness",
+    CONNECTIONS = "Connections"
 }
 export declare enum IFeatureAttribute {
-    POSITION_X = "_tkSpace_offsetX",
-    POSITION_Y = "_tkSpace_offsetY",
-    POSITION_Z = "_tkSpace_offsetZ",
-    CONNECTED_TO = "_tkSpace_connectedTo",
-    FEATURE_HEIGHT = "_tkSpace_featureHeight",
-    FEATURE_LENGTH = "_tkSpace_featureWidth"
+    POSITION_X = "Start X",
+    POSITION_Y = "Start Y",
+    POSITION_Z = "Start Z",
+    HEIGHT = "Height",
+    LENGTH = "Length",
+    CONNECTED_TO = "Connected To"
 }
 export declare const SCALE = 0.02;
-export declare const SNAP_PROXIMITY = 16;
-export declare const ZOOM_MAX = 100;
-export declare const ZOOM_MIN = 20;
-export declare const ZOOM_DEFAULT = 40;
-export declare const TRANSLATE_MAX: ICoordinate2D;
-export declare const TRANSLATE_MIN: ICoordinate2D;
-export declare const TRANSLATE_DEFAULT: ICoordinate2D;
+export declare const SNAP_PROXIMITY = 10;
 export declare const MIN_WALL_LENGTH = 50;
 export declare const WALL_PADDING_FOR_FEATURE = 20;
 export declare const UNIT_LABELS: {