@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.9 → 0.2.10

package/dist/themes/focus-management.js

@@ -2,21 +2,21 @@ import { screenReaderOptimizer } from './screen-reader';
 
 // Focus management utilities
 export class AccessibilityFocusManager {
-  private focusableSelectors];
-  private focusableElements];
-  private lastFocusedElement;
-  private focusTraps, FocusTrap>;
-  private focusHistory];
-  private maxHistorySize;
+  private focusableSelectors: string[];
+  private focusableElements: HTMLElement[];
+  private lastFocusedElement: HTMLElement | null;
+  private focusTraps: Map<string, FocusTrap>;
+  private focusHistory: HTMLElement[];
+  private maxHistorySize: number;
 
   constructor() {
     this.focusableSelectors = [
       'a[href]',
-      'button])',
-      'input])',
-      'select])',
-      'textarea])',
-      '[tabindex]="-1"])',
+      'button:not([disabled])',
+      'input:not([disabled])',
+      'select:not([disabled])',
+      'textarea:not([disabled])',
+      '[tabindex]:not([tabindex="-1"])',
       '[contenteditable="true"]',
       'audio[controls]',
       'video[controls]',
@@ -33,18 +33,22 @@ export class AccessibilityFocusManager {
   }
 
   // Initialize focus management
-  private initialize());
+  private initialize(): void {
+    this.updateFocusableElements();
     this.setupEventListeners();
   }
 
   // Update list of focusable elements
-  private updateFocusableElements()= Array.from(
+  private updateFocusableElements(): void {
+    this.focusableElements = Array.from(
       document.querySelectorAll(this.focusableSelectors.join(','))
     ) as HTMLElement[];
   }
 
   // Setup event listeners
-  private setupEventListeners(), this.handleFocusIn.bind(this));
+  private setupEventListeners(): void {
+    // Track focus changes
+    document.addEventListener('focusin', this.handleFocusIn.bind(this));
     document.addEventListener('focusout', this.handleFocusOut.bind(this));
     
     // Handle tab key navigation
@@ -56,12 +60,14 @@ export class AccessibilityFocusManager {
     });
     
     observer.observe(document.body, {
-      childList,
-      subtree});
+      childList: true,
+      subtree: true
+    });
   }
 
   // Handle focus in events
