Ensure the resizer is applied on the proper selected component. Fixes #…

…6096
GrapesJS · Sep 6, 2024 · bc898c3 · bc898c3
1 parent 9a6fa0c
commit bc898c3
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 4 deletions.
diff --git a/packages/core/src/commands/view/SelectComponent.ts b/packages/core/src/commands/view/SelectComponent.ts
@@ -326,8 +326,10 @@ export default {
    */
   select(model: Component, event = {}) {
     if (!model) return;
-    this.editor.select(model, { event, useValid: true });
-    this.initResize(model);
+    const { em } = this;
+    em.setSelected(model, { event, useValid: true });
+    // Ensure we're passing the proper selected component #6096
+    this.initResize(em.getSelected());
   },
 
   /**

diff --git a/packages/core/src/dom_components/types.ts b/packages/core/src/dom_components/types.ts
@@ -52,6 +52,14 @@ export enum ComponentsEvents {
   update = 'component:update',
   updateInside = 'component:update-inside',
 
+  /**
+   * @event `component:select` Component selected.
+   * @example
+   * editor.on('component:select', (component) => { ... });
+   */
+  select = 'component:select',
+  selectBefore = 'component:select:before',
+
   /**
    * @event `symbol:main:add` Added new main symbol.
    * @example

diff --git a/packages/core/src/editor/model/Editor.ts b/packages/core/src/editor/model/Editor.ts
@@ -43,6 +43,7 @@ import { AddComponentsOption, ComponentAdd, DragMode } from '../../dom_component
 import ComponentWrapper from '../../dom_components/model/ComponentWrapper';
 import { CanvasSpotBuiltInTypes } from '../../canvas/model/CanvasSpot';
 import DataSourceManager from '../../data_sources';
+import { ComponentsEvents } from '../../dom_components/types';
 
 Backbone.$ = $;
 
@@ -507,7 +508,7 @@ export default class EditorModel extends Model {
 
     models.forEach((model) => {
       if (model) {
-        this.trigger('component:select:before', model, opts);
+        this.trigger(ComponentsEvents.selectBefore, model, opts);
 
         // Check for valid selectable
         if (!model.get('selectable') || opts.abort) {
@@ -592,7 +593,7 @@ export default class EditorModel extends Model {
       toDeselect.forEach((cmp) => this.removeSelected(cmp, opts));
 
       selected.addComponent(model, opts);
-      this.trigger('component:select', model, opts);
+      this.trigger(ComponentsEvents.select, model, opts);
       this.Canvas.addSpot({
         type: CanvasSpotBuiltInTypes.Select,
         component: model,