@threekit-tools/treble 0.0.91 → 0.0.92

package/dist/hooks/useSpaces/draw/drawFloor.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawFloorArea = exports.drawFloor = void 0;
+function drawFloor(canvas, enclosedSpaces, styles) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    if (!enclosedSpaces.length)
+        return;
+    for (var _i = 0, enclosedSpaces_1 = enclosedSpaces; _i < enclosedSpaces_1.length; _i++) {
+        var enclosedSpace = enclosedSpaces_1[_i];
+        var loop = enclosedSpace.loop;
+        ctx.fillStyle = styles.color;
+        ctx.beginPath();
+        ctx.moveTo.apply(ctx, loop[0]);
+        for (var i = 1; i < loop.length; i++)
+            ctx.lineTo.apply(ctx, loop[i]);
+        ctx.fill();
+    }
+}
+exports.drawFloor = drawFloor;
+function drawFloorArea(canvas, enclosedSpaces, styles) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    if (!enclosedSpaces.length)
+        return;
+    for (var _i = 0, enclosedSpaces_2 = enclosedSpaces; _i < enclosedSpaces_2.length; _i++) {
+        var enclosedSpace = enclosedSpaces_2[_i];
+        var center = enclosedSpace.center, area = enclosedSpace.area;
+        ctx.font = '20px Arial';
+        ctx.fillStyle = styles.textColor;
+        ctx.fillText(area, center[0], center[1]);
+    }
+}
+exports.drawFloorArea = drawFloorArea;

package/dist/hooks/useSpaces/draw/drawGrid.d.ts

@@ -0,0 +1,3 @@
+import { IGridToDraw, IStylesGrid } from '../types';
+declare function drawGrid(canvas: HTMLCanvasElement, grid: IGridToDraw, styles: IStylesGrid): void;
+export default drawGrid;

package/dist/hooks/useSpaces/draw/drawGrid.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function drawGrid(canvas, grid, styles) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var unitLength = grid.unitLength, offset = grid.offset, subdivisions = grid.subdivisions;
+    var showSubdivisions = styles.showSubdivisions &&
+        unitLength / subdivisions > styles.subdivisionThreshold;
+    var length = showSubdivisions ? unitLength / subdivisions : unitLength;
+    ctx.strokeStyle = styles.lineColor;
+    var numHorizontalLines = Math.ceil(canvas.height / length) +
+        1 * (showSubdivisions ? subdivisions : 1);
+    var numVerticalLines = Math.ceil(canvas.width / length) +
+        1 * (showSubdivisions ? subdivisions : 1);
+    for (var i = 0; i < numHorizontalLines; i++) {
+        var y = i * length + offset[1];
+        ctx.lineWidth = showSubdivisions && i % subdivisions === 0 ? 2 : 1;
+        ctx.beginPath();
+        ctx.moveTo(0, y);
+        ctx.lineTo(canvas.width, y);
+        ctx.stroke();
+    }
+    for (var i = 0; i < numVerticalLines; i++) {
+        var x = i * length + offset[0];
+        ctx.lineWidth = showSubdivisions && i % subdivisions === 0 ? 2 : 1;
+        ctx.beginPath();
+        ctx.moveTo(x, 0);
+        ctx.lineTo(x, canvas.height);
+        ctx.stroke();
+    }
+}
+exports.default = drawGrid;

package/dist/hooks/useSpaces/draw/drawGuides.d.ts

@@ -0,0 +1,3 @@
+import { GUIDE_ORIENTATIONS, ICoordinate2D, IStylesGuides } from '../types';
+declare function drawGuides(canvas: HTMLCanvasElement, point: ICoordinate2D, orientations: Array<GUIDE_ORIENTATIONS>, style: IStylesGuides): void;
+export default drawGuides;

package/dist/hooks/useSpaces/draw/drawGuides.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var types_1 = require("../types");
+function drawGuides(canvas, point, orientations, style) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    ctx.strokeStyle = style.color;
+    ctx.lineWidth = style.thickness;
+    if (orientations.includes(types_1.GUIDE_ORIENTATIONS.VERTICAL)) {
+        ctx.beginPath();
+        ctx.moveTo(point[0], 0);
+        ctx.lineTo(point[0], canvas.height);
+        ctx.stroke();
+    }
+    if (orientations.includes(types_1.GUIDE_ORIENTATIONS.HORIZONTAL)) {
+        ctx.beginPath();
+        ctx.moveTo(0, point[1]);
+        ctx.lineTo(canvas.width, point[1]);
+        ctx.stroke();
+    }
+}
+exports.default = drawGuides;