-  private handleFocusIn(event)= event.target as HTMLElement;
+  private handleFocusIn(event: FocusEvent): void {
+    const target = event.target as HTMLElement;
     
     if (target && target !== this.lastFocusedElement) {
       // Add to focus history
@@ -81,16 +87,20 @@ export class AccessibilityFocusManager {
   }
 
   // Handle focus out events
-  private handleFocusOut(_event)}
+  private handleFocusOut(_event: FocusEvent): void {
+    // Focus out handling if needed
+  }
 
   // Handle key down events
-  private handleKeyDown(event)=== 'Tab') {
+  private handleKeyDown(event: KeyboardEvent): void {
+    if (event.key === 'Tab') {
       this.handleTabNavigation(event);
     }
   }
 
   // Handle tab navigation
-  private handleTabNavigation(event)= event.shiftKey;
+  private handleTabNavigation(event: KeyboardEvent): void {
+    const isShiftTab = event.shiftKey;
     const currentElement = event.target as HTMLElement;
     
     // Check if we're in a focus trap
@@ -106,7 +116,8 @@ export class AccessibilityFocusManager {
   }
 
   // Get active focus trap for element
-  private getActiveFocusTrap(element))) {
+  private getActiveFocusTrap(element: HTMLElement): FocusTrap | null {
+    for (const trap of this.focusTraps.values()) {
       if (trap.isActive && trap.container.contains(element)) {
         return trap;
       }
@@ -115,36 +126,40 @@ export class AccessibilityFocusManager {
   }
 
   // Navigate within a focus trap
-  private navigateInFocusTrap(trap, isShiftTab)= trap.getFocusableElements();
+  private navigateInFocusTrap(trap: FocusTrap, isShiftTab: boolean): void {
+    const focusableElements = trap.getFocusableElements();
     if (focusableElements.length === 0) return;
 
     const currentIndex = focusableElements.indexOf(document.activeElement as HTMLElement);
-    let nextIndex;
+    let nextIndex: number;
 
     if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 ;
+      nextIndex = currentIndex > 0 ? currentIndex - 1 : focusableElements.length - 1;
     } else {
-      nextIndex = currentIndex < focusableElements.length - 1 ? currentIndex + 1 ;
+      nextIndex = currentIndex < focusableElements.length - 1 ? currentIndex + 1 : 0;
     }
 
     focusableElements[nextIndex]?.focus();
   }
 
   // Navigate focusable elements
-  private navigateFocusableElements(isShiftTab)= this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    let nextIndex;
+  private navigateFocusableElements(isShiftTab: boolean): void {
+    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
+    let nextIndex: number;
 
     if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 ;
+      nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
     } else {
-      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 ;
+      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
     }
 
     this.focusableElements[nextIndex]?.focus();
   }
 
   // Add element to focus history
-  private addToFocusHistory(element)= this.focusHistory.filter(el => el !== element);
+  private addToFocusHistory(element: HTMLElement): void {
+    // Remove if already exists
+    this.focusHistory = this.focusHistory.filter(el => el !== element);
     
     // Add to beginning
     this.focusHistory.unshift(element);
@@ -156,7 +171,8 @@ export class AccessibilityFocusManager {
   }
 
   // Get element description for screen readers
-  private getElementDescription(element)= element.getAttribute('aria-label');
+  private getElementDescription(element: HTMLElement): string {
+    const ariaLabel = element.getAttribute('aria-label');
     if (ariaLabel) return ariaLabel;
 
     const ariaLabelledBy = element.getAttribute('aria-labelledby');
@@ -175,7 +191,9 @@ export class AccessibilityFocusManager {
   }
 
   // Get element context for screen readers
-  private getElementContext(element)= element.closest('[role], section, article, aside, nav, header, footer, main');
+  private getElementContext(element: HTMLElement): string | undefined {
+    // Find nearest landmark or section
+    const landmark = element.closest('[role], section, article, aside, nav, header, footer, main');
     if (landmark) {
       const role = landmark.getAttribute('role');
       const ariaLabel = landmark.getAttribute('aria-label');
@@ -185,13 +203,15 @@ export class AccessibilityFocusManager {
   }
 
   // Create focus trap
-  createFocusTrap(container, options= {})= new FocusTrap(container, options);
+  createFocusTrap(container: HTMLElement, options: FocusTrapOptions = {}): FocusTrap {
+    const trap = new FocusTrap(container, options);
     this.focusTraps.set(trap.id, trap);
     return trap;
   }
 
   // Remove focus trap
-  removeFocusTrap(trapId)= this.focusTraps.get(trapId);
+  removeFocusTrap(trapId: string): void {
+    const trap = this.focusTraps.get(trapId);
     if (trap) {
       trap.deactivate();
       this.focusTraps.delete(trapId);
@@ -199,104 +219,119 @@ export class AccessibilityFocusManager {
   }
 
   // Focus first focusable element
-  focusFirst()= this.focusableElements[0];
+  focusFirst(): void {
+    const firstElement = this.focusableElements[0];
     if (firstElement) {
       firstElement.focus();
     }
   }
 
   // Focus last focusable element
-  focusLast()= this.focusableElements[this.focusableElements.length - 1];
+  focusLast(): void {
+    const lastElement = this.focusableElements[this.focusableElements.length - 1];
     if (lastElement) {
       lastElement.focus();
     }
   }
 
   // Focus next element
-  focusNext()= this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 ;
+  focusNext(): void {
+    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
+    const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
     this.focusableElements[nextIndex]?.focus();
   }
 
   // Focus previous element
-  focusPrevious()= this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    const prevIndex = currentIndex > 0 ? currentIndex - 1 ;
+  focusPrevious(): void {
+    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
+    const prevIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
     this.focusableElements[prevIndex]?.focus();
   }
 
   // Focus element by index
-  focusByIndex(index)= 0 && index < this.focusableElements.length) {
+  focusByIndex(index: number): void {
+    if (index >= 0 && index < this.focusableElements.length) {
       this.focusableElements[index].focus();
     }
   }
 
   // Focus element by ID
-  focusById(id)= document.getElementById(id);
+  focusById(id: string): void {
+    const element = document.getElementById(id);
     if (element && this.focusableElements.includes(element)) {
       element.focus();
     }
   }
 
   // Focus element by data attribute
-  focusByDataAttribute(attribute, value)= document.querySelector(`[data-${attribute}="${value}"]`) as HTMLElement;
+  focusByDataAttribute(attribute: string, value: string): void {
+    const element = document.querySelector(`[data-${attribute}="${value}"]`) as HTMLElement;
     if (element && this.focusableElements.includes(element)) {
       element.focus();
     }
   }
 
   // Restore previous focus
-  restoreFocus()== null) {
+  restoreFocus(): void {
+    if (this.lastFocusedElement && this.lastFocusedElement.offsetParent !== null) {
       this.lastFocusedElement.focus();
     }
   }
 
   // Get focus history
-  getFocusHistory()] {
+  getFocusHistory(): HTMLElement[] {
     return [...this.focusHistory];
   }
 
   // Clear focus history
-  clearFocusHistory()= [];
+  clearFocusHistory(): void {
+    this.focusHistory = [];
   }
 
   // Get current focus information
-  getCurrentFocusInfo();
-    index;
-    total;
-    context;
+  getCurrentFocusInfo(): {
+    element: HTMLElement | null;
+    index: number;
+    total: number;
+    context: string | undefined;
   } {
     const currentElement = document.activeElement as HTMLElement;
     const index = this.focusableElements.indexOf(currentElement);
     
     return {
-      element,
-      index= 0 ? index ,
-      total,
-      context) };
+      element: currentElement,
+      index: index >= 0 ? index : -1,
+      total: this.focusableElements.length,
+      context: currentElement ? this.getElementContext(currentElement) : undefined
+    };
   }
 
   // Check if element is focusable
-  isFocusable(element));
+  isFocusable(element: HTMLElement): boolean {
+    return this.focusableElements.includes(element);
   }
 
   // Get all focusable elements
-  getAllFocusableElements()] {
+  getAllFocusableElements(): HTMLElement[] {
     return [...this.focusableElements];
   }
 
   // Get focusable elements within container
-  getFocusableElementsInContainer(container)] {
+  getFocusableElementsInContainer(container: HTMLElement): HTMLElement[] {
     return this.focusableElements.filter(element => 
       container.contains(element)
     );
   }
 
   // Update focusable elements manually
-  refreshFocusableElements());
+  refreshFocusableElements(): void {
+    this.updateFocusableElements();
   }
 
   // Destroy focus manager
-  destroy()=> trap.deactivate());
+  destroy(): void {
+    // Remove all focus traps
+    this.focusTraps.forEach(trap => trap.deactivate());
     this.focusTraps.clear();
     
     // Clear focus history
@@ -311,41 +346,42 @@ export class AccessibilityFocusManager {
 
 // Focus trap options
 export interface FocusTrapOptions {
-  autoFocus?;
-  returnFocus?;
-  escapeDeactivates?;
-  clickOutsideDeactivates?;
-  allowOutsideClick?;
-  fallbackFocus?;
+  autoFocus?: boolean;
+  returnFocus?: boolean;
+  escapeDeactivates?: boolean;
+  clickOutsideDeactivates?: boolean;
+  allowOutsideClick?: boolean;
+  fallbackFocus?: HTMLElement;
 }
 
 // Focus trap class
 export class FocusTrap {
-  public readonly id;
-  public readonly container;
-  public readonly options;
-  public isActive= false;
+  public readonly id: string;
+  public readonly container: HTMLElement;
+  public readonly options: FocusTrapOptions;
+  public isActive: boolean = false;
   
-  private returnFocusElement= null;
-  private focusableElements] = [];
-  private eventListeners; handler) => void }> = [];
+  private returnFocusElement: HTMLElement | null = null;
+  private focusableElements: HTMLElement[] = [];
+  private eventListeners: Array<{ event: string; handler: (event: any) => void }> = [];
 
-  constructor(container, options= {}) {
+  constructor(container: HTMLElement, options: FocusTrapOptions = {}) {
     this.id = `focus-trap-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
     this.container = container;
     this.options = {
-      autoFocus,
-      returnFocus,
-      escapeDeactivates,
-      clickOutsideDeactivates,
-      allowOutsideClick,
-      fallbackFocus,
+      autoFocus: true,
+      returnFocus: true,
+      escapeDeactivates: true,
+      clickOutsideDeactivates: false,
+      allowOutsideClick: false,
+      fallbackFocus: container,
       ...options
     };
   }
 
   // Activate focus trap
-  activate()) return;
+  activate(): void {
+    if (this.isActive) return;
 
     // Store current focus for return
     if (this.options.returnFocus) {
@@ -369,7 +405,8 @@ export class FocusTrap {
   }
 
   // Deactivate focus trap
-  deactivate()) return;
+  deactivate(): void {
+    if (!this.isActive) return;
 
     // Remove event listeners
     this.removeEventListeners();
@@ -383,14 +420,14 @@ export class FocusTrap {
   }
 
   // Get focusable elements within container
-  getFocusableElements()] {
+  getFocusableElements(): HTMLElement[] {
     const focusableSelectors = [
       'a[href]',
-      'button])',
-      'input])',
-      'select])',
-      'textarea])',
-      '[tabindex]="-1"])',
+      'button:not([disabled])',
+      'input:not([disabled])',
+      'select:not([disabled])',
+      'textarea:not([disabled])',
+      '[tabindex]:not([tabindex="-1"])',
       '[contenteditable="true"]'
     ];
 
@@ -400,31 +437,33 @@ export class FocusTrap {
   }
 
   // Setup event listeners
-  private setupEventListeners()) {
-      const escapeHandler = (event) => {
+  private setupEventListeners(): void {
+    // Handle escape key
+    if (this.options.escapeDeactivates) {
+      const escapeHandler = (event: KeyboardEvent) => {
         if (event.key === 'Escape') {
           this.deactivate();
         }
       };
       
       document.addEventListener('keydown', escapeHandler);
-      this.eventListeners.push({ event, handler});
+      this.eventListeners.push({ event: 'keydown', handler: escapeHandler });
     }
 
     // Handle click outside
     if (this.options.clickOutsideDeactivates) {
-      const clickHandler = (event) => {
+      const clickHandler = (event: MouseEvent) => {
         if (!this.container.contains(event.target as Node)) {
           this.deactivate();
         }
       };
       
       document.addEventListener('click', clickHandler);
-      this.eventListeners.push({ event, handler});
+      this.eventListeners.push({ event: 'click', handler: clickHandler });
     }
 
     // Handle tab key within trap
-    const tabHandler = (event) => {
+    const tabHandler = (event: KeyboardEvent) => {
       if (event.key === 'Tab') {
         event.preventDefault();
         this.handleTabNavigation(event.shiftKey);
@@ -432,11 +471,12 @@ export class FocusTrap {
     };
     
     this.container.addEventListener('keydown', tabHandler);
-    this.eventListeners.push({ event, handler});
+    this.eventListeners.push({ event: 'keydown', handler: tabHandler });
   }
 
   // Remove event listeners
-  private removeEventListeners(), handler }) => {
+  private removeEventListeners(): void {
+    this.eventListeners.forEach(({ event, handler }) => {
       if (event === 'keydown' && handler.toString().includes('tabHandler')) {
         this.container.removeEventListener(event, handler);
       } else {
@@ -448,73 +488,81 @@ export class FocusTrap {
   }
 
   // Handle tab navigation within trap
-  private handleTabNavigation(isShiftTab)=== 0) return;
+  private handleTabNavigation(isShiftTab: boolean): void {
+    if (this.focusableElements.length === 0) return;
 
     const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    let nextIndex;
+    let nextIndex: number;
 
     if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 ;
+      nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
     } else {
-      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 ;
+      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
     }
 
     this.focusableElements[nextIndex]?.focus();
   }
 
   // Focus first element in trap
-  focusFirst()) {
+  focusFirst(): void {
+    if (this.focusableElements.length > 0) {
       this.focusableElements[0].focus();
     }
   }
 
   // Focus last element in trap
-  focusLast()) {
+  focusLast(): void {
+    if (this.focusableElements.length > 0) {
       this.focusableElements[this.focusableElements.length - 1].focus();
     }
   }
 
   // Focus next element in trap
-  focusNext()=== 0) return;
+  focusNext(): void {
+    if (this.focusableElements.length === 0) return;
 
     const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 ;
+    const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
     this.focusableElements[nextIndex]?.focus();
   }
 
   // Focus previous element in trap
-  focusPrevious()=== 0) return;
+  focusPrevious(): void {
+    if (this.focusableElements.length === 0) return;
 
     const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    const prevIndex = currentIndex > 0 ? currentIndex - 1 ;
+    const prevIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
     this.focusableElements[prevIndex]?.focus();
   }
 
   // Get trap information
-  getInfo();
-    isActive;
-    focusableElementsCount;
-    currentFocusIndex;
-    container;
+  getInfo(): {
+    id: string;
+    isActive: boolean;
+    focusableElementsCount: number;
+    currentFocusIndex: number;
+    container: HTMLElement;
   } {
     const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
     
     return {
-      id,
-      isActive,
-      focusableElementsCount,
-      currentFocusIndex= 0 ? currentIndex ,
-      container};
+      id: this.id,
+      isActive: this.isActive,
+      focusableElementsCount: this.focusableElements.length,
+      currentFocusIndex: currentIndex >= 0 ? currentIndex : -1,
+      container: this.container
+    };
   }
 }
 
 // Focus restoration utilities
 export class FocusRestoration {
-  private focusStack] = [];
-  private maxStackSize= 20;
+  private focusStack: HTMLElement[] = [];
+  private maxStackSize: number = 20;
 
   // Push current focus to stack
-  pushFocus()= document.activeElement as HTMLElement;
+  pushFocus(): void {
+    const currentElement = document.activeElement as HTMLElement;
     if (currentElement && currentElement !== document.body) {
       this.focusStack.push(currentElement);
       
@@ -526,7 +574,8 @@ export class FocusRestoration {
   }
 
   // Pop and restore focus from stack
-  popFocus()= this.focusStack.pop();
+  popFocus(): boolean {
+    const element = this.focusStack.pop();
     if (element && element.offsetParent !== null) {
       element.focus();
       return true;
@@ -535,28 +584,33 @@ export class FocusRestoration {
   }
 
   // Peek at top of focus stack
-  peekFocus()];
+  peekFocus(): HTMLElement | undefined {
+    return this.focusStack[this.focusStack.length - 1];
   }
 
   // Clear focus stack
-  clear()= [];
+  clear(): void {
+    this.focusStack = [];
   }
 
   // Get stack size
-  getSize();
+  getSize(): number {
+    return this.focusStack.length;
   }
 
   // Check if stack is empty
-  isEmpty()=== 0;
+  isEmpty(): boolean {
+    return this.focusStack.length === 0;
   }
 }
 
 // Focus navigation utilities
 export class FocusNavigation {
   // Navigate to next heading
-  static focusNextHeading()= Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
+  static focusNextHeading(): void {
+    const headings = Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
     const currentIndex = headings.indexOf(document.activeElement as HTMLElement);
-    const nextIndex = currentIndex < headings.length - 1 ? currentIndex + 1 ;
+    const nextIndex = currentIndex < headings.length - 1 ? currentIndex + 1 : 0;
     
     if (headings[nextIndex]) {
       (headings[nextIndex] as HTMLElement).focus();
@@ -564,9 +618,10 @@ export class FocusNavigation {
   }
 
   // Navigate to previous heading
-  static focusPreviousHeading()= Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
+  static focusPreviousHeading(): void {
+    const headings = Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
     const currentIndex = headings.indexOf(document.activeElement as HTMLElement);
-    const prevIndex = currentIndex > 0 ? currentIndex - 1 ;
+    const prevIndex = currentIndex > 0 ? currentIndex - 1 : headings.length - 1;
     
     if (headings[prevIndex]) {
       (headings[prevIndex] as HTMLElement).focus();
@@ -574,9 +629,10 @@ export class FocusNavigation {
   }
 
   // Navigate to next landmark
-  static focusNextLandmark()= Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
+  static focusNextLandmark(): void {
+    const landmarks = Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
     const currentIndex = landmarks.indexOf(document.activeElement as HTMLElement);
-    const nextIndex = currentIndex < landmarks.length - 1 ? currentIndex + 1 ;
+    const nextIndex = currentIndex < landmarks.length - 1 ? currentIndex + 1 : 0;
     
     if (landmarks[nextIndex]) {
       (landmarks[nextIndex] as HTMLElement).focus();
@@ -584,9 +640,10 @@ export class FocusNavigation {
   }
 
   // Navigate to previous landmark
-  static focusPreviousLandmark()= Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
+  static focusPreviousLandmark(): void {
+    const landmarks = Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
     const currentIndex = landmarks.indexOf(document.activeElement as HTMLElement);
-    const prevIndex = currentIndex > 0 ? currentIndex - 1 ;
+    const prevIndex = currentIndex > 0 ? currentIndex - 1 : landmarks.length - 1;
     
     if (landmarks[prevIndex]) {
       (landmarks[prevIndex] as HTMLElement).focus();
@@ -594,13 +651,14 @@ export class FocusNavigation {
   }
 
   // Focus first focusable element in container
-  static focusFirstInContainer(container)= [
+  static focusFirstInContainer(container: HTMLElement): void {
+    const focusableSelectors = [
       'a[href]',
-      'button])',
-      'input])',
-      'select])',
-      'textarea])',
-      '[tabindex]="-1"])'
+      'button:not([disabled])',
+      'input:not([disabled])',
+      'select:not([disabled])',
+      'textarea:not([disabled])',
+      '[tabindex]:not([tabindex="-1"])'
     ];
 
     const firstElement = container.querySelector(focusableSelectors.join(','));
@@ -610,13 +668,14 @@ export class FocusNavigation {
   }
 
   // Focus last focusable element in container
-  static focusLastInContainer(container)= [
+  static focusLastInContainer(container: HTMLElement): void {
+    const focusableSelectors = [
       'a[href]',
-      'button])',
-      'input])',
-      'select])',
-      'textarea])',
-      '[tabindex]="-1"])'
+      'button:not([disabled])',
+      'input:not([disabled])',
+      'select:not([disabled])',
+      'textarea:not([disabled])',
+      '[tabindex]:not([tabindex="-1"])'
     ];
 
     const elements = Array.from(container.querySelectorAll(focusableSelectors.join(',')));