feat: focus hierarchy search on init

fix: highlight selected region in hierarchy
feat: on region select, close hierarchy
feat: point dialog closes dialog
fix: best viewpoints

src/atlasComponents/sapiViews/core/rich/regionsHierarchy/regionsHierarchy.template.html

@@ -5,7 +5,9 @@
     matInput
     name="searchTerm"
     [formControl]="searchFormControl"
-    autocomplete="off">
+    autocomplete="off"
+    [cdkTrapFocus]="true"
+    [cdkTrapFocusAutoCapture]="true">
 
   <!-- search input suffix -->
   <div matSuffix>
@@ -18,7 +20,7 @@
   <div class="mat-body sxplr-d-flex sxplr-align-items-center sxplr-h-100 region-tmpl"
     [matTooltip]="last && !labelMappedRegionNames.includes(region.name) ? TXT_CANNOT_BE_SELECTED : null"
     [ngClass]="{
-      'sxplr-custom-cmp accent': accentedRegions | includes : region,
+      'sxplr-custom-cmp accent': accentedRegions | mapToProperty: 'name' | includes : region.name,
       'muted-7': !labelMappedRegionNames.includes(region.name)
     }"
     [innerHTML]="region.name | hightlightPipe : (searchTerm$ | async)">

src/sharedModules/angularMaterial.module.ts

@@ -33,6 +33,7 @@ import { MatProgressSpinnerModule } from "@angular/material/progress-spinner";
 import { MatRadioModule } from "@angular/material/radio";
 import { MatTableModule } from "@angular/material/table";
 import { MatSortModule } from "@angular/material/sort";
+import { A11yModule } from "@angular/cdk/a11y";
 
 const defaultDialogOption: MatDialogConfig = new MatDialogConfig()
 
@@ -70,6 +71,7 @@ const defaultDialogOption: MatDialogConfig = new MatDialogConfig()
     MatRadioModule,
     MatTableModule,
     MatSortModule,
+    A11yModule,
   ],
   providers: [{
     provide: MAT_DIALOG_DEFAULT_OPTIONS,

src/ui/dialogInfo/dialog.directive.ts

 import { Directive, HostListener, Input, TemplateRef } from "@angular/core";
-import { MatDialog, MatDialogConfig } from 'src/sharedModules/angularMaterial.exports'
+import { MatDialog, MatDialogConfig, MatDialogRef } from 'src/sharedModules/angularMaterial.exports'
 import { DialogFallbackCmp } from "./tmpl/tmpl.component"
 
 type DialogSize = 's' | 'm' | 'l' | 'xl' | 'auto'
@@ -40,6 +40,8 @@ export class DialogDirective{
   @Input('sxplr-dialog-data')
   data: any = {}
 
+  #dialogRef: MatDialogRef<unknown>
+
   constructor(private matDialog: MatDialog){}
 
   @HostListener('click')
@@ -48,10 +50,17 @@ export class DialogDirective{
       ? this.templateRef
       : DialogFallbackCmp
 
-    this.matDialog.open(tmpl, {
+    this.#dialogRef = this.matDialog.open(tmpl, {
       autoFocus: null,
       data: {...this.data, ...data},
       ...(sizeDict[this.size] || {})
     })
   }
+
+  close(){
+    if (this.#dialogRef) {
+      this.#dialogRef.close()
+      this.#dialogRef = null
+    }
+  }
 }

src/viewerModule/nehuba/ngLayerCtlModule/ngLayerCtl/ngLayerCtrl.component.ts

@@ -168,7 +168,7 @@ export class NgLayerCtrlCmp implements OnChanges, OnDestroy{
       position = Array.from(final)
     }
 
-    const enclosed = this.meta?.bestViewPoints.filter(isEnclosed).find(v => v.points.length >= 3)
+    const enclosed = (this.meta?.bestViewPoints || []).filter(isEnclosed).find(v => v.points.length >= 3)
     if (enclosed) {
       const curr = vec3.fromValues(...this.currentPositionMm)
       const pt1 = vec3.fromValues(...enclosed.points[0].value)

src/viewerModule/nehuba/statusCard/statusCard.template.html

@@ -140,20 +140,23 @@
 
       <button mat-raised-button color="primary"
         (click)="selectPoint(state.valueMm)"
-        [disabled]="!state.validated">
+        [disabled]="!state.validated"
+        mat-dialog-close>
         select point
       </button>
   
       <button mat-button color="primary"
         (click)="navigateTo(state.valueNm)"
-        [disabled]="!state.validated">
+        [disabled]="!state.validated"
+        mat-dialog-close>
         navigate to point
       </button>
 
       <button mat-button color="primary"
         [attr.aria-label]="COPY_NAVIGATION_STRING"
         (click)="copyString(state.string)"
-        [disabled]="!state.validated">
+        [disabled]="!state.validated"
+        mat-dialog-close>
         copy point
       </button>
   

src/viewerModule/viewerCmp/viewerCmp.template.html

@@ -524,7 +524,7 @@
               [sxplr-sapiviews-core-rich-regionshierarchy-regions]="view.allAvailableRegions"
               [sxplr-sapiviews-core-rich-regionshierarchy-label-mapped-region-names]="view.labelMappedRegionNames"
               [sxplr-sapiviews-core-rich-regionshierarchy-accent-regions]="view.selectedRegions"
-              (sxplr-sapiviews-core-rich-regionshierarchy-region-select)="selectRoi($event)"
+              (sxplr-sapiviews-core-rich-regionshierarchy-region-select)="selectRoi($event); showHierarchyBtn.close()"
               (sxplr-sapiviews-core-rich-regionshierarchy-region-toggle)="toggleRoi($event)"
               >
             </sxplr-sapiviews-core-rich-regionshierarchy>