@c8y/tutorial 1022.44.3 → 1022.44.7

package/package.json

@@ -1,21 +1,21 @@
 {
   "name": "@c8y/tutorial",
-  "version": "1022.44.3",
+  "version": "1022.44.7",
   "description": "This package is used to scaffold a tutorial for Cumulocity IoT Web SDK which explains a lot of concepts.",
   "dependencies": {
-    "@c8y/style": "1022.44.3",
-    "@c8y/ngx-components": "1022.44.3",
-    "@c8y/client": "1022.44.3",
-    "@c8y/bootstrap": "1022.44.3",
+    "@c8y/style": "1022.44.7",
+    "@c8y/ngx-components": "1022.44.7",
+    "@c8y/client": "1022.44.7",
+    "@c8y/bootstrap": "1022.44.7",
     "@angular/cdk": "^19.2.19",
-    "monaco-editor": "~0.52.2",
+    "monaco-editor": "~0.53.0",
     "ngx-bootstrap": "19.0.2",
     "leaflet": "1.9.4",
     "rxjs": "7.8.1"
   },
   "devDependencies": {
-    "@c8y/options": "1022.44.3",
-    "@c8y/devkit": "1022.44.3"
+    "@c8y/options": "1022.44.7",
+    "@c8y/devkit": "1022.44.7"
   },
   "peerDependencies": {
     "@angular/common": ">=19 <20"

package/src/bottom-drawer/bottom-drawer-content-example.component.html

@@ -1,5 +1,5 @@
 <div class="card-header separator">
-  <span class="h4 card-title">Bottom drawer title</span>
+  <span class="h4 card-title" id="drawerTitle">Bottom drawer title</span>
 </div>
 <div class="inner-scroll flex-grow">
   <div class="card-block">

package/src/bottom-drawer/bottom-drawer-content-example.component.ts

@@ -1,5 +1,7 @@
-import { Component, inject } from '@angular/core';
+import { Component, inject, OnInit, OnDestroy } from '@angular/core';
 import { BottomDrawerRef } from '@c8y/ngx-components';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
 
 @Component({
   selector: 'tut-bottom-drawer-content-example',
@@ -9,9 +11,10 @@ import { BottomDrawerRef } from '@c8y/ngx-components';
     class: 'd-contents'
   }
 })
-export class BottomDrawerContentExampleComponent {
+export class BottomDrawerContentExampleComponent implements OnInit, OnDestroy {
   bottomDrawerRef = inject(BottomDrawerRef);
   isDisabled = false;
+  destroy$: Subject<boolean> = new Subject<boolean>();
 
   result: Promise<string> = new Promise((resolve, reject) => {
     this._save = resolve;
@@ -21,6 +24,17 @@ export class BottomDrawerContentExampleComponent {
   private _save: (value: string) => void;
   private _cancel: (reason?: any) => void;
 
+  ngOnInit() {
+    this.bottomDrawerRef.onClosed$.pipe(takeUntil(this.destroy$)).subscribe(() => {
+      this._cancel('Drawer closed');
+    });
+  }
+
+  ngOnDestroy() {
+    this.destroy$.next(true);
+    this.destroy$.unsubscribe();
+  }
+
   cancel() {
     this._cancel('User canceled');
     this.bottomDrawerRef.close();

package/src/bottom-drawer/bottom-drawer-example.component.ts

@@ -19,7 +19,8 @@ export class BottomDrawerExampleComponent {
       initialState: {
         // place here any content you want to pass to the component
         isDisabled: true
-      }
+      },
+      disableClickOutside: true
     });
 
     try {