package/dist/hooks/useSpaces/draw/drawOpenings.d.ts

@@ -0,0 +1,9 @@
+import { IFeature, ISpacesStyles } from '../types';
+import { IWallToDraw } from './drawWalls';
+declare function drawOpenings(canvas: HTMLCanvasElement, walls: Array<IWallToDraw>, openings: Array<IFeature>, selections: {
+    active: Array<number>;
+    highlighted: Array<number>;
+    error: Array<number>;
+    hidden: Array<number>;
+}, styles: ISpacesStyles): void;
+export default drawOpenings;

package/dist/hooks/useSpaces/draw/drawOpenings.js

@@ -0,0 +1,72 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var geometry_1 = require("../geometry");
+var types_1 = require("../types");
+function drawOpening(canvas, wall, offset, length, style, mode) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var openingLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(wall.line, offset, length);
+    var points = (0, geometry_1.addThicknessToLine)(openingLine, style.thickness);
+    var stroke = style.stroke, fill = style.fill, strokeWidth = style.strokeWidth;
+    if (mode) {
+        stroke = style[mode].stroke;
+        fill = style[mode].fill;
+    }
+    ctx.fillStyle = 'white';
+    ctx.beginPath();
+    ctx.moveTo.apply(ctx, points[0]);
+    for (var i = 1; i < points.length; i++) {
+        ctx.lineTo.apply(ctx, points[i]);
+    }
+    ctx.lineTo.apply(ctx, points[0]);
+    ctx.fill();
+    ctx.beginPath();
+    ctx.strokeStyle = stroke || fill;
+    ctx.fillStyle = fill;
+    ctx.lineWidth = strokeWidth || 1;
+    ctx.setLineDash([10, 10]);
+    ctx.moveTo.apply(ctx, openingLine[0]);
+    ctx.lineTo.apply(ctx, openingLine[1]);
+    ctx.stroke();
+    ctx.closePath();
+    ctx.beginPath();
+    ctx.setLineDash([]);
+    var angle = (0, geometry_1.getAngleOfLineSegment)(openingLine);
+    ctx.arc(openingLine[0][0], openingLine[0][1], style.thickness / 2, angle - Math.PI / 2, angle + Math.PI / 2);
+    ctx.fill();
+    ctx.closePath();
+    ctx.beginPath();
+    ctx.arc(openingLine[1][0], openingLine[1][1], style.thickness / 2, angle + Math.PI / 2, angle - Math.PI / 2);
+    ctx.fill();
+}
+function drawOpenings(canvas, walls, openings, selections, styles) {
+    var styled = [
+        selections.active,
+        selections.highlighted,
+        selections.error,
+        selections.hidden,
+    ];
+    var defaultOpenings = openings.reduce(function (output, _, i) {
+        if (!styled.flat().includes(i))
+            output.push(i);
+        return output;
+    }, []);
+    var openingsMap = [
+        [types_1.IElementStyleModes.ACTIVE, selections.active],
+        [types_1.IElementStyleModes.HIGHLIGHT, selections.highlighted],
+        [types_1.IElementStyleModes.ERROR, selections.error],
+        [undefined, defaultOpenings],
+    ];
+    openingsMap.forEach(function (_a) {
+        var mode = _a[0], openingsIndexes = _a[1];
+        return openingsIndexes.forEach(function (index) {
+            var opening = openings[index];
+            if (!(opening === null || opening === void 0 ? void 0 : opening.connectedTo.length))
+                return;
+            var wallIndex = opening.connectedTo[1];
+            drawOpening(canvas, walls[wallIndex], opening.offset, opening.length, styles.feature, mode);
+        });
+    });
+}
+exports.default = drawOpenings;

package/dist/hooks/useSpaces/draw/drawVertices.d.ts

@@ -0,0 +1,8 @@
+import { ICoordinate2D, IVertex, IElementStyleModes, IStylesVertex } from '../types';
+export declare function drawVertex(canvas: HTMLCanvasElement, point: ICoordinate2D, style: IStylesVertex, mode?: IElementStyleModes): void;
+export declare function drawVertices(canvas: HTMLCanvasElement, vertices: Array<IVertex>, selections: {
+    active: Array<number>;
+    highlighted: Array<number>;
+    error: Array<number>;
+    hidden: Array<number>;
+}, styles: IStylesVertex): void;

