@vectoriox/iox-builder 2.1.0 → 2.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vectoriox/iox-builder",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "peerDependencies": {
     "@angular/common": ">=20.0.0",
     "@angular/core": ">=20.0.0",

package/types/vectoriox-iox-builder.d.ts

@@ -610,7 +610,11 @@ declare enum PanelEventTypes {
     /** Open the Interactions panel in preset-edit mode for the given preset ID. */
     INTERACTION_PRESET_EDIT = "interactionpresetedit",
     /** Fired after an interaction preset is created, updated, or deleted so panels refresh. */
-    INTERACTION_PRESETS_CHANGED = "interactionpresetschanged"
+    INTERACTION_PRESETS_CHANGED = "interactionpresetschanged",
+    /** Open the Interactions panel and EXPAND a specific interaction for editing (data = interaction
+     *  id). Emitted when the overlay interaction badge is clicked so that badge → "edit THIS
+     *  interaction", without firing the element's (live) animation. */
+    INTERACTION_EDIT = "interactionedit"
 }
 interface PanelEvent {
     type: PanelEventTypes;
@@ -1316,6 +1320,7 @@ declare class BuilderComponent implements OnInit, AfterViewInit, OnChanges, OnDe
         action: ToolbarAction;
         entry: OverlayEntry;
         position?: 'before' | 'after';
+        interaction?: IoxInteraction;
     }): void;
     confirmSaveBlock(): void;
     cancelSaveBlock(): void;
@@ -1482,6 +1487,7 @@ declare class OverlayComponent implements OnInit, OnDestroy {
         action: ToolbarAction;
         entry: OverlayEntry;
         position?: "before" | "after";
+        interaction?: IoxInteraction;
     }>;
     hoverEntry: OverlayEntry | null;
     selectEntry: OverlayEntry | null;
@@ -1534,7 +1540,15 @@ declare class OverlayComponent implements OnInit, OnDestroy {
     get hasPresetInClipboard(): boolean;
     get hasInteractionPresetInClipboard(): boolean;
     onEditPreset(event: MouseEvent): void;
-    onEditInteractionPreset(event: MouseEvent): void;
+    /**
+     * Interaction badge clicked. It must ONLY open the Interactions panel with THIS interaction
+     * active — it must NOT fire the element's (live) animation. `preventDefault` + `stopPropagation`
+     * fully swallow the pointer event so it can never reach the node's live `click` interaction
+     * listener. The specific `ix` is forwarded so the builder can expand it in the panel.
+     */
+    onEditInteractionPreset(event: MouseEvent, ix?: IoxInteraction): void;
+    /** Swallow the follow-up click on the badge so it can't reach the canvas / a live interaction. */
+    onBadgeClickSwallow(event: MouseEvent): void;
     onBadgeContextMenu(event: MouseEvent, type: 'style' | 'interaction', ix?: IoxInteraction): void;
     onBadgeCopy(): void;
     onBadgeEdit(): void;
@@ -1782,7 +1796,22 @@ declare class BuilderRepeaterComponent implements OnInit, OnDestroy {
     static ɵcmp: i0.ɵɵComponentDeclaration<BuilderRepeaterComponent, "app-builder-repeater", never, { "children": { "alias": "children"; "required": false; }; "style": { "alias": "style"; "required": false; }; "nodeId": { "alias": "nodeId"; "required": false; }; "dropListId": { "alias": "dropListId"; "required": false; }; "source": { "alias": "source"; "required": false; }; "limit": { "alias": "limit"; "required": false; }; }, { "childClick": "childClick"; "childMouseEnter": "childMouseEnter"; "childMouseLeave": "childMouseLeave"; }, never, never, false, never>;
 }
 
+/**
+ * Directive-host ButtonBlock (wrapper collapse, task 9c). The real `<button>`/`<a>` IS the host —
+ * chosen by RenderDirective via `hostElement` from the `tag` trait (`variableTag`), NOT an internal
+ * `<button>` in the template. This matches the SSR engine's `button[iox-button-block]` component and
+ * every other collapsed builder component (Container/Section/List/…): ONE element per node carrying
+ * BOTH `iox-outer-{id}` (margin/width) + `iox-node-{id}` (visual props). Previously this component
+ * kept the OLD pattern — a custom-element selector plus a template that rendered its own
+ * `<button class="button-block-root">` — so RenderDirective's host `<button>` (iox-outer) wrapped a
+ * second `<button>` (iox-node): button-in-button, and width (outer) + aspect-ratio (inner) split
+ * across two elements so aspect-ratio never resolved. Collapsing to the single host fixes both.
+ *
+ * The `button`/`a` UA resets (border, background, text-decoration) live in the builder app's global
+ * styles.scss, kept OFF `:host` so styleProps (`.iox-node-{id}`) can override them.
+ */
 declare class BuilderButtonBlockComponent implements OnInit, OnDestroy {
+    private elRef;
     private dragEngine;
     private cdr;
     children: ComponentNode[];
@@ -1798,12 +1827,12 @@ declare class BuilderButtonBlockComponent implements OnInit, OnDestroy {
     childClick: EventEmitter<any>;
     childMouseEnter: EventEmitter<any>;
     childMouseLeave: EventEmitter<void>;
-    constructor(dragEngine: DragEngineService, cdr: ChangeDetectorRef);
+    constructor(elRef: ElementRef<HTMLElement>, dragEngine: DragEngineService, cdr: ChangeDetectorRef);
     ngOnInit(): void;
     ngOnDestroy(): void;
     onDrop(event: IoxDropEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<BuilderButtonBlockComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BuilderButtonBlockComponent, "app-builder-button-block", never, { "children": { "alias": "children"; "required": false; }; "style": { "alias": "style"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "type": { "alias": "type"; "required": false; }; "nodeId": { "alias": "nodeId"; "required": false; }; "dropListId": { "alias": "dropListId"; "required": false; }; }, { "childClick": "childClick"; "childMouseEnter": "childMouseEnter"; "childMouseLeave": "childMouseLeave"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BuilderButtonBlockComponent, "button[iox-button-block],a[iox-button-block]", never, { "children": { "alias": "children"; "required": false; }; "style": { "alias": "style"; "required": false; }; "tag": { "alias": "tag"; "required": false; }; "href": { "alias": "href"; "required": false; }; "target": { "alias": "target"; "required": false; }; "type": { "alias": "type"; "required": false; }; "nodeId": { "alias": "nodeId"; "required": false; }; "dropListId": { "alias": "dropListId"; "required": false; }; }, { "childClick": "childClick"; "childMouseEnter": "childMouseEnter"; "childMouseLeave": "childMouseLeave"; }, never, never, false, never>;
 }
 
 declare class SliderContainerComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {