Fixed height/width calculations when height/width not numeric values. Allows for the auto height/width to be preserved.

src/commands/view/SelectComponent.js

@@ -370,14 +370,30 @@ module.exports = {
         // Here the resizer is updated with the current element height and width
         onStart(e, opts = {}) {
           const { el, config, resizer } = opts;
-          const { keyHeight, keyWidth, currentUnit } = config;
+          const {
+            keyHeight,
+            keyWidth,
+            currentUnit,
+            keepAutoHeight,
+            keepAutoWidth
+          } = config;
           toggleBodyClass('add', e, opts);
           modelToStyle = em.get('StyleManager').getModelToStyle(model);
           const computedStyle = getComputedStyle(el);
           const modelStyle = modelToStyle.getStyle();
-          const currentWidth = modelStyle[keyWidth] || computedStyle[keyWidth];
-          const currentHeight =
-            modelStyle[keyHeight] || computedStyle[keyHeight];
+
+          let currentWidth = modelStyle[keyWidth];
+          config.autoWidth = keepAutoWidth && currentWidth === 'auto';
+          if (isNaN(parseFloat(currentWidth))) {
+            currentWidth = computedStyle[keyWidth];
+          }
+
+          let currentHeight = modelStyle[keyHeight];
+          config.autoHeight = keepAutoHeight && currentHeight === 'auto';
+          if (isNaN(parseFloat(currentHeight))) {
+            currentHeight = computedStyle[keyHeight];
+          }
+
           resizer.startDim.w = parseFloat(currentWidth);
           resizer.startDim.h = parseFloat(currentHeight);
           showOffsets = 0;
@@ -405,17 +421,17 @@ module.exports = {
           }
 
           const { store, selectedHandler, config } = options;
-          const { keyHeight, keyWidth } = config;
+          const { keyHeight, keyWidth, autoHeight, widthAuto } = config;
           const onlyHeight = ['tc', 'bc'].indexOf(selectedHandler) >= 0;
           const onlyWidth = ['cl', 'cr'].indexOf(selectedHandler) >= 0;
           const style = modelToStyle.getStyle();
 
           if (!onlyHeight) {
-            style[keyWidth] = rect.w + config.unitWidth;
+            style[keyWidth] = widthAuto ? 'auto' : rect.w + config.unitWidth;
           }
 
           if (!onlyWidth) {
-            style[keyHeight] = rect.h + config.unitHeight;
+            style[keyHeight] = autoHeight ? 'auto' : rect.h + config.unitHeight;
           }
 
           modelToStyle.setStyle(style, { avoidStore: 1 });

src/utils/Resizer.js

@@ -45,6 +45,18 @@ var defaultOpts = {
   // If true the container of handlers won't be updated
   avoidContainerUpdate: 0,
 
+  // If height is 'auto', this setting will preserve it and only update  width
+  keepAutoHeight: false,
+
+  // If width is 'auto', this setting will preserve it and only update height
+  keepAutoWidth: false,
+
+  // When keepAutoHeight is true and the height has the value 'auto', this is set to true and height isn't updated
+  autoHeight: false,
+
+  // When keepAutoWidth is true and the width has the value 'auto', this is set to true and width isn't updated
+  autoWidth: false,
+
   // Handlers
   tl: 1, // Top left
   tc: 1, // Top center