package/dist/hooks/useSpaces/draw/drawVertices.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawVertices = exports.drawVertex = void 0;
+var types_1 = require("../types");
+function drawVertex(canvas, point, style, mode) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var stroke = style.stroke, innerFill = style.innerFill, outerFill = style.outerFill, strokeWidth = style.strokeWidth, outerRadius = style.outerRadius;
+    if (mode) {
+        stroke = style[mode].stroke;
+        innerFill = style[mode].innerFill;
+        outerFill = style[mode].outerFill;
+    }
+    ctx.lineWidth = strokeWidth || 1;
+    ctx.strokeStyle = stroke || innerFill;
+    ctx.fillStyle = outerFill;
+    if (outerRadius) {
+        ctx.beginPath();
+        ctx.arc(point[0], point[1], outerRadius, 0, 2 * Math.PI);
+        if (style.strokeWidth)
+            ctx.stroke();
+        ctx.fill();
+    }
+    ctx.lineWidth = strokeWidth || 1;
+    ctx.fillStyle = innerFill;
+    ctx.strokeStyle = stroke || innerFill;
+    ctx.beginPath();
+    ctx.arc(point[0], point[1], style.innerRadius, 0, 2 * Math.PI);
+    ctx.fill();
+    if (!outerRadius && strokeWidth)
+        ctx.stroke();
+}
+exports.drawVertex = drawVertex;
+function drawVertices(canvas, vertices, selections, styles) {
+    var styled = [
+        selections.active,
+        selections.highlighted,
+        selections.error,
+        selections.hidden,
+    ];
+    var defaultOpenings = vertices.reduce(function (output, _, i) {
+        if (!styled.flat().includes(i))
+            output.push(i);
+        return output;
+    }, []);
+    var verticesMap = [
+        [types_1.IElementStyleModes.ACTIVE, selections.active],
+        [types_1.IElementStyleModes.HIGHLIGHT, selections.highlighted],
+        [types_1.IElementStyleModes.ERROR, selections.error],
+        [undefined, defaultOpenings],
+    ];
+    verticesMap.forEach(function (_a) {
+        var mode = _a[0], vertexIndexes = _a[1];
+        return vertexIndexes.forEach(function (index) {
+            var point = vertices[index].point;
+            drawVertex(canvas, point, styles, mode);
+        });
+    });
+}
+exports.drawVertices = drawVertices;

package/dist/hooks/useSpaces/draw/drawWalls.d.ts

@@ -0,0 +1,10 @@
+import { IWall, ICoordinatesLine, ISpacesStyles, IStylesWall, IElementStyleModes } from '../types';
+export interface IWallToDraw extends Pick<IWall, 'line' | 'path' | 'visible'> {
+}
+export declare function drawNewWall(canvas: HTMLCanvasElement, line: ICoordinatesLine, styles: ISpacesStyles, mode?: IElementStyleModes.ERROR): void;
+export declare function drawWalls(canvas: HTMLCanvasElement, walls: Array<IWallToDraw>, selections: {
+    active: Array<number>;
+    highlighted: Array<number>;
+    error: Array<number>;
+    hidden: Array<number>;
+}, styles: IStylesWall): void;

