@threekit-tools/treble 0.0.90-next-05 → 0.0.90-next-07

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, IEnclosedSpace, IFeatureDoor, IWallsValidationConfig } from './types';
 import type { IHydratedAttribute } from '../../types';
 export declare class SpacesState {
     private _config;
@@ -15,6 +15,7 @@ export declare class SpacesState {
     private _zoomLimits;
     private _translate;
     private _translateLimits;
+    private _validationConfig;
     private _state;
     constructor(config: ISpacesStateProps);
     get walls(): IWalls;
@@ -34,7 +35,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;
@@ -60,6 +61,8 @@ export declare class SpacesState {
     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 +76,8 @@ export declare class SpacesState {
     private getWallConnectionCount;
     private getWallConnectionsHydrated;
     private getWallDimensions;
-    private getWallDetailedDimensions;
+    private getWallDimensionsByIndex;
+    private getWallDetailedDimensionsByIndex;
     private getAllWallDimensionsToDraw;
     private shiftAllFeaturesOnWall;
     private addFeatureToWall;
@@ -90,8 +94,10 @@ export declare class SpacesState {
     private getFeature;
     private updateFeature;
     private repositionFeature;
-    addFeature(type: IFeatureName, feature: Omit<IFeature, 'path' | 'connectedTo' | 'offset'> & {
+    addFeature(type: IFeatureName, feature: Pick<IFeature, 'assetId' | 'length'> & {
         offset?: number;
+        height?: number;
+        altitude?: number;
     }, addToWallIndex?: number): void;
     deleteFeature(type: IFeatureName, index: number): void;
     private getHydratedFeature;

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:
@@ -486,6 +486,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,11 +571,7 @@ 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);
         return {
@@ -573,7 +579,14 @@ var SpacesState = (function () {
             label: (0, dataHandlers_1.prepLengthForUser)(convertedVal, this._config.config.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;
@@ -630,8 +643,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 +763,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 +794,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;
                         }
                     }
@@ -902,16 +914,19 @@ var SpacesState = (function () {
         }
         if (index === undefined || offset === undefined)
             return;
-        var newFeature = __assign(__assign({}, feature), { offset: offset, connectedTo: [types_2.IElements.WALL, index] });
+        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 +1177,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 +1251,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 +1437,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,26 +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["POSITION_Z"] = "_tkSpace_offsetZ";
-    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.featurePositionZ = FeatureAttribute.POSITION_Z,
-    _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,
@@ -49,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;
@@ -59,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',
@@ -78,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,8 +1,9 @@
-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): {
-    features: IFeatures;
+    validationConfig: IWallsValidationConfig;
+    features: {};
     walls: IWalls;
     vertex: IVerticesState;
 };

package/dist/hooks/useSpaces/dataHandlers.js

@@ -69,61 +69,94 @@ 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,
-            path: path,
+            height: height,
+            altitude: altitude,
             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 featuresList = [types_1.IElements.WINDOW, types_1.IElements.DOOR, types_1.IElements.OPENING];
-    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;
-        var assetId = feature.assetId, offset = feature.offset, length = feature.length;
+        var assetId = feature.assetId, offset = feature.offset, length = feature.length, height = feature.height, altitude = feature.altitude, restConfiguration = feature.restConfiguration;
         var connectedTo = prepConnectionOutgoing([
             config.attributes[feature.connectedTo[0]],
             feature.connectedTo[1],
         ]);
-        var configuration = Object.entries((_a = {},
+        var configurationToScale = (_a = {},
             _a[attributeName.featureLength] = length,
             _a[attributeName.featurePositionX] = offset,
-            _a)).reduce(function (output, _a) {
+            _a);
+        if (altitude)
+            configurationToScale[attributeName.featurePositionY] = altitude;
+        if (height)
+            configurationToScale[attributeName.featureHeight] = height;
+        var configuration = Object.entries(configurationToScale).reduce(function (output, _a) {
             var _b;
             var key = _a[0], value = _a[1];
             return Object.assign(output, (_b = {},
                 _b[key] = value ? value * config.config.scale : value,
                 _b));
-        }, (_b = {},
-            _b[attributeName.featureConnectedTo] = connectedTo,
-            _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,
@@ -168,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.js

@@ -159,10 +159,12 @@ var useSpaces = function (props) {
         drawSpaces();
     };
     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) {
@@ -185,12 +187,12 @@ var useSpaces = function (props) {
             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 ||

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

@@ -56,20 +56,31 @@ export interface IFeature {
     assetId: string;
     offset: number;
     length: number;
+    height: number;
+    altitude: number;
     path?: ICoordinatesQuadrilateral;
     connectedTo: [elementType: IElements.WALL, index: number];
+    restConfiguration: string;
+}
+export interface IFeatureDoor extends IFeature {
+    orientation: string;
+    openingDirection: string;
 }
-export interface IFeatureHydrated extends IFeature {
+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",
@@ -156,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"
 }
@@ -228,6 +243,7 @@ export interface ISpacesConfigUser extends ISpacesConfigShared<Partial<ISpacesSt
     zoomDisabled: boolean;
     translateDisabled: boolean;
     zoomSensitivity: number;
+    reverseZoom: boolean;
 }
 export interface ISpacesAttributes {
     [IElements.WALL]: string;
@@ -236,7 +252,6 @@ export interface ISpacesAttributes {
     [IElements.OPENING]: string;
     featurePositionX: string;
     featurePositionY: string;
-    featurePositionZ: string;
     featureConnectedTo: string;
     featureHeight: string;
     featureLength: string;
@@ -247,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/package.json

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