@threekit-tools/treble 0.0.90-next-06 → 0.0.90-next-08

package/dist/hooks/useSpaces/SpacesState.d.ts

@@ -1,4 +1,4 @@
-import { IWalls, IVerticesState, ICoordinate2D, IFeature, IFeatures, ICoordinatesLine, ISpacesStateProps, IElementAddress, IFeatureName, IVertex, IFeaturesHydrated, IElementUi, IElementName, IActiveElement, IEnclosedSpace } from './types';
+import { IWalls, IVerticesState, ICoordinate2D, IFeature, IFeatures, ICoordinatesLine, ISpacesStateProps, IElementAddress, IFeatureName, IVertex, IFeaturesHydrated, IElementUi, IElementName, IActiveElement, IUnits, IEnclosedSpace, IFeatureDoor, IWallsValidationConfig } from './types';
 import type { IHydratedAttribute } from '../../types';
 export declare class SpacesState {
     private _config;
@@ -15,6 +15,8 @@ export declare class SpacesState {
     private _zoomLimits;
     private _translate;
     private _translateLimits;
+    private _unit;
+    private _validationConfig;
     private _state;
     constructor(config: ISpacesStateProps);
     get walls(): IWalls;
@@ -34,7 +36,7 @@ export declare class SpacesState {
     get verticesList(): Array<IVertex>;
     get verticesListToDraw(): Array<IVertex>;
     get features(): IFeatures;
-    get featuresToDraw(): Record<string, IFeature[]>;
+    get featuresToDraw(): Record<string, IFeature[] | IFeatureDoor[]>;
     set features(features: IFeatures);
     get getHydratedFeatures(): undefined | IFeaturesHydrated;
     get featureCount(): number;
@@ -55,11 +57,15 @@ export declare class SpacesState {
     get zoomMin(): number;
     get zoomMax(): number;
     setZoom(delta: number): number | undefined;
+    get unit(): IUnits;
+    setUnit(unit: IUnits): IUnits;
     get translate(): ICoordinate2D;
     get translateMin(): ICoordinate2D;
     get translateMax(): ICoordinate2D;
     set translate(position: ICoordinate2D);
     get isDrawWallActive(): boolean;
+    get validationConfig(): IWallsValidationConfig;
+    set validationConfig(config: IWallsValidationConfig);
     transformLengthFromCanvas(length: number): number;
     transformLengthToCanvas(length: number): number;
     transformPointToCanvas(point: ICoordinate2D): ICoordinate2D;
@@ -73,7 +79,8 @@ export declare class SpacesState {
     private getWallConnectionCount;
     private getWallConnectionsHydrated;
     private getWallDimensions;
-    private getWallDetailedDimensions;
+    private getWallDimensionsByIndex;
+    private getWallDetailedDimensionsByIndex;
     private getAllWallDimensionsToDraw;
     private shiftAllFeaturesOnWall;
     private addFeatureToWall;

package/dist/hooks/useSpaces/SpacesState.js

@@ -97,7 +97,7 @@ var SpacesState = (function () {
                 validators_1.areWallsIntersecting,
                 validators_1.areWallsOrphaningFeatures,
                 validators_1.areWallsDuplicated,
-            ], validationData);
+            ], validationData, _this.validationConfig);
             var errorType = ((_b = _this._errorElement) === null || _b === void 0 ? void 0 : _b[0].type) || null;
             switch (errorType) {
                 case types_1.IErrorTypes.HARD:
@@ -150,7 +150,7 @@ var SpacesState = (function () {
                 wall: wall,
                 features: _this.features,
                 updatedFeature: featureUpdatesToValidate,
-            });
+            }, _this.validationConfig);
             var errorType = ((_b = _this._errorElement) === null || _b === void 0 ? void 0 : _b[0].type) || null;
             switch (errorType) {
                 case types_1.IErrorTypes.HARD:
@@ -365,10 +365,10 @@ var SpacesState = (function () {
             return loops.reduce(function (output, loop) {
                 var screenSpaceArea = Math.round((0, geometry_1.getPolygonArea)(loop));
                 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 convertedArea = (0, dataHandlers_1.convertAreaUnit)(area, types_1.IUnits.METER, _this.unit);
                 var enclosedSpace = {
                     loop: loop.map(function (point) { return _this.transformPointToCanvas(point); }),
-                    area: (0, dataHandlers_1.prepAreaForUser)(convertedArea, _this._config.config.unit),
+                    area: (0, dataHandlers_1.prepAreaForUser)(convertedArea, _this.unit),
                     center: loop.reduce(function (centerPoint, point) {
                         centerPoint[0] += point[0] / loop.length;
                         centerPoint[1] += point[1] / loop.length;
@@ -447,6 +447,17 @@ var SpacesState = (function () {
         this._zoom = preppedZoom;
         return this.zoom;
     };
+    Object.defineProperty(SpacesState.prototype, "unit", {
+        get: function () {
+            return this._unit;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    SpacesState.prototype.setUnit = function (unit) {
+        this._unit = unit;
+        return this._unit;
+    };
     Object.defineProperty(SpacesState.prototype, "translate", {
         get: function () {
             return this._translate;
@@ -486,6 +497,16 @@ var SpacesState = (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(SpacesState.prototype, "validationConfig", {
+        get: function () {
+            return this._validationConfig;
+        },
+        set: function (config) {
+            this._validationConfig = config;
+        },
+        enumerable: false,
+        configurable: true
+    });
     SpacesState.prototype.transformLengthFromCanvas = function (length) {
         return length / this.zoomFactor;
     };
@@ -561,19 +582,22 @@ var SpacesState = (function () {
             return output;
         }, []);
     };
-    SpacesState.prototype.getWallDimensions = function (index) {
-        var _a;
-        var line = (_a = this.getWall(index)) === null || _a === void 0 ? void 0 : _a.line;
-        if (!line)
-            return undefined;
+    SpacesState.prototype.getWallDimensions = function (line) {
         var lineLength = (0, geometry_1.getLengthOfLineSegment)(line) * this._config.config.scale;
-        var convertedVal = (0, dataHandlers_1.convertLengthUnit)(lineLength, types_1.IUnits.METER, this._config.config.unit);
+        var convertedVal = (0, dataHandlers_1.convertLengthUnit)(lineLength, types_1.IUnits.METER, this.unit);
         return {
             line: line,
-            label: (0, dataHandlers_1.prepLengthForUser)(convertedVal, this._config.config.unit),
+            label: (0, dataHandlers_1.prepLengthForUser)(convertedVal, this.unit),
         };
     };
-    SpacesState.prototype.getWallDetailedDimensions = function (index) {
+    SpacesState.prototype.getWallDimensionsByIndex = function (index) {
+        var _a;
+        var line = (_a = this.getWall(index)) === null || _a === void 0 ? void 0 : _a.line;
+        if (!line)
+            return undefined;
+        return this.getWallDimensions(line);
+    };
+    SpacesState.prototype.getWallDetailedDimensionsByIndex = function (index) {
         var _this = this;
         var _a;
         var line = (_a = this.getWall(index)) === null || _a === void 0 ? void 0 : _a.line;
@@ -587,7 +611,7 @@ var SpacesState = (function () {
             var offset = _a.offset, length = _a.length;
             var featureLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(line, offset, length);
             var featureLength = (0, geometry_1.getLengthOfLineSegment)(featureLine);
-            var unit = constants_1.UNIT_LABELS[_this._config.config.unit];
+            var unit = constants_1.UNIT_LABELS[_this.unit];
             var scale = _this._config.config.scale;
             if (!i) {
                 var startLine = [line[0], featureLine[0]];
@@ -630,8 +654,8 @@ var SpacesState = (function () {
         var indexes = new Set([detailedWallsIndexes].flat());
         var dimensionsList = this.walls.reduce(function (output, _, i) {
             var dimensions = indexes.has(i)
-                ? _this.getWallDetailedDimensions(i)
-                : _this.getWallDimensions(i);
+                ? _this.getWallDetailedDimensionsByIndex(i)
+                : _this.getWallDimensionsByIndex(i);
             if (!dimensions)
                 return output;
             if (Array.isArray(dimensions))
@@ -750,20 +774,21 @@ var SpacesState = (function () {
     SpacesState.prototype.getFirstVacantLocation = function (length) {
         var _a;
         var walls = this.walls;
+        var padding = this.validationConfig.padding;
         var offset = undefined;
         for (var i = 0; i < walls.length; i++) {
             var wallLength = (0, geometry_1.getLengthOfLineSegment)(walls[i].line);
             var features = (_a = this.getWallConnectionsHydrated(i)) === null || _a === void 0 ? void 0 : _a.sort(function (a, b) { return a.offset - b.offset; });
             if (!(features === null || features === void 0 ? void 0 : features.length)) {
-                if (length < wallLength - 2 * constants_1.WALL_PADDING_FOR_FEATURE)
-                    offset = (wallLength - 2 * constants_1.WALL_PADDING_FOR_FEATURE) / 2 - length / 2;
+                if (length < wallLength - 2 * padding)
+                    offset = (wallLength - 2 * padding) / 2 - length / 2;
             }
             else {
                 for (var j = 0; j < features.length && offset === undefined; j++) {
                     var _b = features[j], currentOffset = _b.offset, currentLength = _b.length;
                     if (!j) {
-                        if (constants_1.WALL_PADDING_FOR_FEATURE + length < currentOffset) {
-                            var slotStart = constants_1.WALL_PADDING_FOR_FEATURE;
+                        if (padding + length < currentOffset) {
+                            var slotStart = padding;
                             var slotEnd = currentOffset;
                             offset = slotStart + (slotEnd - slotStart) / 2 - length / 2;
                             continue;
@@ -780,11 +805,9 @@ var SpacesState = (function () {
                     }
                     if (j === features.length - 1) {
                         if (length <
-                            wallLength -
-                                constants_1.WALL_PADDING_FOR_FEATURE -
-                                (currentOffset + currentLength)) {
+                            wallLength - padding - (currentOffset + currentLength)) {
                             var slotStart = currentOffset + currentLength;
-                            var slotEnd = wallLength - constants_1.WALL_PADDING_FOR_FEATURE;
+                            var slotEnd = wallLength - padding;
                             offset = slotStart + (slotEnd - slotStart) / 2 - length / 2;
                         }
                     }
@@ -903,15 +926,18 @@ var SpacesState = (function () {
         if (index === undefined || offset === undefined)
             return;
         var newFeature = __assign(__assign({}, feature), { offset: offset, height: feature.height || 0, altitude: feature.altitude || 0, connectedTo: [types_2.IElements.WALL, index], restConfiguration: '{}' });
+        if (type === types_2.IElements.DOOR) {
+            newFeature.orientation = 'left';
+            newFeature.openingDirection = 'inside';
+        }
         var newFeatureIndex;
-        if ((_a = this._state[types_2.IElements.FEATURE][type]) === null || _a === void 0 ? void 0 : _a.length) {
+        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;
-            this._state[types_2.IElements.FEATURE][type].push(newFeature);
-        }
         else {
-            this._state[types_2.IElements.FEATURE][type] = [newFeature];
+            this._state[types_2.IElements.FEATURE][type] = [];
             newFeatureIndex = 0;
         }
+        this._state[types_2.IElements.FEATURE][type].push(newFeature);
         this.addFeatureToWall(index, [type, newFeatureIndex]);
         this.pushStateToConfigurator();
     };
@@ -1162,6 +1188,7 @@ var SpacesState = (function () {
             return;
         this._attributesState = attributes;
         var data = (0, dataHandlers_1.prepAttributesIncoming)(attributes, this._config);
+        this.validationConfig = data.validationConfig;
         this.walls = data[types_2.IElements.WALL];
         this.vertices = data[types_2.IElements.VERTEX];
         this.features = data[types_2.IElements.FEATURE];
@@ -1235,7 +1262,7 @@ var SpacesState = (function () {
             validators_1.isWallTooShort,
             validators_1.isWallOverlappingExisitingWalls,
             validators_1.isWallIntersectingFeature,
-        ], validationData);
+        ], validationData, this.validationConfig);
         var errorType = ((_d = this._errorElement) === null || _d === void 0 ? void 0 : _d[0].type) || null;
         switch (errorType) {
             case types_1.IErrorTypes.HARD:
@@ -1421,7 +1448,16 @@ var SpacesState = (function () {
             ? this.getAllWallDimensionsToDraw(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);
+            var newWallLine = [
+                this._newWall.start,
+                this._newWall.end,
+            ];
+            (0, draw_1.drawNewWall)(canvas, this.transformLineToCanvas(newWallLine), this._config.config.styles, this._errorElement ? types_1.IElementStyleModes.ERROR : undefined);
+            if (this._showDimensions) {
+                var preppedNewWallLine = this.transformLineToCanvas(newWallLine);
+                var newWallDimensions = this.getWallDimensions(preppedNewWallLine);
+                (0, draw_1.drawDimensions)(canvas, [newWallDimensions], this._config.config);
+            }
         }
     };
     return SpacesState;

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

@@ -1,4 +1,16 @@
-import { ICoordinate2D, ISpacesAttributes } from './types';
+import { ICoordinate2D, ISpacesAttributes, IWallsValidationConfig } from './types';
+export declare enum WallMetadata {
+    MIN_LENGTH = "_tkSpace_minLength",
+    PADDING = "_tkSpace_padding"
+}
+export declare enum DoorOrientations {
+    LEFT = "Left",
+    RIGHT = "Right"
+}
+export declare enum DoorOpeningDirections {
+    INSIDE = "inside",
+    OUTSIDE = "outside"
+}
 export declare const attributeNameDefaults: ISpacesAttributes;
 export declare const SCALE = 0.02;
 export declare const SNAP_PROXIMITY = 16;
@@ -9,8 +21,6 @@ export declare const ZOOM_SENSITIVITY = 0.8;
 export declare const TRANSLATE_MAX: ICoordinate2D;
 export declare const TRANSLATE_MIN: ICoordinate2D;
 export declare const TRANSLATE_DEFAULT: ICoordinate2D;
-export declare const MIN_WALL_LENGTH = 50;
-export declare const WALL_PADDING_FOR_FEATURE = 20;
 export declare const UNIT_LABELS: {
     feet: string;
     meter: string;
@@ -28,6 +38,7 @@ export declare const FEATURE_LABELS: {
     doors: string;
     openings: string;
 };
+export declare const VALIDATION_CONFIG_DEFAULT: IWallsValidationConfig;
 export declare const FEATURE_LENGTH = 120;
 export declare const UI_ANCHOR_DISTANCE = -60;
 export declare const WALL_SNAP_DISTANCE = 12;

package/dist/hooks/useSpaces/constants.js

@@ -1,7 +1,7 @@
 "use strict";
 var _a, _b, _c, _d;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WALL_SNAP_DISTANCE = exports.UI_ANCHOR_DISTANCE = exports.FEATURE_LENGTH = exports.FEATURE_LABELS = exports.UNIT_FACTORS = exports.UNIT_LABELS = exports.WALL_PADDING_FOR_FEATURE = exports.MIN_WALL_LENGTH = exports.TRANSLATE_DEFAULT = exports.TRANSLATE_MIN = exports.TRANSLATE_MAX = exports.ZOOM_SENSITIVITY = exports.ZOOM_DEFAULT = exports.ZOOM_MIN = exports.ZOOM_MAX = exports.SNAP_PROXIMITY = exports.SCALE = exports.attributeNameDefaults = void 0;
+exports.WALL_SNAP_DISTANCE = exports.UI_ANCHOR_DISTANCE = exports.FEATURE_LENGTH = exports.VALIDATION_CONFIG_DEFAULT = exports.FEATURE_LABELS = exports.UNIT_FACTORS = exports.UNIT_LABELS = exports.TRANSLATE_DEFAULT = exports.TRANSLATE_MIN = exports.TRANSLATE_MAX = exports.ZOOM_SENSITIVITY = exports.ZOOM_DEFAULT = exports.ZOOM_MIN = exports.ZOOM_MAX = exports.SNAP_PROXIMITY = exports.SCALE = exports.attributeNameDefaults = exports.DoorOpeningDirections = exports.DoorOrientations = exports.WallMetadata = void 0;
 var types_1 = require("./types");
 var SpacesAttributes;
 (function (SpacesAttributes) {
@@ -22,24 +22,44 @@ var WallAttributes;
     WallAttributes["WALL_HEIGHT"] = "_tkSpace_wallHeight";
     WallAttributes["WALL_THICKNESS"] = "_tkSpace_wallThickness";
 })(WallAttributes || (WallAttributes = {}));
-var FeatureAttribute;
-(function (FeatureAttribute) {
-    FeatureAttribute["POSITION_X"] = "_tkSpace_offsetX";
-    FeatureAttribute["POSITION_Y"] = "_tkSpace_offsetY";
-    FeatureAttribute["CONNECTED_TO"] = "_tkSpace_connectedTo";
-    FeatureAttribute["FEATURE_HEIGHT"] = "_tkSpace_featureHeight";
-    FeatureAttribute["FEATURE_LENGTH"] = "_tkSpace_featureWidth";
-})(FeatureAttribute || (FeatureAttribute = {}));
+var WallMetadata;
+(function (WallMetadata) {
+    WallMetadata["MIN_LENGTH"] = "_tkSpace_minLength";
+    WallMetadata["PADDING"] = "_tkSpace_padding";
+})(WallMetadata = exports.WallMetadata || (exports.WallMetadata = {}));
+var FeatureAttributes;
+(function (FeatureAttributes) {
+    FeatureAttributes["POSITION_X"] = "_tkSpace_offsetX";
+    FeatureAttributes["POSITION_Y"] = "_tkSpace_offsetY";
+    FeatureAttributes["CONNECTED_TO"] = "_tkSpace_connectedTo";
+    FeatureAttributes["FEATURE_HEIGHT"] = "_tkSpace_featureHeight";
+    FeatureAttributes["FEATURE_LENGTH"] = "_tkSpace_featureWidth";
+})(FeatureAttributes || (FeatureAttributes = {}));
+var DoorAttributes;
+(function (DoorAttributes) {
+    DoorAttributes["ORIENTATION"] = "_tkSpace_doorOrientation";
+    DoorAttributes["OPENING_DIRECTION"] = "_tkSpace_doorOpeningDirection";
+})(DoorAttributes || (DoorAttributes = {}));
+var DoorOrientations;
+(function (DoorOrientations) {
+    DoorOrientations["LEFT"] = "Left";
+    DoorOrientations["RIGHT"] = "Right";
+})(DoorOrientations = exports.DoorOrientations || (exports.DoorOrientations = {}));
+var DoorOpeningDirections;
+(function (DoorOpeningDirections) {
+    DoorOpeningDirections["INSIDE"] = "inside";
+    DoorOpeningDirections["OUTSIDE"] = "outside";
+})(DoorOpeningDirections = exports.DoorOpeningDirections || (exports.DoorOpeningDirections = {}));
 exports.attributeNameDefaults = (_a = {},
     _a[types_1.IElements.WALL] = SpacesAttributes.WALLS,
     _a[types_1.IElements.WINDOW] = SpacesAttributes.WINDOWS,
     _a[types_1.IElements.OPENING] = SpacesAttributes.OPENINGS,
     _a[types_1.IElements.DOOR] = SpacesAttributes.DOORS,
-    _a.featurePositionX = FeatureAttribute.POSITION_X,
-    _a.featurePositionY = FeatureAttribute.POSITION_Y,
-    _a.featureConnectedTo = FeatureAttribute.CONNECTED_TO,
-    _a.featureHeight = FeatureAttribute.FEATURE_HEIGHT,
-    _a.featureLength = FeatureAttribute.FEATURE_LENGTH,
+    _a.featurePositionX = FeatureAttributes.POSITION_X,
+    _a.featurePositionY = FeatureAttributes.POSITION_Y,
+    _a.featureConnectedTo = FeatureAttributes.CONNECTED_TO,
+    _a.featureHeight = FeatureAttributes.FEATURE_HEIGHT,
+    _a.featureLength = FeatureAttributes.FEATURE_LENGTH,
     _a.wallStartX = WallAttributes.START_X,
     _a.wallStartY = WallAttributes.START_Y,
     _a.wallStartZ = WallAttributes.START_Z,
@@ -47,6 +67,8 @@ exports.attributeNameDefaults = (_a = {},
     _a.wallEndY = WallAttributes.END_Y,
     _a.wallEndZ = WallAttributes.END_Z,
     _a.wallConnections = WallAttributes.CONNECTIONS,
+    _a.doorOrientation = DoorAttributes.ORIENTATION,
+    _a.doorOpeningDirection = DoorAttributes.OPENING_DIRECTION,
     _a);
 exports.SCALE = 0.02;
 exports.SNAP_PROXIMITY = 16;
@@ -57,8 +79,6 @@ exports.ZOOM_SENSITIVITY = 0.8;
 exports.TRANSLATE_MAX = [-400, -400];
 exports.TRANSLATE_MIN = [400, 400];
 exports.TRANSLATE_DEFAULT = [-200, -200];
-exports.MIN_WALL_LENGTH = 50;
-exports.WALL_PADDING_FOR_FEATURE = 20;
 exports.UNIT_LABELS = (_b = {},
     _b[types_1.IUnits.FEET] = 'ft',
     _b[types_1.IUnits.METER] = 'm',
@@ -76,6 +96,10 @@ exports.FEATURE_LABELS = (_d = {},
     _d[types_1.IElements.DOOR] = 'Door',
     _d[types_1.IElements.OPENING] = 'Opening',
     _d);
+exports.VALIDATION_CONFIG_DEFAULT = {
+    padding: 20,
+    minLength: 50,
+};
 exports.FEATURE_LENGTH = 120;
 exports.UI_ANCHOR_DISTANCE = -60;
 exports.WALL_SNAP_DISTANCE = 12;

package/dist/hooks/useSpaces/dataHandlers.d.ts

@@ -1,7 +1,8 @@
-import type { IWalls, ISpacesStateProps, IVerticesState, IFeatures } from './types';
+import type { IWalls, ISpacesStateProps, IVerticesState, IFeatures, IWallsValidationConfig } from './types';
 import { IUnits } from './types';
 import type { IConfiguration, IHydratedAttribute } from '../../types';
 export declare function prepAttributesIncoming(attributes: Record<string, IHydratedAttribute>, config: ISpacesStateProps): {
+    validationConfig: IWallsValidationConfig;
     features: {};
     walls: IWalls;
     vertex: IVerticesState;

package/dist/hooks/useSpaces/dataHandlers.js

@@ -69,50 +69,67 @@ function prepWallsAndVerticesIncoming(wallsAttribute, config) {
     });
     return _a = {}, _a[types_1.IElements.WALL] = walls, _a[types_1.IElements.VERTEX] = vertices, _a;
 }
-function prepFeatureIncoming(walls, featureAttribute, config) {
+function getWallsVaidationConfig(wallsAttribute, config) {
+    var _a, _b;
+    var metadata = (wallsAttribute === null || wallsAttribute === void 0 ? void 0 : wallsAttribute.values[0].metadata) || {};
+    var validation = {
+        minLength: ((_a = metadata[constants_1.WallMetadata.MIN_LENGTH]) !== null && _a !== void 0 ? _a : constants_1.VALIDATION_CONFIG_DEFAULT.minLength) / config.config.scale,
+        padding: ((_b = metadata[constants_1.WallMetadata.PADDING]) !== null && _b !== void 0 ? _b : constants_1.VALIDATION_CONFIG_DEFAULT.padding) / config.config.scale,
+    };
+    return validation;
+}
+function prepFeatureIncoming(type, walls, featureAttribute, config) {
     var _a;
     var attributeName = config.attributes;
     var feature = [];
     (_a = featureAttribute === null || featureAttribute === void 0 ? void 0 : featureAttribute.value) === null || _a === void 0 ? void 0 : _a.forEach(function (_a) {
         var assetId = _a.assetId, configuration = _a.configuration;
         var offset = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featurePositionX]) / config.config.scale;
-        var length = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featureLength]) / config.config.scale ||
-            constants_1.FEATURE_LENGTH;
+        var length = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featureLength]) / config.config.scale;
         var height = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featureHeight]) / config.config.scale;
         var altitude = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featurePositionY]) / config.config.scale;
         var connectedTo = (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.featureConnectedTo]) || '';
         var wallIndex = prepConnectionIncoming(connectedTo)[1];
         var featureLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(walls[wallIndex].line, offset, length);
-        var path = (0, geometry_1.addThicknessToLine)(featureLine, config.config.styles.feature.thickness);
-        feature.push({
+        var element = {
             assetId: assetId,
             offset: offset,
             length: length,
             height: height,
             altitude: altitude,
-            path: path,
             connectedTo: [types_1.IElements.WALL, wallIndex],
+            path: (0, geometry_1.addThicknessToLine)(featureLine, config.config.styles.feature.thickness),
             restConfiguration: JSON.stringify(filterRestConfiguration(configuration, config.attributes)),
-        });
+        };
+        if (type === types_1.IElements.DOOR) {
+            element.orientation =
+                (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.doorOrientation]) || constants_1.DoorOrientations.LEFT;
+            element.openingDirection =
+                (configuration === null || configuration === void 0 ? void 0 : configuration[attributeName.doorOpeningDirection]) ||
+                    constants_1.DoorOpeningDirections.INSIDE;
+        }
+        feature.push(element);
     });
     return feature;
 }
 function prepAttributesIncoming(attributes, config) {
     var _a;
-    var wallsAndVertices = prepWallsAndVerticesIncoming(attributes[config.attributes[types_1.IElements.WALL]], config);
+    var wallsAttribute = attributes[config.attributes[types_1.IElements.WALL]];
+    var wallsAndVertices = prepWallsAndVerticesIncoming(wallsAttribute, config);
+    var wallsValidation = getWallsVaidationConfig(wallsAttribute, config);
     var featuresList = [
         types_1.IElements.WINDOW,
         types_1.IElements.DOOR,
         types_1.IElements.OPENING,
     ];
     var featuresData = featuresList.reduce(function (output, type) {
-        output[type] = prepFeatureIncoming(wallsAndVertices[types_1.IElements.WALL], attributes[config.attributes[type]], config);
+        output[type] = prepFeatureIncoming(type, wallsAndVertices[types_1.IElements.WALL], attributes[config.attributes[type]], config);
         return output;
     }, {});
-    return __assign(__assign({}, wallsAndVertices), (_a = {}, _a[types_1.IElements.FEATURE] = featuresData, _a));
+    return __assign(__assign({}, wallsAndVertices), (_a = { validationConfig: wallsValidation }, _a[types_1.IElements.FEATURE] = featuresData, _a));
 }
 exports.prepAttributesIncoming = prepAttributesIncoming;
-function prepFeaturesOutgoing(features, config) {
+function prepFeaturesOutgoing(type, features, config) {
     var attributeName = config.attributes;
     return features.map(function (feature) {
         var _a, _b;
@@ -136,6 +153,10 @@ function prepFeaturesOutgoing(features, config) {
                 _b[key] = value ? value * config.config.scale : value,
                 _b));
         }, __assign((_b = {}, _b[attributeName.featureConnectedTo] = connectedTo, _b), JSON.parse(restConfiguration)));
+        if (type === types_1.IElements.DOOR) {
+            configuration[attributeName.doorOrientation] = feature.orientation;
+            configuration[attributeName.doorOpeningDirection] = feature.openingDirection;
+        }
         return {
             assetId: assetId,
             configuration: configuration,
@@ -180,7 +201,7 @@ function prepAttributesOutgoing(walls, features, config) {
         var attributeName = config.attributes[type];
         if (!attributeName)
             return output;
-        output[attributeName] = prepFeaturesOutgoing(features, config);
+        output[attributeName] = prepFeaturesOutgoing(type, features, config);
         return output;
     }, {});
     return __assign(__assign({}, featuresAttributes), (_a = {}, _a[config.attributes[types_1.IElements.WALL]] = wallsAttribute, _a));

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

@@ -1,4 +1,4 @@
-import { IWall, ICoordinate2D, ICoordinatesLine, IFeatures, IFeature, IElementAddress, ISpacesStyles, ISpacesConfigInternal, IStylesGrid, IStylesWall, IStylesVertex, ILineDimensions, IVertex, IElementStyleModes, IStylesFloor, IEnclosedSpace } from './types';
+import { IWall, ICoordinate2D, ICoordinatesLine, IFeatures, IFeature, IElementAddress, ISpacesStyles, ISpacesConfigInternal, IStylesGrid, IStylesWall, IStylesVertex, IStylesDimension, ILineDimensions, IVertex, IElementStyleModes, IStylesFloor, IEnclosedSpace, IFeatureDoor } from './types';
 interface IWallToDraw extends Pick<IWall, 'line' | 'path'> {
 }
 interface IWallsToDraw extends Array<IWallToDraw> {
@@ -7,6 +7,7 @@ export declare function clearCanvas(canvas: HTMLCanvasElement): void;
 export declare function drawBackground(canvas: HTMLCanvasElement, color?: string): void;
 export declare function drawGrid(canvas: HTMLCanvasElement, styles: IStylesGrid): void;
 export declare function drawFloor(canvas: HTMLCanvasElement, enclosedSpaces: Array<IEnclosedSpace>, styles: IStylesFloor): void;
+export declare function drawDimension(canvas: HTMLCanvasElement, line: ICoordinatesLine, styles: IStylesDimension, message: string): void;
 export declare function drawVertex(canvas: HTMLCanvasElement, point: ICoordinate2D, style: IStylesVertex, mode?: IElementStyleModes): void;
 export declare function drawNewWall(canvas: HTMLCanvasElement, line: ICoordinatesLine, styles: ISpacesStyles, mode?: IElementStyleModes.ERROR): void;
 export declare function drawWalls(canvas: HTMLCanvasElement, walls: IWallsToDraw, selections: {
@@ -28,7 +29,7 @@ export declare function drawWindows(canvas: HTMLCanvasElement, walls: IWallsToDr
     error: Array<number>;
     hidden: Array<number>;
 }, styles: ISpacesStyles): void;
-export declare function drawDoors(canvas: HTMLCanvasElement, walls: IWallsToDraw, doors: Array<IFeature>, selections: {
+export declare function drawDoors(canvas: HTMLCanvasElement, walls: IWallsToDraw, doors: Array<IFeatureDoor>, selections: {
     active: Array<number>;
     highlighted: Array<number>;
     error: Array<number>;

package/dist/hooks/useSpaces/draw.js

@@ -9,10 +9,11 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.drawSpaces = exports.drawElements = exports.drawOpenings = exports.drawDoors = exports.drawWindows = exports.drawDimensions = exports.drawVertices = exports.drawWalls = exports.drawNewWall = exports.drawVertex = exports.drawFloor = exports.drawGrid = exports.drawBackground = exports.clearCanvas = void 0;
+exports.drawSpaces = exports.drawElements = exports.drawOpenings = exports.drawDoors = exports.drawWindows = exports.drawDimensions = exports.drawVertices = exports.drawWalls = exports.drawNewWall = exports.drawVertex = exports.drawDimension = exports.drawFloor = exports.drawGrid = exports.drawBackground = exports.clearCanvas = void 0;
 var types_1 = require("./types");
 var types_2 = require("./types");
 var geometry_1 = require("./geometry");
+var constants_1 = require("./constants");
 var debug = false;
 function clearCanvas(canvas) {
     var ctx = canvas.getContext('2d');
@@ -161,6 +162,7 @@ function drawDimension(canvas, line, styles, message) {
     ctx.fillText(message, 0, 0);
     ctx.resetTransform();
 }
+exports.drawDimension = drawDimension;
 function drawVertex(canvas, point, style, mode) {
     var ctx = canvas.getContext('2d');
     if (!ctx)
@@ -244,17 +246,42 @@ function drawWindow(canvas, wall, offset, length, style, mode) {
     ctx.arc(windowLine[1][0], windowLine[1][1], style.thickness / 2, angle + Math.PI / 2, angle - Math.PI / 2);
     ctx.fill();
 }
-function drawDoor(canvas, wall, offset, length, style, mode) {
+function drawDoor(canvas, wall, offset, length, openingDirection, orientation, style, mode) {
     var ctx = canvas.getContext('2d');
     if (!ctx)
         return;
     var doorLine = (0, geometry_1.getLineAtOffsetOnLineSegment)(wall.line, offset, length);
     var points = (0, geometry_1.addThicknessToLine)(doorLine, style.thickness);
+    var angle = (0, geometry_1.getAngleOfLineSegment)(doorLine);
     var stroke = style.stroke, fill = style.fill, strokeWidth = style.strokeWidth;
     if (mode) {
         stroke = style[mode].stroke;
         fill = style[mode].fill;
     }
+    ctx.beginPath();
+    ctx.strokeStyle = stroke || fill;
+    ctx.lineWidth = 2;
+    if (openingDirection === constants_1.DoorOpeningDirections.INSIDE) {
+        if (orientation === constants_1.DoorOrientations.LEFT) {
+            ctx.moveTo.apply(ctx, points[0]);
+            ctx.arc.apply(ctx, __spreadArray(__spreadArray([], points[0], false), [length, angle - Math.PI / 2, angle], false));
+        }
+        else {
+            ctx.moveTo.apply(ctx, points[1]);
+            ctx.arc.apply(ctx, __spreadArray(__spreadArray([], points[1], false), [length, angle - Math.PI / 2, angle - Math.PI, true], false));
+        }
+    }
+    else {
+        if (orientation === constants_1.DoorOrientations.LEFT) {
+            ctx.moveTo.apply(ctx, points[2]);
+            ctx.arc.apply(ctx, __spreadArray(__spreadArray([], points[2], false), [length, angle + Math.PI / 2, angle + Math.PI], false));
+        }
+        else {
+            ctx.moveTo.apply(ctx, points[3]);
+            ctx.arc.apply(ctx, __spreadArray(__spreadArray([], points[3], false), [length, angle + Math.PI / 2, angle, true], false));
+        }
+    }
+    ctx.stroke();
     ctx.strokeStyle = stroke || fill;
     ctx.fillStyle = fill;
     ctx.lineWidth = strokeWidth || 1;
@@ -429,7 +456,7 @@ function drawDoors(canvas, walls, doors, selections, styles) {
             if (!(door === null || door === void 0 ? void 0 : door.connectedTo.length))
                 return;
             var wallIndex = door.connectedTo[1];
-            drawDoor(canvas, walls[wallIndex], door.offset, door.length, styles.feature, mode);
+            drawDoor(canvas, walls[wallIndex], door.offset, door.length, door.openingDirection, door.orientation, styles.feature, mode);
         });
     });
 }

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

@@ -28,6 +28,16 @@ interface IUseSpaces {
         value: number;
         handleChange: (value: number) => void;
     };
+    unit: {
+        value: IUnits;
+        options: Array<{
+            label: string;
+            value: IUnits;
+            selected: boolean;
+            handleSelect: () => void;
+        }>;
+        handleChange: (unit: IUnits) => void;
+    };
     translate: {
         handleChange: (delta: ICoordinate2D) => void;
     };

package/dist/hooks/useSpaces/index.js

@@ -48,18 +48,19 @@ var store_1 = require("../../store");
 var spaces_1 = require("../../store/spaces");
 var useThreekitInitStatus_1 = __importDefault(require("../useThreekitInitStatus"));
 var useSpaces = function (props) {
-    var _a;
+    var _a, _b, _c, _d;
     var attributesState = (0, useConfigurator_1.default)()[0];
     var hasLoaded = (0, useThreekitInitStatus_1.default)();
     var dispatch = (0, store_1.useThreekitDispatch)();
     var layouts = (0, store_1.useThreekitSelector)(spaces_1.getLayouts);
     var zoom = (0, store_1.useThreekitSelector)(spaces_1.getZoom);
+    var unit = (0, store_1.useThreekitSelector)(spaces_1.getUnit);
     var translation = (0, store_1.useThreekitSelector)(spaces_1.getTranslation);
     var modeValue = (0, store_1.useThreekitSelector)(spaces_1.getMode);
     var showDimensions = (0, store_1.useThreekitSelector)(spaces_1.getShowDimensions);
     var angleSnappingEnabled = (0, store_1.useThreekitSelector)(spaces_1.getAngleSnappingEnabled);
-    var _b = (0, react_1.useState)(null), selectedElement = _b[0], setSelectedElement = _b[1];
-    var _c = (0, react_1.useState)(null), selectedWallAsset = _c[0], setSelectedWallAsset = _c[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 translationAnchorRef = (0, react_1.useRef)(null);
@@ -74,26 +75,33 @@ var useSpaces = function (props) {
             : themes_1.default[themes_1.IThemes.DEFAULT],
     }, props.config);
     var attributeNames = Object.assign(constants_1.attributeNameDefaults, props.attributes);
-    var spacesRef = (0, react_1.useRef)(new SpacesState_1.default(__assign(__assign({}, props), { config: preppedConfig, attributes: attributeNames })));
-    var drawSpaces = function () { return spacesRef.current.drawSpaces(canvasRef.current); };
+    var spacesRef = (0, react_1.useRef)();
     (0, react_1.useEffect)(function () {
-        var _a;
+        spacesRef.current = new SpacesState_1.default(__assign(__assign({}, props), { config: preppedConfig, attributes: attributeNames }));
+    }, []);
+    (0, react_1.useEffect)(function () {
+        var _a, _b, _c;
         if (!selectedWallAsset && (attributesState === null || attributesState === void 0 ? void 0 : attributesState[attributeNames[types_1.IElements.WALL]]))
             setSelectedWallAsset(((_a = attributesState === null || attributesState === void 0 ? void 0 : attributesState[attributeNames[types_1.IElements.WALL]]) === null || _a === void 0 ? void 0 : _a.values[0].assetId) || null);
         var attributesDelinked = JSON.parse(JSON.stringify(attributesState));
-        spacesRef.current.setAttributesToState(attributesDelinked);
-        drawSpaces();
+        (_b = spacesRef.current) === null || _b === void 0 ? void 0 : _b.setAttributesToState(attributesDelinked);
+        (_c = spacesRef.current) === null || _c === void 0 ? void 0 : _c.drawSpaces(canvasRef.current);
     }, [attributesState]);
     (0, react_1.useEffect)(function () {
         var _a;
+        if (!spacesRef.current)
+            return;
         if (zoom &&
             ((_a = props.config) === null || _a === void 0 ? void 0 : _a.zoomDefault) &&
             props.config.zoomDefault >= spacesRef.current.zoomMin &&
             spacesRef.current.zoomMax >= props.config.zoomDefault)
             updateZoom(props.config.zoomDefault);
+        updateUnit(preppedConfig.unit);
     }, []);
     (0, react_1.useEffect)(function () {
         var _a, _b;
+        if (!spacesRef.current)
+            return;
         if (canvasRef === null || canvasRef === void 0 ? void 0 : canvasRef.current) {
             spacesRef.current.canvasDimensions = [
                 canvasRef.current.width,
@@ -129,6 +137,8 @@ var useSpaces = function (props) {
         };
     });
     (0, react_1.useEffect)(function () {
+        if (!spacesRef.current)
+            return;
         spacesRef.current.showDimensions = showDimensions;
         spacesRef.current.angleSnappingEnabled = angleSnappingEnabled;
         spacesRef.current.selectedElement = selectedElement
@@ -137,7 +147,7 @@ var useSpaces = function (props) {
                 index: selectedElement.path[1],
             }
             : null;
-        drawSpaces();
+        spacesRef.current.drawSpaces(canvasRef.current);
     }, [selectedElement, showDimensions, angleSnappingEnabled]);
     (0, react_1.useEffect)(function () {
         if (!hasLoaded)
@@ -152,22 +162,37 @@ var useSpaces = function (props) {
         }));
     }, [hasLoaded, JSON.stringify(props.layouts)]);
     var updateZoom = function (value) {
+        if (!spacesRef.current)
+            return;
         var newZoom = spacesRef.current.setZoom(value);
         if (!newZoom)
             return;
         dispatch((0, spaces_1.setZoom)(newZoom));
-        drawSpaces();
+        spacesRef.current.drawSpaces(canvasRef.current);
+    };
+    var updateUnit = function (unit) {
+        if (!spacesRef.current)
+            return;
+        var newUnit = spacesRef.current.setUnit(unit);
+        if (!newUnit)
+            return;
+        dispatch((0, spaces_1.setUnit)(newUnit));
+        spacesRef.current.drawSpaces(canvasRef.current);
     };
     var handleScrollToZoom = function (e) {
-        var _a;
+        var _a, _b;
         if (!canvasRef.current)
             return;
         var zoomSensitivity = ((_a = props.config) === null || _a === void 0 ? void 0 : _a.zoomSensitivity) || constants_1.ZOOM_SENSITIVITY;
+        if ((_b = props.config) === null || _b === void 0 ? void 0 : _b.reverseZoom)
+            zoomSensitivity = -1 * zoomSensitivity;
         updateZoom(e.deltaY * zoomSensitivity);
     };
     var handleSelectModeHover = function (e) {
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         if (modeValue !== types_1.IModes.SELECT)
             return;
         if (spacesRef.current.activeElement !== null)
@@ -181,16 +206,18 @@ var useSpaces = function (props) {
         var _a;
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         if (modeValue !== types_1.IModes.SELECT)
             return;
         var cursorPoint = [e.offsetX, e.offsetY];
         spacesRef.current.selectElementIfInProximity(canvasRef.current, cursorPoint);
-        if (!((_a = props.config) === null || _a === void 0 ? void 0 : _a.translateDisabled) && !spacesRef.current.activeElement)
-            translationAnchorRef.current = cursorPoint;
         var element = spacesRef.current.getClickedElement(cursorPoint);
         if (!element) {
             if (selectedElement !== null)
                 setSelectedElement(null);
+            if (!((_a = props.config) === null || _a === void 0 ? void 0 : _a.translateDisabled) && !spacesRef.current.activeElement)
+                translationAnchorRef.current = cursorPoint;
             return;
         }
         if (spacesRef.current.activeElement ||
@@ -200,6 +227,8 @@ var useSpaces = function (props) {
         selectElementPending.current = element;
     };
     var handleMoveSelectedElement = function (e) {
+        if (!spacesRef.current)
+            return;
         if (modeValue !== types_1.IModes.SELECT)
             return;
         if (!canvasRef.current)
@@ -213,6 +242,8 @@ var useSpaces = function (props) {
             return;
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         if (spacesRef.current.selectedElement || !translationAnchorRef.current)
             return;
         var delta = [
@@ -228,6 +259,8 @@ var useSpaces = function (props) {
             return;
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         if (!((_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
             spacesRef.current.cancelMoveActiveElement(canvasRef.current);
             return;
@@ -244,6 +277,8 @@ var useSpaces = function (props) {
     var handleDrawWallStart = function (e) {
         if (modeValue !== types_1.IModes.DRAW)
             return;
+        if (!spacesRef.current)
+            return;
         var cursorPoint = [e.offsetX, e.offsetY];
         spacesRef.current.startDrawNewWall(cursorPoint);
     };
@@ -252,6 +287,8 @@ var useSpaces = function (props) {
             return;
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         var cursorPoint = [e.offsetX, e.offsetY];
         if (spacesRef.current.isDrawWallActive)
             spacesRef.current.drawNewWall(canvasRef.current, cursorPoint);
@@ -262,6 +299,8 @@ var useSpaces = function (props) {
             return;
         if (!canvasRef.current)
             return;
+        if (!spacesRef.current)
+            return;
         if (!selectedWallAsset)
             return;
         if (!((_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
@@ -274,13 +313,14 @@ var useSpaces = function (props) {
         if (!attribute)
             return undefined;
         var values = attribute.values.map(function (val) { return (__assign(__assign({}, val), { add: function (addToWallIndex, offset) {
-                return spacesRef.current.addFeature(type, {
+                var _a;
+                return (_a = spacesRef.current) === null || _a === void 0 ? void 0 : _a.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 spacesRef.current.deleteFeature(type, i); } })); });
+        var value = attribute.value.map(function (val, i) { return (__assign(__assign({}, val), { delete: function () { var _a; return (_a = spacesRef.current) === null || _a === void 0 ? void 0 : _a.deleteFeature(type, i); } })); });
         return __assign(__assign({}, attribute), { values: values, value: value });
     };
     var prepWallAttributeForOutput = function (attribute) {
@@ -305,7 +345,9 @@ var useSpaces = function (props) {
     var handleSetMode = function (mode) {
         if (mode === modeValue)
             return;
-        drawSpaces();
+        if (!spacesRef.current)
+            return;
+        spacesRef.current.drawSpaces(canvasRef.current);
         dispatch((0, spaces_1.setMode)(mode));
         setSelectedElement(null);
     };
@@ -341,15 +383,17 @@ var useSpaces = function (props) {
         setSelectedElement(null);
     };
     var handleChangeTranslate = function (delta) {
+        if (!spacesRef.current)
+            return;
         spacesRef.current.translate = [
             spacesRef.current.translate[0] + delta[0],
             spacesRef.current.translate[1] + delta[1],
         ];
         dispatch((0, spaces_1.setTranslation)(spacesRef.current.translate));
-        drawSpaces();
+        spacesRef.current.drawSpaces(canvasRef.current);
     };
     return {
-        draw: drawSpaces,
+        draw: ((_b = spacesRef.current) === null || _b === void 0 ? void 0 : _b.drawSpaces(canvasRef.current)) || (function () { }),
         canvasRef: canvasRef,
         selectedElement: selectedElement === null
             ? selectedElement
@@ -376,11 +420,21 @@ var useSpaces = function (props) {
             handleToggle: handleToggleAngleSnapping,
         },
         zoom: {
-            min: spacesRef.current.zoomMin,
-            max: spacesRef.current.zoomMax,
+            min: ((_c = spacesRef.current) === null || _c === void 0 ? void 0 : _c.zoomMin) || 1,
+            max: ((_d = spacesRef.current) === null || _d === void 0 ? void 0 : _d.zoomMax) || 1,
             value: zoom || constants_1.ZOOM_DEFAULT,
             handleChange: updateZoom,
         },
+        unit: {
+            value: unit,
+            options: [types_1.IUnits.FEET, types_1.IUnits.METER, types_1.IUnits.INCH, types_1.IUnits.CM].map(function (el) { return ({
+                value: el,
+                label: el,
+                selected: unit === el,
+                handleSelect: function () { return updateUnit(el); },
+            }); }),
+            handleChange: updateUnit,
+        },
         translate: {
             handleChange: handleChangeTranslate,
         },

package/dist/hooks/useSpaces/types.d.ts

@@ -62,17 +62,25 @@ export interface IFeature {
     connectedTo: [elementType: IElements.WALL, index: number];
     restConfiguration: string;
 }
-export interface IFeatureHydrated extends IFeature {
+export interface IFeatureDoor extends IFeature {
+    orientation: string;
+    openingDirection: string;
+}
+interface IFeatureHydratedShared {
     line: ICoordinatesLine;
 }
-export interface IFeaturesShared<T> {
+export interface IFeatureHydrated extends IFeature, IFeatureHydratedShared {
+}
+export interface IFeatureDoorHydrated extends IFeatureDoor, IFeatureHydratedShared {
+}
+export interface IFeaturesShared<T, D> {
     [IElements.WINDOW]?: Array<T>;
-    [IElements.DOOR]?: Array<T>;
+    [IElements.DOOR]?: Array<D>;
     [IElements.OPENING]?: Array<T>;
 }
-export interface IFeatures extends IFeaturesShared<IFeature> {
+export interface IFeatures extends IFeaturesShared<IFeature, IFeatureDoor> {
 }
-export interface IFeaturesHydrated extends IFeaturesShared<IFeatureHydrated> {
+export interface IFeaturesHydrated extends IFeaturesShared<IFeatureHydrated, IFeatureDoorHydrated> {
 }
 export declare enum IElementStyleModes {
     HIGHLIGHT = "highlight",
@@ -159,6 +167,10 @@ export interface ISpacesThemePartial {
     vertex: Partial<IStylesVertex>;
     feature: Partial<IStylesFeature>;
 }
+export interface IWallsValidationConfig {
+    minLength: number;
+    padding: number;
+}
 export declare enum SNAPPING_TYPES {
     ANGLE = "angle"
 }
@@ -231,6 +243,7 @@ export interface ISpacesConfigUser extends ISpacesConfigShared<Partial<ISpacesSt
     zoomDisabled: boolean;
     translateDisabled: boolean;
     zoomSensitivity: number;
+    reverseZoom: boolean;
 }
 export interface ISpacesAttributes {
     [IElements.WALL]: string;
@@ -249,6 +262,8 @@ export interface ISpacesAttributes {
     wallEndY: string;
     wallEndZ: string;
     wallConnections: string;
+    doorOrientation: string;
+    doorOpeningDirection: string;
 }
 interface ISpacesPropsShared<T, U> {
     config: T;

package/dist/hooks/useSpaces/validators.d.ts

@@ -1,4 +1,4 @@
-import { IWall, IFeatures, IElementAddress, IWalls, IErrorElement, IFeature, INewWall, ICoordinate2D, IVertex, ISnapPoint } from './types';
+import { IWall, IFeatures, IElementAddress, IWalls, IErrorElement, IFeature, INewWall, ICoordinate2D, IVertex, ISnapPoint, IWallsValidationConfig } from './types';
 export interface IFeatureValidatorInput {
     updatedFeature: Pick<IFeature, 'length' | 'offset'> & {
         address: IElementAddress;
@@ -20,17 +20,17 @@ export interface IMoveVertexValidatorInput {
     vertex: IVertex;
     features: IFeatures;
 }
-declare type IValidatorFunction<T> = (input: T) => false | IErrorElement;
-export declare function isWallTooShort(input: IAddWallValidatorInput): false | IErrorElement;
+declare type IValidatorFunction<T> = (input: T, validationConfig: IWallsValidationConfig) => false | IErrorElement;
+export declare function isWallTooShort(input: IAddWallValidatorInput, validationConfig: IWallsValidationConfig): false | IErrorElement;
 export declare function isWallIntersectingFeature(input: IAddWallValidatorInput): false | IErrorElement;
 export declare function isWallOverlappingExisitingWalls(input: IAddWallValidatorInput): false | IErrorElement;
 export declare function isWallEndingOnFeature(input: IAddWallValidatorInput): false | IErrorElement;
-export declare function isFeatureOutsideWallBounds(input: IFeatureValidatorInput): false | IErrorElement;
+export declare function isFeatureOutsideWallBounds(input: IFeatureValidatorInput, validationConfig: IWallsValidationConfig): false | IErrorElement;
 export declare function isFeatureCollidingWithExistingFeature(input: IFeatureValidatorInput): false | IErrorElement;
-export declare function areWallsTooShort(input: IMoveVertexValidatorInput): false | IErrorElement;
+export declare function areWallsTooShort(input: IMoveVertexValidatorInput, validationConfig: IWallsValidationConfig): false | IErrorElement;
 export declare function areWallsIntersecting(input: IMoveVertexValidatorInput): false | IErrorElement;
-export declare function areWallsOrphaningFeatures(input: IMoveVertexValidatorInput): false | IErrorElement;
+export declare function areWallsOrphaningFeatures(input: IMoveVertexValidatorInput, validationConfig: IWallsValidationConfig): false | IErrorElement;
 export declare function areWallsDuplicated(input: IMoveVertexValidatorInput): false | IErrorElement;
 export declare function isVertexLandingOnFeature(input: IMoveVertexValidatorInput): false | IErrorElement;
-export declare function runValidators<T>(validators: Array<IValidatorFunction<T>>, input: T): IErrorElement[] | null;
+export declare function runValidators<T>(validators: Array<IValidatorFunction<T>>, input: T, validationConfig: IWallsValidationConfig): IErrorElement[] | null;
 export {};

package/dist/hooks/useSpaces/validators.js

@@ -13,9 +13,8 @@ exports.runValidators = exports.isVertexLandingOnFeature = exports.areWallsDupli
 var types_1 = require("./types");
 var geometry_1 = require("./geometry");
 var messaging_1 = require("./messaging");
-var constants_1 = require("./constants");
-function isLineTooShort(wallOrLine) {
-    var minLength = constants_1.MIN_WALL_LENGTH;
+function isLineTooShort(wallOrLine, validationConfig) {
+    var minLength = validationConfig.minLength;
     var line = Array.isArray(wallOrLine) ? wallOrLine : wallOrLine.line;
     var tooClose = geometry_1.arePointsWithinProximity.apply(void 0, __spreadArray(__spreadArray([], line, false), [minLength], false));
     if (tooClose)
@@ -25,8 +24,8 @@ function isLineTooShort(wallOrLine) {
         };
     return false;
 }
-function isWallTooShort(input) {
-    return isLineTooShort(input.newWall.line);
+function isWallTooShort(input, validationConfig) {
+    return isLineTooShort(input.newWall.line, validationConfig);
 }
 exports.isWallTooShort = isWallTooShort;
 function isWallIntersectingFeature(input) {
@@ -127,9 +126,9 @@ function isWallEndingOnFeature(input) {
     return false;
 }
 exports.isWallEndingOnFeature = isWallEndingOnFeature;
-function isFeatureOutsideWallBounds(input) {
+function isFeatureOutsideWallBounds(input, validationConfig) {
     var wall = input.wall, updatedFeature = input.updatedFeature;
-    var padding = constants_1.WALL_PADDING_FOR_FEATURE;
+    var padding = validationConfig.padding;
     var wallLength = (0, geometry_1.getLengthOfLineSegment)(wall.line);
     if (updatedFeature.offset < padding ||
         updatedFeature.offset + updatedFeature.length > wallLength - padding)
@@ -166,7 +165,7 @@ function isFeatureCollidingWithExistingFeature(input) {
     return false;
 }
 exports.isFeatureCollidingWithExistingFeature = isFeatureCollidingWithExistingFeature;
-function areWallsTooShort(input) {
+function areWallsTooShort(input, validationConfig) {
     var walls = input.walls, vertex = input.vertex, updatedPosition = input.updatedPosition;
     var _a = vertex.connections.reduce(function (output, connection) {
         var _a;
@@ -184,7 +183,7 @@ function areWallsTooShort(input) {
         var index = wallIndexes_1[_i];
         var line = walls[index].line;
         line[updatedVerticesMap[index]] = updatedPosition.point;
-        if (isLineTooShort(line))
+        if (isLineTooShort(line, validationConfig))
             return {
                 address: { type: types_1.IElements.WALL, index: index },
                 message: messaging_1.errorMessages.wallTooShort(),
@@ -230,9 +229,10 @@ function areWallsIntersecting(input) {
     return false;
 }
 exports.areWallsIntersecting = areWallsIntersecting;
-function areWallsOrphaningFeatures(input) {
+function areWallsOrphaningFeatures(input, validationConfig) {
     var _a;
     var walls = input.walls, vertex = input.vertex, features = input.features, updatedPosition = input.updatedPosition;
+    var padding = validationConfig.padding;
     var _b = vertex.connections.reduce(function (output, connection) {
         var _a;
         var wallIndex = connection[0], vertexIndex = connection[1];
@@ -266,10 +266,9 @@ function areWallsOrphaningFeatures(input) {
                 type: types_1.IErrorTypes.HARD,
             };
             if (updatedVerticesMap[wallIdx] === 0 &&
-                feat.offset - wallLengthDelta < constants_1.WALL_PADDING_FOR_FEATURE)
+                feat.offset - wallLengthDelta < padding)
                 return error;
-            else if (feat.offset + feat.length >
-                updatedWallLength - constants_1.WALL_PADDING_FOR_FEATURE) {
+            else if (feat.offset + feat.length > updatedWallLength - padding) {
                 return error;
             }
         }
@@ -348,9 +347,9 @@ function isVertexLandingOnFeature(input) {
     return false;
 }
 exports.isVertexLandingOnFeature = isVertexLandingOnFeature;
-function runValidators(validators, input) {
+function runValidators(validators, input, validationConfig) {
     var errors = validators.reduce(function (output, validate) {
-        var error = validate(input);
+        var error = validate(input, validationConfig);
         if (error)
             output.push(error);
         return output;

package/dist/store/spaces.d.ts

@@ -1,6 +1,6 @@
 import { RootState, ThreekitDispatch } from './index';
 import { IConfiguration } from '../types';
-import { ICoordinate2D, IModes } from '../hooks/useSpaces/types';
+import { ICoordinate2D, IModes, IUnits } from '../hooks/useSpaces/types';
 interface ILayout {
     label: string;
     configuration: IConfiguration;
@@ -16,6 +16,7 @@ interface IAttributeMap {
 export interface SpacesState {
     mode: IModes;
     layouts: Array<ILayout>;
+    unit: IUnits;
     zoom: null | number;
     translation: null | ICoordinate2D;
     showDimensions: boolean;
@@ -23,6 +24,7 @@ export interface SpacesState {
 }
 export declare const setLayouts: import("@reduxjs/toolkit").ActionCreatorWithPayload<ILayout[], string>;
 export declare const setZoom: import("@reduxjs/toolkit").ActionCreatorWithPayload<number, string>;
+export declare const setUnit: import("@reduxjs/toolkit").ActionCreatorWithPayload<IUnits, string>;
 export declare const setTranslation: import("@reduxjs/toolkit").ActionCreatorWithPayload<ICoordinate2D, string>;
 export declare const setMode: import("@reduxjs/toolkit").ActionCreatorWithPayload<IModes, string>;
 export declare const setShowDimensions: import("@reduxjs/toolkit").ActionCreatorWithPayload<boolean, string>;
@@ -30,6 +32,7 @@ export declare const setAngleSnappingEnabled: import("@reduxjs/toolkit").ActionC
 declare const reducer: import("redux").Reducer<SpacesState, import("redux").AnyAction>;
 export declare const getMode: (state: RootState) => IModes;
 export declare const getLayouts: (state: RootState) => Array<ILayout>;
+export declare const getUnit: (state: RootState) => IUnits;
 export declare const getZoom: (state: RootState) => number | null;
 export declare const getTranslation: (state: RootState) => ICoordinate2D | null;
 export declare const getShowDimensions: (state: RootState) => boolean;

package/dist/store/spaces.js

@@ -59,13 +59,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.hydrateLayouts = exports.getAngleSnappingEnabled = exports.getShowDimensions = exports.getTranslation = exports.getZoom = exports.getLayouts = exports.getMode = exports.setAngleSnappingEnabled = exports.setShowDimensions = exports.setMode = exports.setTranslation = exports.setZoom = exports.setLayouts = void 0;
+exports.hydrateLayouts = exports.getAngleSnappingEnabled = exports.getShowDimensions = exports.getTranslation = exports.getZoom = exports.getUnit = exports.getLayouts = exports.getMode = exports.setAngleSnappingEnabled = exports.setShowDimensions = exports.setMode = exports.setTranslation = exports.setUnit = exports.setZoom = exports.setLayouts = void 0;
 var toolkit_1 = require("@reduxjs/toolkit");
 var api_1 = __importDefault(require("../api"));
 var types_1 = require("../hooks/useSpaces/types");
 var findLoops_1 = require("../hooks/useSpaces/findLoops");
 exports.setLayouts = (0, toolkit_1.createAction)('treble/spaces/set-layouts');
 exports.setZoom = (0, toolkit_1.createAction)('treble/spaces/set-zoom');
+exports.setUnit = (0, toolkit_1.createAction)('treble/spaces/set-unit');
 exports.setTranslation = (0, toolkit_1.createAction)('treble/spaces/set-translation');
 exports.setMode = (0, toolkit_1.createAction)('treble/spaces/set-mode');
 exports.setShowDimensions = (0, toolkit_1.createAction)('treble/spaces/set-show-dimensions');
@@ -73,6 +74,7 @@ exports.setAngleSnappingEnabled = (0, toolkit_1.createAction)('treble/spaces/set
 var initialState = {
     mode: types_1.IModes.SELECT,
     layouts: [],
+    unit: types_1.IUnits.FEET,
     zoom: null,
     translation: null,
     showDimensions: true,
@@ -88,6 +90,9 @@ var reducer = (0, toolkit_1.createSlice)({
         builder.addCase(exports.setLayouts, function (state, action) {
             return __assign(__assign({}, state), { layouts: action.payload });
         });
+        builder.addCase(exports.setUnit, function (state, action) {
+            return __assign(__assign({}, state), { unit: action.payload });
+        });
         builder.addCase(exports.setZoom, function (state, action) {
             return __assign(__assign({}, state), { zoom: action.payload });
         });
@@ -109,6 +114,8 @@ var getLayouts = function (state) {
     return state.spaces.layouts;
 };
 exports.getLayouts = getLayouts;
+var getUnit = function (state) { return state.spaces.unit; };
+exports.getUnit = getUnit;
 var getZoom = function (state) { return state.spaces.zoom; };
 exports.getZoom = getZoom;
 var getTranslation = function (state) { return state.spaces.translation; };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threekit-tools/treble",
-  "version": "0.0.90-next-06",
+  "version": "0.0.90-next-08",
   "author": "Amaan Saeed",
   "license": "MIT",
   "files": [