package/dist/hooks/useSpaces/draw/drawWalls.js

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawWalls = exports.drawNewWall = void 0;
+var types_1 = require("../types");
+var geometry_1 = require("../geometry");
+var drawVertices_1 = require("./drawVertices");
+function drawInvisibleWall(canvas, wall, style, mode) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var stroke = style.stroke, fill = style.fill;
+    if (mode) {
+        stroke = style[mode].stroke;
+        fill = style[mode].fill;
+    }
+    ctx.strokeStyle = stroke || fill;
+    ctx.fillStyle = fill;
+    ctx.lineWidth = style.thickness;
+    ctx.beginPath();
+    ctx.setLineDash([10, 10]);
+    ctx.moveTo.apply(ctx, wall.line[0]);
+    ctx.lineTo.apply(ctx, wall.line[1]);
+    ctx.stroke();
+    ctx.closePath();
+    ctx.beginPath();
+    ctx.setLineDash([]);
+}
+function drawWall(canvas, wall, style, mode) {
+    var _a;
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var path = (_a = wall.path) !== null && _a !== void 0 ? _a : (0, geometry_1.addThicknessToLine)(wall.line, style.thickness);
+    var stroke = style.stroke, fill = style.fill, strokeWidth = style.strokeWidth;
+    if (mode) {
+        stroke = style[mode].stroke;
+        fill = style[mode].fill;
+    }
+    ctx.strokeStyle = stroke || fill;
+    ctx.fillStyle = fill;
+    ctx.lineWidth = strokeWidth || 1;
+    ctx.beginPath();
+    ctx.moveTo.apply(ctx, path[0]);
+    for (var i = 1; i < path.length; i++) {
+        ctx.lineTo.apply(ctx, path[i]);
+    }
+    ctx.lineTo.apply(ctx, path[0]);
+    ctx.fill();
+    if (style.stroke && style.strokeWidth)
+        ctx.stroke();
+}
+function drawNewWall(canvas, line, styles, mode) {
+    drawWall(canvas, {
+        line: line,
+        path: (0, geometry_1.addThicknessToLine)(line, styles.wall.thickness),
+    }, styles.wall, mode !== null && mode !== void 0 ? mode : types_1.IElementStyleModes.ACTIVE);
+    line.forEach(function (point) {
+        return (0, drawVertices_1.drawVertex)(canvas, point, styles.vertex, mode !== null && mode !== void 0 ? mode : types_1.IElementStyleModes.HIGHLIGHT);
+    });
+}
+exports.drawNewWall = drawNewWall;
+function drawWalls(canvas, walls, selections, styles) {
+    var styled = [
+        selections.active,
+        selections.highlighted,
+        selections.error,
+        selections.hidden,
+    ];
+    var defaultOpenings = walls.reduce(function (output, _, i) {
+        if (!styled.flat().includes(i))
+            output.push(i);
+        return output;
+    }, []);
+    var wallsMap = [
+        [types_1.IElementStyleModes.ACTIVE, selections.active],
+        [types_1.IElementStyleModes.HIGHLIGHT, selections.highlighted],
+        [types_1.IElementStyleModes.ERROR, selections.error],
+        [undefined, defaultOpenings],
+    ];
+    wallsMap.forEach(function (_a) {
+        var mode = _a[0], wallIndexes = _a[1];
+        return wallIndexes.forEach(function (index) {
+            var draw = walls[index].visible ? drawWall : drawInvisibleWall;
+            draw(canvas, walls[index], styles, mode);
+        });
+    });
+}
+exports.drawWalls = drawWalls;

package/dist/hooks/useSpaces/draw/drawWindows.d.ts

@@ -0,0 +1,9 @@
+import { IFeature, ISpacesStyles } from '../types';
+import { IWallToDraw } from './drawWalls';
+declare function drawWindows(canvas: HTMLCanvasElement, walls: Array<IWallToDraw>, windows: Array<IFeature>, selections: {
+    active: Array<number>;
+    highlighted: Array<number>;
+    error: Array<number>;
+    hidden: Array<number>;
+}, styles: ISpacesStyles): void;
+export default drawWindows;

