@threekit-tools/treble 0.0.94 → 0.0.95-next-01

package/dist/hooks/useRoomBuilder/geometry.js

@@ -1,325 +0,0 @@
-"use strict";
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.doLinesOverlap = exports.getAllLineIntersections = exports.getTangetIntersectionAndOffset = exports.orderCoordinatesOnLineSegment = exports.splitLineAtOffset = exports.splitLineAtPoints = exports.splitLineAtPoint = exports.getLineSegmentsIntersection = exports.isPointInPolygon = exports.isPointInQuadrilateral = exports.arePointsWithinProximity = exports.addThicknessToLine = exports.getParallelLineSegmentAtDistance = exports.getPolygonArea = exports.closestPointOnLine = exports.getDistanceToLine = exports.getLineMidpoint = exports.getLineAtOffsetOnLineSegment = exports.getPointAtOffsetOnLineSegment = exports.getAngleOfLineSegment = exports.getMidpointOfLineSegment = exports.getLengthOfLineSegment = exports.getLineOtherPoint = exports.areLinesEqual = exports.arePointsEqual = exports.euclideanMod = void 0;
-function euclideanMod(n, m) {
-    return ((n % m) + m) % m;
-}
-exports.euclideanMod = euclideanMod;
-function arePointsEqual(point1, point2) {
-    if (!point1 || !point2)
-        return false;
-    return point1[0] === point2[0] && point1[1] === point2[1];
-}
-exports.arePointsEqual = arePointsEqual;
-function areLinesEqual(line1, line2) {
-    if (!line1 || !line2)
-        return false;
-    if ((arePointsEqual(line1[0], line2[0]) &&
-        arePointsEqual(line1[1], line2[1])) ||
-        (arePointsEqual(line1[0], line2[1]) && arePointsEqual(line1[1], line2[0]))) {
-        return true;
-    }
-    return false;
-}
-exports.areLinesEqual = areLinesEqual;
-function getLineOtherPoint(line, point) {
-    var eq0 = arePointsEqual(line[0], point);
-    var eq1 = arePointsEqual(line[1], point);
-    if (eq0 === eq1)
-        console.warn('Unexpected. Is your wall of 0 length?', JSON.parse(JSON.stringify({ line: line, point: point })));
-    return eq0 ? line[1] : line[0];
-}
-exports.getLineOtherPoint = getLineOtherPoint;
-function getLengthOfLineSegment(line) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    return Math.sqrt(Math.pow((x2 - x1), 2) + Math.pow((y2 - y1), 2));
-}
-exports.getLengthOfLineSegment = getLengthOfLineSegment;
-function getUnitVectorOfLineSegment(line) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var magnitude = getLengthOfLineSegment(line);
-    return [(x2 - x1) / magnitude, (y2 - y1) / magnitude];
-}
-function getMidpointOfLineSegment(line) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var xMidpoint = (x1 + x2) / 2;
-    var yMidpoint = (y1 + y2) / 2;
-    return [xMidpoint, yMidpoint];
-}
-exports.getMidpointOfLineSegment = getMidpointOfLineSegment;
-function getAngleOfLineSegment(line) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    return Math.atan2(y2 - y1, x2 - x1);
-}
-exports.getAngleOfLineSegment = getAngleOfLineSegment;
-function getPointAtOffsetOnLineSegment(line, offset) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var d = Math.sqrt(Math.pow((x2 - x1), 2) + Math.pow((y2 - y1), 2));
-    var r = offset / d;
-    var x = x1 + r * (x2 - x1);
-    var y = y1 + r * (y2 - y1);
-    return [x, y];
-}
-exports.getPointAtOffsetOnLineSegment = getPointAtOffsetOnLineSegment;
-function getLineAtOffsetOnLineSegment(line, offset, length) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var d = Math.sqrt(Math.pow((x2 - x1), 2) + Math.pow((y2 - y1), 2));
-    var startRatio = offset / d;
-    var endRatio = (offset + length) / d;
-    var startX = x1 + startRatio * (x2 - x1);
-    var startY = y1 + startRatio * (y2 - y1);
-    var endX = x1 + endRatio * (x2 - x1);
-    var endY = y1 + endRatio * (y2 - y1);
-    return [
-        [startX, startY],
-        [endX, endY],
-    ];
-}
-exports.getLineAtOffsetOnLineSegment = getLineAtOffsetOnLineSegment;
-function getLineMidpoint(line) {
-    var x = (line[0][0] + line[1][0]) / 2;
-    var y = (line[0][1] + line[1][1]) / 2;
-    return [x, y];
-}
-exports.getLineMidpoint = getLineMidpoint;
-function getDistanceToLine(pointOnLine, angle, point) {
-    var x1 = point[0], y1 = point[1];
-    var x2 = pointOnLine[0], y2 = pointOnLine[1];
-    var dx = Math.cos(angle);
-    var dy = Math.sin(angle);
-    return (Math.abs((y1 - y2) * dx - (x1 - x2) * dy) / Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2)));
-}
-exports.getDistanceToLine = getDistanceToLine;
-function closestPointOnLine(pointOnLine, angle, point) {
-    var x1 = point[0], y1 = point[1];
-    var x2 = pointOnLine[0], y2 = pointOnLine[1];
-    var dx = Math.cos(angle);
-    var dy = Math.sin(angle);
-    var t = ((x1 - x2) * dx + (y1 - y2) * dy) / (dx * dx + dy * dy);
-    var x = x2 + t * dx;
-    var y = y2 + t * dy;
-    return [x, y];
-}
-exports.closestPointOnLine = closestPointOnLine;
-function getQuadrilateralArea(quadrilateral) {
-    var _a = quadrilateral.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3], x3 = _a[4], y3 = _a[5], x4 = _a[6], y4 = _a[7];
-    var area = Math.abs((x1 * y2 +
-        x2 * y3 +
-        x3 * y4 +
-        x4 * y1 -
-        x2 * y1 -
-        x3 * y2 -
-        x4 * y3 -
-        x1 * y4) /
-        2);
-    return area;
-}
-function getTriangleArea(point1, point2, point3) {
-    return ((point1[0] * (point2[1] - point3[1]) +
-        point2[0] * (point3[1] - point1[1]) +
-        point3[0] * (point1[1] - point2[1])) /
-        2);
-}
-function getPolygonArea(polygon) {
-    var origin = [0, 0];
-    return polygon.reduce(function (sum, point1, i) {
-        var point2 = polygon[(i + 1) % polygon.length];
-        sum += getTriangleArea(origin, point1, point2);
-        return sum;
-    }, 0);
-}
-exports.getPolygonArea = getPolygonArea;
-function getParallelLineSegmentAtDistance(line, distance) {
-    if (!distance)
-        return line;
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var unitVector = getUnitVectorOfLineSegment(line);
-    var _b = distance > 0
-        ? [unitVector[1], -unitVector[0]]
-        : [-unitVector[1], unitVector[0]], xNormal = _b[0], yNormal = _b[1];
-    var length = Math.abs(distance);
-    var point1 = [x1 + xNormal * length, y1 + yNormal * length];
-    var point2 = [x2 + xNormal * length, y2 + yNormal * length];
-    return [point1, point2];
-}
-exports.getParallelLineSegmentAtDistance = getParallelLineSegmentAtDistance;
-function addThicknessToLine(line, thickness) {
-    var offset = thickness / 2;
-    var _a = getParallelLineSegmentAtDistance(line, offset), point1 = _a[0], point2 = _a[1];
-    var _b = getParallelLineSegmentAtDistance(line, -offset), point4 = _b[0], point3 = _b[1];
-    return [point1, point2, point3, point4];
-}
-exports.addThicknessToLine = addThicknessToLine;
-function arePointsWithinProximity(point1, point2, proximity) {
-    var length = getLengthOfLineSegment([point1, point2]);
-    return length <= proximity;
-}
-exports.arePointsWithinProximity = arePointsWithinProximity;
-function isPointInQuadrilateral(quadrilateral, point) {
-    var _a = quadrilateral.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3], x3 = _a[4], y3 = _a[5], x4 = _a[6], y4 = _a[7];
-    var pointX = point[0], pointY = point[1];
-    if (pointX < Math.min(x1, x2, x3, x4) ||
-        pointX > Math.max(x1, x2, x3, x4) ||
-        pointY < Math.min(y1, y2, y3, y4) ||
-        pointY > Math.max(y1, y2, y3, y4)) {
-        return false;
-    }
-    var area = getQuadrilateralArea(quadrilateral);
-    var area1 = getTriangleArea(point, quadrilateral[0], quadrilateral[1]);
-    var area2 = getTriangleArea(point, quadrilateral[1], quadrilateral[2]);
-    var area3 = getTriangleArea(point, quadrilateral[2], quadrilateral[3]);
-    var area4 = getTriangleArea(point, quadrilateral[3], quadrilateral[0]);
-    var compareArea = Math.abs(area1) + Math.abs(area2) + Math.abs(area3) + Math.abs(area4);
-    return Math.abs(Math.round(area) - Math.round(compareArea)) < 2;
-}
-exports.isPointInQuadrilateral = isPointInQuadrilateral;
-function isPointInPolygon(point, polygon) {
-    var ray = [
-        point,
-        [point[0] + Number.MAX_SAFE_INTEGER, point[1]],
-    ];
-    var intersectCount = 0;
-    for (var i = 0; i < polygon.length; i++) {
-        var polygonStart = polygon[i];
-        var polygonEnd = polygon[(i + 1) % polygon.length];
-        if (getLineSegmentsIntersection(ray, [polygonStart, polygonEnd]))
-            intersectCount++;
-    }
-    return intersectCount % 2 === 1;
-}
-exports.isPointInPolygon = isPointInPolygon;
-function getLineSegmentsIntersection(line1, line2) {
-    if (arePointsEqual.apply(void 0, line1) || arePointsEqual.apply(void 0, line2))
-        return null;
-    if (arePointsEqual(line1[0], line2[0]))
-        return null;
-    if (arePointsEqual(line1[0], line2[1]))
-        return null;
-    if (arePointsEqual(line1[1], line2[0]))
-        return null;
-    if (arePointsEqual(line1[1], line2[1]))
-        return null;
-    var _a = line1.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var _b = line2.flat(), x3 = _b[0], y3 = _b[1], x4 = _b[2], y4 = _b[3];
-    var a1 = y2 - y1;
-    var b1 = x1 - x2;
-    var c1 = a1 * x1 + b1 * y1;
-    var a2 = y4 - y3;
-    var b2 = x3 - x4;
-    var c2 = a2 * x3 + b2 * y3;
-    var determinant = a1 * b2 - a2 * b1;
-    if (determinant === 0)
-        return null;
-    var x = (b2 * c1 - b1 * c2) / determinant;
-    var y = (a1 * c2 - a2 * c1) / determinant;
-    if (x < Math.min(x1, x2) ||
-        x > Math.max(x1, x2) ||
-        x < Math.min(x3, x4) ||
-        x > Math.max(x3, x4))
-        return null;
-    if (y < Math.min(y1, y2) ||
-        y > Math.max(y1, y2) ||
-        y < Math.min(y3, y4) ||
-        y > Math.max(y3, y4))
-        return null;
-    return [x, y];
-}
-exports.getLineSegmentsIntersection = getLineSegmentsIntersection;
-function splitLineAtPoint(line, point) {
-    return [
-        [line[0], point],
-        [point, line[1]],
-    ];
-}
-exports.splitLineAtPoint = splitLineAtPoint;
-function splitLineAtPoints(line, points) {
-    if (!points.length)
-        return [line];
-    var orderedPoints = orderCoordinatesOnLineSegment(__spreadArray(__spreadArray([], line, true), points, true));
-    return (orderedPoints[0][0] === line[0][0] ? orderedPoints : orderedPoints.reverse()).reduce(function (output, point, i) {
-        if (!i)
-            return output;
-        else
-            output.push([orderedPoints[i - 1], point]);
-        return output;
-    }, []);
-}
-exports.splitLineAtPoints = splitLineAtPoints;
-function splitLineAtOffset(line, offset) {
-    var splitPoint = getPointAtOffsetOnLineSegment(line, offset);
-    return splitLineAtPoint(line, splitPoint);
-}
-exports.splitLineAtOffset = splitLineAtOffset;
-function orderCoordinatesOnLineSegment(points) {
-    if (!points)
-        return [];
-    if (points[0][0] === points[1][0])
-        return points.sort(function (a, b) { return a[1] - b[1]; });
-    else
-        return points.sort(function (a, b) { return a[0] - b[0]; });
-}
-exports.orderCoordinatesOnLineSegment = orderCoordinatesOnLineSegment;
-function getClosestPointOnLineSegment(line, point) {
-    var _a = line.flat(), x1 = _a[0], y1 = _a[1], x2 = _a[2], y2 = _a[3];
-    var lineVector = [x2 - x1, y2 - y1];
-    var pointVector = [point[0] - x1, point[1] - y1];
-    var lineLength = Math.pow(lineVector[0], 2) + Math.pow(lineVector[1], 2);
-    var dotProduct = (pointVector[0] * lineVector[0] + pointVector[1] * lineVector[1]) /
-        lineLength;
-    if (dotProduct < 0)
-        return [x1, y1];
-    if (dotProduct > 1)
-        return [x2, y2];
-    else
-        return [x1 + dotProduct * lineVector[0], y1 + dotProduct * lineVector[1]];
-}
-function getTangetIntersectionAndOffset(line, point) {
-    var interceptPoint = getClosestPointOnLineSegment(line, point);
-    if (!interceptPoint)
-        return undefined;
-    return {
-        point: interceptPoint,
-        offset: getLengthOfLineSegment([line[0], interceptPoint]),
-    };
-}
-exports.getTangetIntersectionAndOffset = getTangetIntersectionAndOffset;
-function getAllLineIntersections(line, lines) {
-    var lineStr = [JSON.stringify(line[0]), JSON.stringify(line[1])];
-    return lines.reduce(function (output, existingLine, i) {
-        if (existingLine === null)
-            return output;
-        var startStr = JSON.stringify(existingLine[0]);
-        var endStr = JSON.stringify(existingLine[1]);
-        if (lineStr.includes(startStr) || lineStr.includes(endStr))
-            return output;
-        var intersectionPoint = getLineSegmentsIntersection(line, existingLine);
-        if (!intersectionPoint)
-            return output;
-        output.push({ index: i, point: intersectionPoint });
-        return output;
-    }, []);
-}
-exports.getAllLineIntersections = getAllLineIntersections;
-function doLinesOverlap(line1, line2) {
-    var start1 = line1[0];
-    var end1 = line1[0] + line1[1];
-    var start2 = line2[0];
-    var end2 = line2[0] + line2[1];
-    if (start2 < start1 && start1 < end2)
-        return true;
-    if (start2 < end1 && end1 < end2)
-        return true;
-    if (start1 < start2 && start2 < end1 && start1 < end2 && end2 < end1)
-        return true;
-    return false;
-}
-exports.doLinesOverlap = doLinesOverlap;

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

