#599 InternalError: too much recursion issue partially fixed

src/editor/components/seSpinInput.js

@@ -183,7 +183,7 @@ export class SESpinInput extends HTMLElement {
   connectedCallback () {
     this.$input.addEventListener('onchange', (e) => {
       e.preventDefault();
-      if(e.detail !== this.value && e.detail !== "") {
+      if(e.detail !== this.value && e.detail !== "" && !isNaN(e.detail) ) {
         const event = new CustomEvent('change', { detail: e.detail });
         this.dispatchEvent(event);
       }

src/editor/panels/BottomPanel.js

@@ -134,9 +134,15 @@ class BottomPanel {
     * @type {module}
     */
   handleOpacity (evt) {
-    const val = Number.parseInt(evt.currentTarget.value.split('%')[0]);
+    let val = evt.currentTarget.value;
+    if(evt.detail !== undefined) {
+      val = evt.detail;
+    }
+    val = Number.parseInt(val.split('%')[0]);
+    if(!isNaN(val)) {
       this.editor.svgCanvas.setOpacity(val / 100);
     }
+  }
   /**
   * @type {module}
   */

src/editor/panels/TopPanel.js

@@ -497,23 +497,35 @@ class TopPanel {
    * @type {module}
    */
   changeRectRadius(e) {
-    this.editor.svgCanvas.setRectRadius(e.target.value);
+    let val = e.target.value;
+    if(e.detail !== undefined) {
+      val = e.detail;
+    }
+    this.editor.svgCanvas.setRectRadius(val);
   }
 
   /**
    * @type {module}
    */
   changeFontSize(e) {
-    this.editor.svgCanvas.setFontSize(e.target.value);
+    let val = e.target.value;
+    if(e.detail !== undefined) {
+      val = e.detail;
+    }
+    this.editor.svgCanvas.setFontSize(val);
   }
 
   /**
    * @type {module}
    */
   changeRotationAngle(e) {
-    this.editor.svgCanvas.setRotationAngle(e.target.value);
+    let val = e.target.value;
+    if(e.detail !== undefined) {
+      val = e.detail;
+    }
+    this.editor.svgCanvas.setRotationAngle(val);
     // eslint-disable-next-line max-len
-    (Number.parseInt(e.target.value) === 0) ? $id("tool_reorient").classList.add("disabled") : $id("tool_reorient").classList.remove("disabled");
+    (Number.parseInt(val) === 0) ? $id("tool_reorient").classList.add("disabled") : $id("tool_reorient").classList.remove("disabled");
   }
 
   /**
@@ -521,7 +533,11 @@ class TopPanel {
    * @returns {void}
    */
   changeBlur(e) {
-    this.editor.svgCanvas.setBlur(e.target.value / 10, true);
+    let val = e.target.value;
+    if(e.detail !== undefined) {
+      val = e.detail;
+    }
+    this.editor.svgCanvas.setBlur(val / 10, true);
   }
   /**
    *
@@ -570,7 +586,10 @@ class TopPanel {
    */
   attrChanger(e) {
     const attr = e.target.getAttribute("data-attr");
-    let val = (e.detail || e.target.value);
+    let val = e?.target?.value;
+    if(e.detail !== undefined) {
+      val = e.detail;
+    }
     const valid = isValidUnit(attr, val, this.selectedElement);
 
     if (!valid) {

src/svgcanvas/elem-get-set.js

@@ -828,7 +828,7 @@ export const setRectRadiusMethod = function (val) {
   const selected = selectedElements[0];
   if (!isNullish(selected) && selected.tagName === 'rect') {
     const r = selected.getAttribute('rx');
-    if (r !== String(val)) {
+    if (r !== String(val) && !isNullish(val)) {
       selected.setAttribute('rx', val);
       selected.setAttribute('ry', val);
       elemContext_.addCommandToHistory(new ChangeElementCommand(selected, { rx: r, ry: r }, 'Radius'));

src/svgcanvas/selection.js

@@ -385,9 +385,11 @@ export const setRotationAngle = function (val, preventUndo) {
     } else {
       elem.removeAttribute('transform');
     }
+    if (oldTransform !== newTransform) {
       svgCanvas.changeSelectedAttribute('transform', newTransform, selectedElements());
       svgCanvas.call('changed', selectedElements());
     }
+  }
   // const pointGripContainer = getElem('pathpointgrip_container');
   // if (elem.nodeName === 'path' && pointGripContainer) {
   //   pathActions.setPointContainerTransform(elem.getAttribute('transform'));