package/dist/hooks/useSpaces/draw/drawWindows.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var geometry_1 = require("../geometry");
+var types_1 = require("../types");
+function drawWindow(canvas, wall, offset, length, style, mode) {
+    var ctx = canvas.getContext('2d');
+    if (!ctx)
+        return;
+    var windowLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(wall.line, offset, length);
+    var windowRectangleLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(wall.line, offset + style.thickness / 2, length - style.thickness);
+    var points = (0, geometry_1.addThicknessToLine)(windowLine, style.thickness);
+    var rectanglePoints = (0, geometry_1.addThicknessToLine)(windowRectangleLine, style.thickness);
+    var stroke = style.stroke, fill = style.fill, strokeWidth = style.strokeWidth;
+    if (mode) {
+        stroke = style[mode].stroke;
+        fill = style[mode].fill;
+    }
+    ctx.fillStyle = 'white';
+    ctx.beginPath();
+    ctx.moveTo.apply(ctx, points[0]);
+    for (var i = 1; i < points.length; i++) {
+        ctx.lineTo.apply(ctx, points[i]);
+    }
+    ctx.lineTo.apply(ctx, points[0]);
+    ctx.fill();
+    ctx.closePath();
+    ctx.strokeStyle = stroke || fill;
+    ctx.fillStyle = fill;
+    ctx.lineWidth = strokeWidth || 1;
+    ctx.moveTo.apply(ctx, rectanglePoints[0]);
+    ctx.beginPath();
+    for (var i = 1; i < points.length; i++) {
+        ctx.lineTo.apply(ctx, rectanglePoints[i]);
+    }
+    ctx.lineTo.apply(ctx, rectanglePoints[0]);
+    ctx.fill();
+    ctx.closePath();
+    ctx.beginPath();
+    ctx.moveTo.apply(ctx, windowLine[0]);
+    ctx.lineTo.apply(ctx, windowLine[1]);
+    if (style.stroke)
+        ctx.stroke();
+    ctx.closePath();
+    var angle = (0, geometry_1.getAngleOfLineSegment)(windowLine);
+    ctx.beginPath();
+    ctx.arc(windowLine[0][0], windowLine[0][1], style.thickness / 2, angle - Math.PI / 2, angle + Math.PI / 2);
+    ctx.fill();
+    ctx.closePath();
+    ctx.beginPath();
+    ctx.arc(windowLine[1][0], windowLine[1][1], style.thickness / 2, angle + Math.PI / 2, angle - Math.PI / 2);
+    ctx.fill();
+}
+function drawWindows(canvas, walls, windows, selections, styles) {
+    var styled = [
+        selections.active,
+        selections.highlighted,
+        selections.error,
+        selections.hidden,
+    ];
+    var defaultOpenings = windows.reduce(function (output, _, i) {
+        if (!styled.flat().includes(i))
+            output.push(i);
+        return output;
+    }, []);
+    var windowsMap = [
+        [types_1.IElementStyleModes.ACTIVE, selections.active],
+        [types_1.IElementStyleModes.HIGHLIGHT, selections.highlighted],
+        [types_1.IElementStyleModes.ERROR, selections.error],
+        [undefined, defaultOpenings],
+    ];
+    windowsMap.forEach(function (_a) {
+        var mode = _a[0], windowIndexes = _a[1];
+        return windowIndexes.forEach(function (index) {
+            var window = windows[index];
+            if (!(window === null || window === void 0 ? void 0 : window.connectedTo.length))
+                return;
+            var wallIndex = window.connectedTo[1];
+            drawWindow(canvas, walls[wallIndex], window.offset, window.length, styles.feature, mode);
+        });
+    });
+}
+exports.default = drawWindows;

package/dist/hooks/useSpaces/draw/index.d.ts

@@ -0,0 +1,11 @@
+import { IElementAddress, IEnclosedSpace, IFeatures, IGridToDraw, IGuides, ILineDimensions, ISpacesConfigInternal, IVertex } from '../types';
+import { drawDimensions } from './drawDimensions';
+import { drawVertex } from './drawVertices';
+import { IWallToDraw, drawNewWall } from './drawWalls';
+export { drawNewWall, drawVertex, drawDimensions };
+export declare function drawSpaces(canvas: HTMLCanvasElement, grid: IGridToDraw, enclosedSpaces: Array<IEnclosedSpace>, walls: Array<IWallToDraw>, vertices: Array<IVertex>, features: IFeatures, dimensions: Array<ILineDimensions> | undefined, guides: null | IGuides, selections: {
+    active?: Array<IElementAddress> | IElementAddress;
+    highlighted?: Array<IElementAddress> | IElementAddress;
+    hidden?: Array<IElementAddress> | IElementAddress;
+    error?: Array<IElementAddress> | IElementAddress;
+}, config: ISpacesConfigInternal): void;

package/dist/hooks/useSpaces/draw/index.js