@@ -1,40 +0,0 @@
-import React from 'react';
-import type { IHydratedAttributeArray } from '../../types';
-import type { IElementName, IElementPublic, IRoomBuilderHookProps } from './types';
-import { IModes, IUnits, IElements } from './types';
-import { IThemes } from './themes';
-interface IUseRoomBuilder {
-    canvasRef: React.RefObject<HTMLCanvasElement>;
-    [IElements.WALL]?: IHydratedAttributeArray;
-    [IElements.WINDOW]?: IHydratedAttributeArray;
-    [IElements.DOOR]?: IHydratedAttributeArray;
-    [IElements.OPENING]?: IHydratedAttributeArray;
-    selectedElement: IElementPublic | null;
-    reset: () => void;
-    deleteElement: (type: IElementName, index: number) => void;
-    dimensions: {
-        enabled: boolean;
-        handleToggle: (val?: boolean) => void;
-    };
-    angleSnapping: {
-        enabled: boolean;
-        handleToggle: (val?: boolean) => void;
-    };
-    mode: {
-        value: IModes;
-        options: Array<{
-            label: IModes;
-            value: IModes;
-            selected: boolean;
-            handleSelect: () => void;
-        }>;
-        handleChange: (mode: IModes) => void;
-    };
-}
-declare const useRoomBuilder: {
-    (props: IRoomBuilderHookProps): IUseRoomBuilder;
-    themes: typeof IThemes;
-    units: typeof IUnits;
-    modes: typeof IModes;
-};
-export default useRoomBuilder;

package/dist/hooks/useRoomBuilder/index.js

@@ -1,303 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
-var types_1 = require("./types");
-var useConfigurator_1 = __importDefault(require("../useConfigurator"));
-var RoomBuilderState_1 = __importDefault(require("./RoomBuilderState"));
-var constants_1 = require("./constants");
-var themes_1 = __importStar(require("./themes"));
-var useRoomBuilder = function (props) {
-    var _a;
-    var attributesState = (0, useConfigurator_1.default)()[0];
-    var _b = (0, react_1.useState)(types_1.IModes.DRAW), modeValue = _b[0], setMode = _b[1];
-    var _c = (0, react_1.useState)(true), showDimensions = _c[0], setShowDimensions = _c[1];
-    var _d = (0, react_1.useState)(true), angleSnappingEnabled = _d[0], setAngleSnappingEnabled = _d[1];
-    var _e = (0, react_1.useState)(null), selectedElement = _e[0], setSelectedElement = _e[1];
-    var _f = (0, react_1.useState)(null), selectedWallAsset = _f[0], setSelectedWallAsset = _f[1];
-    var canvasRef = (0, react_1.useRef)(null);
-    var selectElementPending = (0, react_1.useRef)(null);
-    var preppedConfig = Object.assign({
-        scale: constants_1.SCALE,
-        unit: types_1.IUnits.FEET,
-        snapProximity: constants_1.SNAP_PROXIMITY,
-        styles: ((_a = props.config) === null || _a === void 0 ? void 0 : _a.theme) && themes_1.default[props.config.theme]
-            ? themes_1.default[props.config.theme]
-            : themes_1.default[themes_1.IThemes.DEFAULT],
-    }, props.config);
-    var roomBuilderRef = (0, react_1.useRef)(new RoomBuilderState_1.default(__assign(__assign({}, props), { config: preppedConfig })));
-    var drawRoom = function () { return roomBuilderRef.current.drawRoom(canvasRef.current); };
-    (0, react_1.useEffect)(function () {
-        var _a;
-        if (!selectedWallAsset &&
-            (attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.WALL]]))
-            setSelectedWallAsset(((_a = attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.WALL]]) === null || _a === void 0 ? void 0 : _a.values[0].assetId) || null);
-        var attributesDelinked = JSON.parse(JSON.stringify(attributesState));
-        roomBuilderRef.current.setAttributesToState(attributesDelinked);
-        drawRoom();
-    }, [attributesState]);
-    (0, react_1.useEffect)(function () {
-        if (canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current) {
-            canvasRef.current.addEventListener('mousedown', handleDrawWallStart);
-            canvasRef.current.addEventListener('mousemove', handleDrawWallMouseMove);
-            document.addEventListener('mouseup', handleDrawWallFinish);
-            canvasRef.current.addEventListener('mousemove', handleSelectModeHover);
-            canvasRef.current.addEventListener('mousedown', handleSelectElement);
-            canvasRef.current.addEventListener('mousemove', handleMoveSelectedElement);
-            document.addEventListener('mouseup', handleSetSelectedElement);
-        }
-        return function () {
-            if (canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current) {
-                canvasRef.current.removeEventListener('mousedown', handleDrawWallStart);
-                canvasRef.current.removeEventListener('mousemove', handleDrawWallMouseMove);
-                document.removeEventListener('mouseup', handleDrawWallFinish);
-                canvasRef.current.removeEventListener('mousemove', handleSelectModeHover);
-                canvasRef.current.removeEventListener('mousedown', handleSelectElement);
-                canvasRef.current.removeEventListener('mousemove', handleMoveSelectedElement);
-                document.removeEventListener('mouseup', handleSetSelectedElement);
-            }
-        };
-    });
-    (0, react_1.useEffect)(function () {
-        roomBuilderRef.current.showDimensions = showDimensions;
-        roomBuilderRef.current.angleSnappingEnabled = angleSnappingEnabled;
-        roomBuilderRef.current.selectedElement = selectedElement
-            ? {
-                type: selectedElement.path[0],
-                index: selectedElement.path[1],
-            }
-            : null;
-        drawRoom();
-    }, [selectedElement, showDimensions, angleSnappingEnabled]);
-    var handleSelectModeHover = function (e) {
-        if (!canvasRef.current)
-            return;
-        if (modeValue !== types_1.IModes.SELECT)
-            return;
-        if (roomBuilderRef.current.activeElement !== null)
-            return;
-        var cursorPoint = [e.offsetX, e.offsetY];
-        roomBuilderRef.current.highlightElementIfInProximity(canvasRef.current, cursorPoint);
-    };
-    var handleSelectElement = function (e) {
-        if (!canvasRef.current)
-            return;
-        if (modeValue !== types_1.IModes.SELECT)
-            return;
-        var cursorPoint = [e.offsetX, e.offsetY];
-        roomBuilderRef.current.selectElementIfInProximity(canvasRef.current, cursorPoint);
-        var element = roomBuilderRef.current.getClickedElement(cursorPoint);
-        if (!element) {
-            if (selectedElement !== null)
-                setSelectedElement(null);
-            return;
-        }
-        if (roomBuilderRef.current.activeElement ||
-            (selectedElement &&
-                JSON.stringify(element.path) !== JSON.stringify(selectedElement.path)))
-            setSelectedElement(null);
-        selectElementPending.current = element;
-    };
-    var handleMoveSelectedElement = function (e) {
-        if (modeValue !== types_1.IModes.SELECT)
-            return;
-        if (!canvasRef.current)
-            return;
-        var point = [e.offsetX, e.offsetY];
-        roomBuilderRef.current.moveActiveElement(canvasRef.current, point);
-        selectElementPending.current = null;
-    };
-    var handleSetSelectedElement = function (e) {
-        var _a;
-        if (modeValue !== types_1.IModes.SELECT)
-            return;
-        if (!canvasRef.current)
-            return;
-        if (!((_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
-            roomBuilderRef.current.cancelMoveActiveElement(canvasRef.current);
-            return;
-        }
-        roomBuilderRef.current.finishMoveActiveElement(canvasRef.current);
-        if (selectElementPending.current) {
-            setSelectedElement(selectElementPending.current);
-            selectElementPending.current = null;
-        }
-    };
-    var handleDrawWallStart = function (e) {
-        if (modeValue !== types_1.IModes.DRAW)
-            return;
-        var cursorPoint = [e.offsetX, e.offsetY];
-        roomBuilderRef.current.startDrawNewWall(cursorPoint);
-    };
-    var handleDrawWallMouseMove = function (e) {
-        if (modeValue !== types_1.IModes.DRAW)
-            return;
-        if (!canvasRef.current)
-            return;
-        var cursorPoint = [e.offsetX, e.offsetY];
-        roomBuilderRef.current.drawNewWall(canvasRef.current, cursorPoint);
-    };
-    var handleDrawWallFinish = function (e) {
-        var _a;
-        if (modeValue !== types_1.IModes.DRAW)
-            return;
-        if (!canvasRef.current)
-            return;
-        if (!selectedWallAsset)
-            return;
-        if (!((_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
-            roomBuilderRef.current.cancelDrawNewWall(canvasRef.current);
-            return;
-        }
-        roomBuilderRef.current.finishDrawNewWall(canvasRef.current, selectedWallAsset);
-    };
-    var prepFeatureAttributeForOutput = function (type, attribute) {
-        if (!attribute)
-            return undefined;
-        var values = attribute.values.map(function (val) { return (__assign(__assign({}, val), { add: function (addToWallIndex, offset) {
-                return roomBuilderRef.current.addFeature(type, {
-                    assetId: val.assetId,
-                    length: constants_1.FEATURE_LENGTH,
-                    offset: offset,
-                }, addToWallIndex);
-            } })); });
-        var value = attribute.value.map(function (val, i) { return (__assign(__assign({}, val), { delete: function () { return roomBuilderRef.current.deleteFeature(type, i); } })); });
-        return __assign(__assign({}, attribute), { values: values, value: value });
-    };
-    var prepWallAttributeForOutput = function (attribute) {
-        if (!attribute)
-            return undefined;
-        var values = attribute.values.map(function (val) { return (__assign(__assign({}, val), { selected: val.assetId === selectedWallAsset, selectToDraw: function () {
-                setMode(types_1.IModes.DRAW);
-                setSelectedWallAsset(val.assetId);
-            } })); });
-        var value = attribute.value.map(function (val, i) { return (__assign(__assign({}, val), { delete: function () { var _a; return (_a = roomBuilderRef.current) === null || _a === void 0 ? void 0 : _a.deleteWall(i); } })); });
-        return __assign(__assign({}, attribute), { values: values, value: value });
-    };
-    var getElementFromAttributeName = function (attributeName) {
-        var elementAttr = Object.entries(props.attributes).find(function (_a) {
-            var _ = _a[0], attrName = _a[1];
-            return attrName === attributeName;
-        });
-        if (!elementAttr)
-            return;
-        return elementAttr[0];
-    };
-    var handleSetMode = function (mode) {
-        if (mode === modeValue)
-            return;
-        drawRoom();
-        setMode(mode);
-        setSelectedElement(null);
-    };
-    var handleReset = function () {
-        var _a;
-        (_a = roomBuilderRef.current) === null || _a === void 0 ? void 0 : _a.deleteAll();
-        setSelectedElement(null);
-    };
-    var handleDeleteElement = function (type, index) {
-        var _a;
-        var elementType = type;
-        if (Object.values(props.attributes).includes(type)) {
-            var updatedType = getElementFromAttributeName(type);
-            if (!updatedType)
-                return;
-            elementType = updatedType;
-        }
-        (_a = roomBuilderRef.current) === null || _a === void 0 ? void 0 : _a.deleteElement(elementType, index);
-        setSelectedElement(null);
-    };
-    var handleToggleDimensions = function (val) {
-        if (val === undefined)
-            setShowDimensions(!showDimensions);
-        else
-            setShowDimensions(val);
-        setSelectedElement(null);
-    };
-    var handleToggleAngleSnapping = function (val) {
-        if (val === undefined)
-            setAngleSnappingEnabled(!angleSnappingEnabled);
-        else
-            setAngleSnappingEnabled(val);
-        setSelectedElement(null);
-    };
-    return {
-        canvasRef: canvasRef,
-        selectedElement: selectedElement === null
-            ? selectedElement
-            : __assign(__assign({}, selectedElement), { path: [
-                    props.attributes[selectedElement.path[0]],
-                    selectedElement.path[1],
-                ] }),
-        mode: {
-            value: modeValue,
-            options: [types_1.IModes.DRAW, types_1.IModes.SELECT].map(function (el) { return ({
-                value: el,
-                label: el,
-                selected: modeValue === el,
-                handleSelect: function () { return handleSetMode(el); },
-            }); }),
-            handleChange: handleSetMode,
-        },
-        dimensions: {
-            enabled: showDimensions,
-            handleToggle: handleToggleDimensions,
-        },
-        angleSnapping: {
-            enabled: angleSnappingEnabled,
-            handleToggle: handleToggleAngleSnapping,
-        },
-        reset: handleReset,
-        deleteElement: handleDeleteElement,
-        walls: prepWallAttributeForOutput(attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.WALL]]),
-        windows: props.attributes[types_1.IElements.WINDOW]
-            ? prepFeatureAttributeForOutput(types_1.IElements.WINDOW, attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.WINDOW]])
-            : undefined,
-        doors: props.attributes[types_1.IElements.DOOR]
-            ? prepFeatureAttributeForOutput(types_1.IElements.DOOR, attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.DOOR]])
-            : undefined,
-        openings: props.attributes[types_1.IElements.OPENING]
-            ? prepFeatureAttributeForOutput(types_1.IElements.OPENING, attributesState === null || attributesState === void 0 ? void 0 : attributesState[props.attributes[types_1.IElements.OPENING]])
-            : undefined,
-    };
-};
-useRoomBuilder.themes = themes_1.IThemes;
-useRoomBuilder.units = types_1.IUnits;
-useRoomBuilder.modes = types_1.IModes;
-exports.default = useRoomBuilder;