feat(core): controlled behavior (#1676)

Co-authored-by: Daniel Leroux <daniel.leroux@siemens.com>
siemens · Feb 17, 2025 · 4685dc2 · 4685dc2
1 parent 8bec56d
commit 4685dc2
Show file tree

Hide file tree

Showing 31 changed files with 792 additions and 46 deletions.
diff --git a/.changeset/eighty-doors-wait.md b/.changeset/eighty-doors-wait.md
@@ -0,0 +1,7 @@
+---
+'@siemens/ix-angular': minor
+'@siemens/ix': minor
+'@siemens/ix-vue': minor
+---
+
+`ix-flip-tile`: Expsose `index` property to allow setting of displayed content and add `toggle` event. 
diff --git a/.changeset/shy-lions-hear.md b/.changeset/shy-lions-hear.md
@@ -0,0 +1,7 @@
+---
+'@siemens/ix-angular': minor
+'@siemens/ix': minor
+'@siemens/ix-vue': minor
+---
+
+`ix-menu`: Add `openSettings` and `openAbout` events. Event `expandChange` can now be prevented via `event.preventDefault()`.
diff --git a/.changeset/tender-planes-bathe.md b/.changeset/tender-planes-bathe.md
@@ -0,0 +1,5 @@
+---
+'@siemens/ix': minor
+---
+
+`ìx-drawer`: Events `open` and `drawerClose` can now be prevented via`event.preventDefault()`.
diff --git a/.changeset/thick-vans-arrive.md b/.changeset/thick-vans-arrive.md
@@ -0,0 +1,7 @@
+---
+'@siemens/ix-angular': minor
+'@siemens/ix': minor
+'@siemens/ix-vue': minor
+---
+
+Add `tabChange` event to `ix-menu-settings` and `ix-menu-about`.
diff --git a/packages/angular/src/components.ts b/packages/angular/src/components.ts
@@ -1058,25 +1058,31 @@ export declare interface IxFilterChip extends Components.IxFilterChip {
 
 
 @ProxyCmp({
-  inputs: ['height', 'state', 'width']
+  inputs: ['height', 'index', 'state', 'width']
 })
 @Component({
   selector: 'ix-flip-tile',
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: '<ng-content></ng-content>',
   // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-  inputs: ['height', 'state', 'width'],
+  inputs: ['height', 'index', 'state', 'width'],
 })
 export class IxFlipTile {
   protected el: HTMLElement;
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;
+    proxyOutputs(this, this.el, ['toggle']);
   }
 }
 
 
-export declare interface IxFlipTile extends Components.IxFlipTile {}
+export declare interface IxFlipTile extends Components.IxFlipTile {
+  /**
+   * Event emitted when the index changes @since 3.0.0
+   */
+  toggle: EventEmitter<CustomEvent<number>>;
+}
 
 
 @ProxyCmp({
@@ -1524,7 +1530,7 @@ export class IxMenu {
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;
-    proxyOutputs(this, this.el, ['expandChange', 'mapExpandChange', 'openAppSwitch']);
+    proxyOutputs(this, this.el, ['expandChange', 'mapExpandChange', 'openAppSwitch', 'openSettings', 'openAbout']);
   }
 }
 
@@ -1542,6 +1548,14 @@ export declare interface IxMenu extends Components.IxMenu {
    * Event emitted when the app switch button is clicked @since 3.0.0
    */
   openAppSwitch: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the settings button is clicked @since 3.0.0
+   */
+  openSettings: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the about button is clicked @since 3.0.0
+   */
+  openAbout: EventEmitter<CustomEvent<void>>;
 }
 
 
@@ -1560,14 +1574,18 @@ export class IxMenuAbout {
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;
-    proxyOutputs(this, this.el, ['close']);
+    proxyOutputs(this, this.el, ['tabChange', 'close']);
   }
 }
 
 
 import type { CustomCloseEvent as IIxMenuAboutCustomCloseEvent } from '@siemens/ix';
 
 export declare interface IxMenuAbout extends Components.IxMenuAbout {
+  /**
+   * Active tab changed @since 3.0.0
+   */
+  tabChange: EventEmitter<CustomEvent<string>>;
   /**
    * About and Legal closed
    */
@@ -1752,14 +1770,18 @@ export class IxMenuSettings {
   constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
     c.detach();
     this.el = r.nativeElement;
-    proxyOutputs(this, this.el, ['close']);
+    proxyOutputs(this, this.el, ['tabChange', 'close']);
   }
 }
 
 
 import type { CustomCloseEvent as IIxMenuSettingsCustomCloseEvent } from '@siemens/ix';
 
 export declare interface IxMenuSettings extends Components.IxMenuSettings {
+  /**
+   * Active tab changed @since 3.0.0
+   */
+  tabChange: EventEmitter<CustomEvent<string>>;
   /**
    * Popover closed
    */

diff --git a/packages/core/component-doc.json b/packages/core/component-doc.json
@@ -8662,6 +8662,33 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "index",
+          "type": "number",
+          "complexType": {
+            "original": "number",
+            "resolved": "number",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "index",
+          "reflectToAttr": false,
+          "docs": "Index of the currently visible content",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ],
+          "default": "0",
+          "values": [
+            {
+              "type": "number"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "state",
           "type": "FlipTileState.Alarm | FlipTileState.Info | FlipTileState.None | FlipTileState.Primary | FlipTileState.Warning | undefined",
@@ -8737,7 +8764,27 @@
         }
       ],
       "methods": [],
-      "events": [],
+      "events": [
+        {
+          "event": "toggle",
+          "detail": "number",
+          "bubbles": true,
+          "complexType": {
+            "original": "number",
+            "resolved": "number",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Event emitted when the index changes",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ]
+        }
+      ],
       "styles": [],
       "slots": [],
       "parts": [],
@@ -12516,6 +12563,25 @@
           "docs": "Map Sidebar expanded",
           "docsTags": []
         },
+        {
+          "event": "openAbout",
+          "detail": "void",
+          "bubbles": true,
+          "complexType": {
+            "original": "void",
+            "resolved": "void",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Event emitted when the about button is clicked",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ]
+        },
         {
           "event": "openAppSwitch",
           "detail": "void",
@@ -12534,6 +12600,25 @@
               "text": "3.0.0"
             }
           ]
+        },
+        {
+          "event": "openSettings",
+          "detail": "void",
+          "bubbles": true,
+          "complexType": {
+            "original": "void",
+            "resolved": "void",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Event emitted when the settings button is clicked",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ]
         }
       ],
       "styles": [],
@@ -12672,6 +12757,25 @@
           "composed": true,
           "docs": "About and Legal closed",
           "docsTags": []
+        },
+        {
+          "event": "tabChange",
+          "detail": "string",
+          "bubbles": true,
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Active tab changed",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ]
         }
       ],
       "styles": [],
@@ -13777,6 +13881,25 @@
           "composed": true,
           "docs": "Popover closed",
           "docsTags": []
+        },
+        {
+          "event": "tabChange",
+          "detail": "string",
+          "bubbles": true,
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Active tab changed",
+          "docsTags": [
+            {
+              "name": "since",
+              "text": "3.0.0"
+            }
+          ]
         }
       ],
       "styles": [],