@@ -0,0 +1,129 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawSpaces = exports.drawDimensions = exports.drawVertex = exports.drawNewWall = void 0;
+var types_1 = require("../types");
+var clearCanvas_1 = __importDefault(require("./clearCanvas"));
+var drawBackground_1 = __importDefault(require("./drawBackground"));
+var drawDimensions_1 = require("./drawDimensions");
+Object.defineProperty(exports, "drawDimensions", { enumerable: true, get: function () { return drawDimensions_1.drawDimensions; } });
+var drawDoors_1 = __importDefault(require("./drawDoors"));
+var drawFloor_1 = require("./drawFloor");
+var drawGrid_1 = __importDefault(require("./drawGrid"));
+var drawGuides_1 = __importDefault(require("./drawGuides"));
+var drawOpenings_1 = __importDefault(require("./drawOpenings"));
+var drawVertices_1 = require("./drawVertices");
+Object.defineProperty(exports, "drawVertex", { enumerable: true, get: function () { return drawVertices_1.drawVertex; } });
+var drawWalls_1 = require("./drawWalls");
+Object.defineProperty(exports, "drawNewWall", { enumerable: true, get: function () { return drawWalls_1.drawNewWall; } });
+var drawWindows_1 = __importDefault(require("./drawWindows"));
+function drawElements(canvas, walls, vertices, features, selections, styles) {
+    var wallSelections = {
+        active: [],
+        highlighted: [],
+        hidden: [],
+        error: [],
+    };
+    var verticesSelections = {
+        active: [],
+        highlighted: [],
+        hidden: [],
+        error: [],
+    };
+    var windowSelections = {
+        active: [],
+        highlighted: [],
+        hidden: [],
+        error: [],
+    };
+    var doorSelections = {
+        active: [],
+        highlighted: [],
+        hidden: [],
+        error: [],
+    };
+    var openingSelections = {
+        active: [],
+        highlighted: [],
+        hidden: [],
+        error: [],
+    };
+    selections.active.forEach(function (address) {
+        if (address.type === types_1.IElements.WALL)
+            wallSelections.active.push(address.index);
+        else if (address.type === types_1.IElements.VERTEX)
+            verticesSelections.active.push(address.index);
+        else if (address.type === types_1.IElements.WINDOW)
+            windowSelections.active.push(address.index);
+        else if (address.type === types_1.IElements.DOOR)
+            doorSelections.active.push(address.index);
+        else if (address.type === types_1.IElements.OPENING)
+            openingSelections.active.push(address.index);
+    });
+    selections.highlighted.forEach(function (address) {
+        if (address.type === types_1.IElements.WALL)
+            wallSelections.highlighted.push(address.index);
+        else if (address.type === types_1.IElements.VERTEX)
+            verticesSelections.highlighted.push(address.index);
+        else if (address.type === types_1.IElements.WINDOW)
+            windowSelections.highlighted.push(address.index);
+        else if (address.type === types_1.IElements.DOOR)
+            doorSelections.highlighted.push(address.index);
+        else if (address.type === types_1.IElements.OPENING)
+            openingSelections.highlighted.push(address.index);
+    });
+    selections.hidden.forEach(function (address) {
+        if (address.type === types_1.IElements.WALL)
+            wallSelections.hidden.push(address.index);
+        else if (address.type === types_1.IElements.VERTEX)
+            verticesSelections.hidden.push(address.index);
+        else if (address.type === types_1.IElements.WINDOW)
+            windowSelections.hidden.push(address.index);
+        else if (address.type === types_1.IElements.DOOR)
+            doorSelections.hidden.push(address.index);
+        else if (address.type === types_1.IElements.OPENING)
+            openingSelections.hidden.push(address.index);
+    });
+    selections.error.forEach(function (address) {
+        if (address.type === types_1.IElements.WALL)
+            wallSelections.error.push(address.index);
+        else if (address.type === types_1.IElements.VERTEX)
+            verticesSelections.error.push(address.index);
+        else if (address.type === types_1.IElements.WINDOW)
+            windowSelections.error.push(address.index);
+        else if (address.type === types_1.IElements.DOOR)
+            doorSelections.error.push(address.index);
+        else if (address.type === types_1.IElements.OPENING)
+            openingSelections.error.push(address.index);
+    });
+    (0, drawWalls_1.drawWalls)(canvas, walls, wallSelections, styles.wall);
+    (0, drawVertices_1.drawVertices)(canvas, vertices, verticesSelections, styles.vertex);
+    if (features[types_1.IElements.WINDOW])
+        (0, drawWindows_1.default)(canvas, walls, features[types_1.IElements.WINDOW] || [], windowSelections, styles);
+    if (features[types_1.IElements.DOOR])
+        (0, drawDoors_1.default)(canvas, walls, features[types_1.IElements.DOOR] || [], doorSelections, styles);
+    if (features[types_1.IElements.OPENING])
+        (0, drawOpenings_1.default)(canvas, walls, features[types_1.IElements.OPENING] || [], openingSelections, styles);
+}
+function drawSpaces(canvas, grid, enclosedSpaces, walls, vertices, features, dimensions, guides, selections, config) {
+    var preppedSelections = {
+        active: [(selections === null || selections === void 0 ? void 0 : selections.active) || []].flat(),
+        highlighted: [(selections === null || selections === void 0 ? void 0 : selections.highlighted) || []].flat(),
+        error: [(selections === null || selections === void 0 ? void 0 : selections.error) || []].flat(),
+        hidden: [(selections === null || selections === void 0 ? void 0 : selections.hidden) || []].flat(),
+    };
+    (0, clearCanvas_1.default)(canvas);
+    (0, drawBackground_1.default)(canvas, config.styles.grid.backgroundColor);
+    (0, drawGrid_1.default)(canvas, grid, config.styles.grid);
+    (0, drawFloor_1.drawFloor)(canvas, enclosedSpaces, config.styles.floor);
+    drawElements(canvas, walls, vertices, features, preppedSelections, config.styles);
+    if (dimensions) {
+        (0, drawDimensions_1.drawDimensions)(canvas, dimensions, config);
+        (0, drawFloor_1.drawFloorArea)(canvas, enclosedSpaces, config.styles.floor);
+    }
+    if (guides)
+        (0, drawGuides_1.default)(canvas, guides.point, guides.orientations, config.styles.guides);
+}
+exports.drawSpaces = drawSpaces;

package/dist/hooks/useSpaces/geometry/addThicknessToLine.d.ts

@@ -0,0 +1,3 @@
+import { ICoordinatesLine, ICoordinatesQuadrilateral } from '../types';
+declare function addThicknessToLine(line: ICoordinatesLine, thickness: number): ICoordinatesQuadrilateral;
+export default addThicknessToLine;

package/dist/hooks/useSpaces/geometry/addThicknessToLine.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var getParallelLineSegmentAtDistance_1 = __importDefault(require("./getParallelLineSegmentAtDistance"));
+function addThicknessToLine(line, thickness) {
+    var offset = thickness / 2;
+    var _a = (0, getParallelLineSegmentAtDistance_1.default)(line, offset), point1 = _a[0], point2 = _a[1];
+    var _b = (0, getParallelLineSegmentAtDistance_1.default)(line, -offset), point4 = _b[0], point3 = _b[1];
+    return [point1, point2, point3, point4];
+}
+exports.default = addThicknessToLine;

package/dist/hooks/useSpaces/geometry/areLinesEqual.d.ts

@@ -0,0 +1,3 @@
+import { ICoordinatesLine } from '../types';
+declare function areLinesEqual(line1: ICoordinatesLine, line2: ICoordinatesLine): boolean;
+export default areLinesEqual;

package/dist/hooks/useSpaces/geometry/areLinesEqual.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var arePointsEqual_1 = __importDefault(require("./arePointsEqual"));
+function areLinesEqual(line1, line2) {
+    if (!line1 || !line2)
+        return false;
+    if (((0, arePointsEqual_1.default)(line1[0], line2[0]) &&
+        (0, arePointsEqual_1.default)(line1[1], line2[1])) ||
+        ((0, arePointsEqual_1.default)(line1[0], line2[1]) && (0, arePointsEqual_1.default)(line1[1], line2[0]))) {
+        return true;
+    }
+    return false;
+}
+exports.default = areLinesEqual;

package/dist/hooks/useSpaces/geometry/arePointsEqual.d.ts

@@ -0,0 +1,3 @@
+import { ICoordinate2D } from '../types';
+declare function arePointsEqual(point1: ICoordinate2D, point2: ICoordinate2D): boolean;
+export default arePointsEqual;

package/dist/hooks/useSpaces/geometry/arePointsEqual.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function arePointsEqual(point1, point2) {
+    if (!point1 || !point2)
+        return false;
+    return point1[0] === point2[0] && point1[1] === point2[1];
+}
+exports.default = arePointsEqual;

package/dist/hooks/useSpaces/geometry/arePointsWithinProximity.d.ts

@@ -0,0 +1,3 @@
+import { ICoordinate2D } from '../types';
+declare function arePointsWithinProximity(point1: ICoordinate2D, point2: ICoordinate2D, proximity: number): boolean;
+export default arePointsWithinProximity;