@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.11 → 0.2.16

package/dist/themes/focus-management.js

@@ -1,701 +1,565 @@
 import { screenReaderOptimizer } from './screen-reader';
-
 // Focus management utilities
 export class AccessibilityFocusManager {
-  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:not([disabled])',
-      'input:not([disabled])',
-      'select:not([disabled])',
-      'textarea:not([disabled])',
-      '[tabindex]:not([tabindex="-1"])',
-      '[contenteditable="true"]',
-      'audio[controls]',
-      'video[controls]',
-      'iframe'
-    ];
-    
-    this.focusableElements = [];
-    this.lastFocusedElement = null;
-    this.focusTraps = new Map();
-    this.focusHistory = [];
-    this.maxHistorySize = 10;
-    
-    this.initialize();
-  }
-
-  // Initialize focus management
-  private initialize(): void {
-    this.updateFocusableElements();
-    this.setupEventListeners();
-  }
-
-  // Update list of focusable elements
-  private updateFocusableElements(): void {
-    this.focusableElements = Array.from(
-      document.querySelectorAll(this.focusableSelectors.join(','))
-    ) as HTMLElement[];
-  }
-
-  // Setup event listeners
-  private setupEventListeners(): void {
-    // Track focus changes
-    document.addEventListener('focusin', this.handleFocusIn.bind(this));
-    document.addEventListener('focusout', this.handleFocusOut.bind(this));
-    
-    // Handle tab key navigation
-    document.addEventListener('keydown', this.handleKeyDown.bind(this));
-    
-    // Update focusable elements when DOM changes
-    const observer = new MutationObserver(() => {
-      this.updateFocusableElements();
-    });
-    
-    observer.observe(document.body, {
-      childList: true,
-      subtree: true
-    });
-  }
-
-  // Handle focus in events
-  private handleFocusIn(event: FocusEvent): void {
-    const target = event.target as HTMLElement;
-    
-    if (target && target !== this.lastFocusedElement) {
-      // Add to focus history
-      this.addToFocusHistory(target);
-      
-      // Update last focused element
-      this.lastFocusedElement = target;
-      
-      // Announce focus change for screen readers
-      if (screenReaderOptimizer) {
-        screenReaderOptimizer.announceFocusChange(
-          this.getElementDescription(target),
-          this.getElementContext(target)
-        );
-      }
-    }
-  }
-
-  // Handle focus out events
-  private handleFocusOut(_event: FocusEvent): void {
-    // Focus out handling if needed
-  }
-
-  // Handle key down events
-  private handleKeyDown(event: KeyboardEvent): void {
-    if (event.key === 'Tab') {
-      this.handleTabNavigation(event);
-    }
-  }
-
-  // Handle tab navigation
-  private handleTabNavigation(event: KeyboardEvent): void {
-    const isShiftTab = event.shiftKey;
-    const currentElement = event.target as HTMLElement;
-    
-    // Check if we're in a focus trap
-    const activeTrap = this.getActiveFocusTrap(currentElement);
-    if (activeTrap) {
-      event.preventDefault();
-      this.navigateInFocusTrap(activeTrap, isShiftTab);
-      return;
-    }
-    
-    // Normal tab navigation
-    this.navigateFocusableElements(isShiftTab);
-  }
-
-  // Get active focus trap for element
-  private getActiveFocusTrap(element: HTMLElement): FocusTrap | null {
-    for (const trap of this.focusTraps.values()) {
-      if (trap.isActive && trap.container.contains(element)) {
+    constructor() {
+        this.focusableSelectors = [
+            'a[href]',
+            'button:not([disabled])',
+            'input:not([disabled])',
+            'select:not([disabled])',
+            'textarea:not([disabled])',
+            '[tabindex]:not([tabindex="-1"])',
+            '[contenteditable="true"]',
+            'audio[controls]',
+            'video[controls]',
+            'iframe'
+        ];
+        this.focusableElements = [];
+        this.lastFocusedElement = null;
+        this.focusTraps = new Map();
+        this.focusHistory = [];
+        this.maxHistorySize = 10;
+        this.initialize();
+    }
+    // Initialize focus management
+    initialize() {
+        this.updateFocusableElements();
+        this.setupEventListeners();
+    }
+    // Update list of focusable elements
+    updateFocusableElements() {
+        this.focusableElements = Array.from(document.querySelectorAll(this.focusableSelectors.join(',')));
+    }
+    // Setup event listeners
+    setupEventListeners() {
+        // Track focus changes
+        document.addEventListener('focusin', this.handleFocusIn.bind(this));
+        document.addEventListener('focusout', this.handleFocusOut.bind(this));
+        // Handle tab key navigation
+        document.addEventListener('keydown', this.handleKeyDown.bind(this));
+        // Update focusable elements when DOM changes
+        const observer = new MutationObserver(() => {
+            this.updateFocusableElements();
+        });
+        observer.observe(document.body, {
+            childList: true,
+            subtree: true
+        });
+    }
+    // Handle focus in events
+    handleFocusIn(event) {
+        const target = event.target;
+        if (target && target !== this.lastFocusedElement) {
+            // Add to focus history
+            this.addToFocusHistory(target);
+            // Update last focused element
+            this.lastFocusedElement = target;
+            // Announce focus change for screen readers
+            if (screenReaderOptimizer) {
+                screenReaderOptimizer.announceFocusChange(this.getElementDescription(target), this.getElementContext(target));
+            }
+        }
+    }
+    // Handle focus out events
+    handleFocusOut(_event) {
+        // Focus out handling if needed
+    }
+    // Handle key down events
+    handleKeyDown(event) {
+        if (event.key === 'Tab') {
+            this.handleTabNavigation(event);
+        }
+    }
+    // Handle tab navigation
+    handleTabNavigation(event) {
+        const isShiftTab = event.shiftKey;
+        const currentElement = event.target;
+        // Check if we're in a focus trap
+        const activeTrap = this.getActiveFocusTrap(currentElement);
+        if (activeTrap) {
+            event.preventDefault();
+            this.navigateInFocusTrap(activeTrap, isShiftTab);
+            return;
+        }
+        // Normal tab navigation
+        this.navigateFocusableElements(isShiftTab);
+    }
+    // Get active focus trap for element
+    getActiveFocusTrap(element) {
+        for (const trap of this.focusTraps.values()) {
+            if (trap.isActive && trap.container.contains(element)) {
+                return trap;
+            }
+        }
+        return null;
+    }
+    // Navigate within a focus trap
+    navigateInFocusTrap(trap, isShiftTab) {
+        const focusableElements = trap.getFocusableElements();
+        if (focusableElements.length === 0)
+            return;
+        const currentIndex = focusableElements.indexOf(document.activeElement);
+        let nextIndex;
+        if (isShiftTab) {
+            nextIndex = currentIndex > 0 ? currentIndex - 1 : focusableElements.length - 1;
+        }
+        else {
+            nextIndex = currentIndex < focusableElements.length - 1 ? currentIndex + 1 : 0;
+        }
+        focusableElements[nextIndex]?.focus();
+    }
+    // Navigate focusable elements
+    navigateFocusableElements(isShiftTab) {
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        let nextIndex;
+        if (isShiftTab) {
+            nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
+        }
+        else {
+            nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
+        }
+        this.focusableElements[nextIndex]?.focus();
+    }
+    // Add element to focus history
+    addToFocusHistory(element) {
+        // Remove if already exists
+        this.focusHistory = this.focusHistory.filter(el => el !== element);
+        // Add to beginning
+        this.focusHistory.unshift(element);
+        // Maintain history size
+        if (this.focusHistory.length > this.maxHistorySize) {
+            this.focusHistory.pop();
+        }
+    }
+    // Get element description for screen readers
+    getElementDescription(element) {
+        const ariaLabel = element.getAttribute('aria-label');
+        if (ariaLabel)
+            return ariaLabel;
+        const ariaLabelledBy = element.getAttribute('aria-labelledby');
+        if (ariaLabelledBy) {
+            const labelElement = document.getElementById(ariaLabelledBy);
+            if (labelElement)
+                return labelElement.textContent || '';
+        }
+        const placeholder = element.getAttribute('placeholder');
+        if (placeholder)
+            return placeholder;
+        const title = element.getAttribute('title');
+        if (title)
+            return title;
+        return element.textContent || element.tagName.toLowerCase();
+    }
+    // Get element context for screen readers
+    getElementContext(element) {
+        // 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');
+            return ariaLabel || role || landmark.tagName.toLowerCase();
+        }
+        return undefined;
+    }
+    // Create focus trap
+    createFocusTrap(container, options = {}) {
+        const trap = new FocusTrap(container, options);
+        this.focusTraps.set(trap.id, trap);
         return trap;
-      }
-    }
-    return null;
-  }
-
-  // Navigate within a focus trap
-  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: number;
-
-    if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 : focusableElements.length - 1;
-    } else {
-      nextIndex = currentIndex < focusableElements.length - 1 ? currentIndex + 1 : 0;
-    }
-
-    focusableElements[nextIndex]?.focus();
-  }
-
-  // Navigate focusable elements
-  private navigateFocusableElements(isShiftTab: boolean): void {
-    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    let nextIndex: number;
-
-    if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
-    } else {
-      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
-    }
-
-    this.focusableElements[nextIndex]?.focus();
-  }
-
-  // Add element to focus history
-  private addToFocusHistory(element: HTMLElement): void {
-    // Remove if already exists
-    this.focusHistory = this.focusHistory.filter(el => el !== element);
-    
-    // Add to beginning
-    this.focusHistory.unshift(element);
-    
-    // Maintain history size
-    if (this.focusHistory.length > this.maxHistorySize) {
-      this.focusHistory.pop();
-    }
-  }
-
-  // Get element description for screen readers
-  private getElementDescription(element: HTMLElement): string {
-    const ariaLabel = element.getAttribute('aria-label');
-    if (ariaLabel) return ariaLabel;
-
-    const ariaLabelledBy = element.getAttribute('aria-labelledby');
-    if (ariaLabelledBy) {
-      const labelElement = document.getElementById(ariaLabelledBy);
-      if (labelElement) return labelElement.textContent || '';
-    }
-
-    const placeholder = element.getAttribute('placeholder');
-    if (placeholder) return placeholder;
-
-    const title = element.getAttribute('title');
-    if (title) return title;
-
-    return element.textContent || element.tagName.toLowerCase();
-  }
-
-  // Get element context for screen readers
-  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');
-      return ariaLabel || role || landmark.tagName.toLowerCase();
-    }
-    return undefined;
-  }
-
-  // Create focus trap
-  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: string): void {
-    const trap = this.focusTraps.get(trapId);
-    if (trap) {
-      trap.deactivate();
-      this.focusTraps.delete(trapId);
-    }
-  }
-
-  // Focus first focusable element
-  focusFirst(): void {
-    const firstElement = this.focusableElements[0];
-    if (firstElement) {
-      firstElement.focus();
-    }
-  }
-
-  // Focus last focusable element
-  focusLast(): void {
-    const lastElement = this.focusableElements[this.focusableElements.length - 1];
-    if (lastElement) {
-      lastElement.focus();
-    }
-  }
-
-  // Focus next element
-  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(): 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: number): void {
-    if (index >= 0 && index < this.focusableElements.length) {
-      this.focusableElements[index].focus();
-    }
-  }
-
-  // Focus element by 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: 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(): void {
-    if (this.lastFocusedElement && this.lastFocusedElement.offsetParent !== null) {
-      this.lastFocusedElement.focus();
-    }
-  }
-
-  // Get focus history
-  getFocusHistory(): HTMLElement[] {
-    return [...this.focusHistory];
-  }
-
-  // Clear focus history
-  clearFocusHistory(): void {
-    this.focusHistory = [];
-  }
-
-  // Get current focus information
-  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: currentElement,
-      index: index >= 0 ? index : -1,
-      total: this.focusableElements.length,
-      context: currentElement ? this.getElementContext(currentElement) : undefined
-    };
-  }
-
-  // Check if element is focusable
-  isFocusable(element: HTMLElement): boolean {
-    return this.focusableElements.includes(element);
-  }
-
-  // Get all focusable elements
-  getAllFocusableElements(): HTMLElement[] {
-    return [...this.focusableElements];
-  }
-
-  // Get focusable elements within container
-  getFocusableElementsInContainer(container: HTMLElement): HTMLElement[] {
-    return this.focusableElements.filter(element => 
-      container.contains(element)
-    );
-  }
-
-  // Update focusable elements manually
-  refreshFocusableElements(): void {
-    this.updateFocusableElements();
-  }
-
-  // Destroy focus manager
-  destroy(): void {
-    // Remove all focus traps
-    this.focusTraps.forEach(trap => trap.deactivate());
-    this.focusTraps.clear();
-    
+    }
+    // Remove focus trap
+    removeFocusTrap(trapId) {
+        const trap = this.focusTraps.get(trapId);
+        if (trap) {
+            trap.deactivate();
+            this.focusTraps.delete(trapId);
+        }
+    }
+    // Focus first focusable element
+    focusFirst() {
+        const firstElement = this.focusableElements[0];
+        if (firstElement) {
+            firstElement.focus();
+        }
+    }
+    // Focus last focusable element
+    focusLast() {
+        const lastElement = this.focusableElements[this.focusableElements.length - 1];
+        if (lastElement) {
+            lastElement.focus();
+        }
+    }
+    // Focus next element
+    focusNext() {
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
+        this.focusableElements[nextIndex]?.focus();
+    }
+    // Focus previous element
+    focusPrevious() {
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        const prevIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
+        this.focusableElements[prevIndex]?.focus();
+    }
+    // Focus element by index
+    focusByIndex(index) {
+        if (index >= 0 && index < this.focusableElements.length) {
+            this.focusableElements[index].focus();
+        }
+    }
+    // Focus element by ID
+    focusById(id) {
+        const element = document.getElementById(id);
+        if (element && this.focusableElements.includes(element)) {
+            element.focus();
+        }
+    }
+    // Focus element by data attribute
+    focusByDataAttribute(attribute, value) {
+        const element = document.querySelector(`[data-${attribute}="${value}"]`);
+        if (element && this.focusableElements.includes(element)) {
+            element.focus();
+        }
+    }
+    // Restore previous focus
+    restoreFocus() {
+        if (this.lastFocusedElement && this.lastFocusedElement.offsetParent !== null) {
+            this.lastFocusedElement.focus();
+        }
+    }
+    // Get focus history
+    getFocusHistory() {
+        return [...this.focusHistory];
+    }
     // Clear focus history
-    this.focusHistory = [];
-    
-    // Remove event listeners
-    document.removeEventListener('focusin', this.handleFocusIn.bind(this));
-    document.removeEventListener('focusout', this.handleFocusOut.bind(this));
-    document.removeEventListener('keydown', this.handleKeyDown.bind(this));
-  }
-}
-
-// Focus trap options
-export interface FocusTrapOptions {
-  autoFocus?: boolean;
-  returnFocus?: boolean;
-  escapeDeactivates?: boolean;
-  clickOutsideDeactivates?: boolean;
-  allowOutsideClick?: boolean;
-  fallbackFocus?: HTMLElement;
+    clearFocusHistory() {
+        this.focusHistory = [];
+    }
+    // Get current focus information
+    getCurrentFocusInfo() {
+        const currentElement = document.activeElement;
+        const index = this.focusableElements.indexOf(currentElement);
+        return {
+            element: currentElement,
+            index: index >= 0 ? index : -1,
+            total: this.focusableElements.length,
+            context: currentElement ? this.getElementContext(currentElement) : undefined
+        };
+    }
+    // Check if element is focusable
+    isFocusable(element) {
+        return this.focusableElements.includes(element);
+    }
+    // Get all focusable elements
+    getAllFocusableElements() {
+        return [...this.focusableElements];
+    }
+    // Get focusable elements within container
+    getFocusableElementsInContainer(container) {
+        return this.focusableElements.filter(element => container.contains(element));
+    }
+    // Update focusable elements manually
+    refreshFocusableElements() {
+        this.updateFocusableElements();
+    }
+    // Destroy focus manager
+    destroy() {
+        // Remove all focus traps
+        this.focusTraps.forEach(trap => trap.deactivate());
+        this.focusTraps.clear();
+        // Clear focus history
+        this.focusHistory = [];
+        // Remove event listeners
+        document.removeEventListener('focusin', this.handleFocusIn.bind(this));
+        document.removeEventListener('focusout', this.handleFocusOut.bind(this));
+        document.removeEventListener('keydown', this.handleKeyDown.bind(this));
+    }
 }
-
 // Focus trap class
 export class FocusTrap {
-  public readonly id: string;
-  public readonly container: HTMLElement;
-  public readonly options: FocusTrapOptions;
-  public isActive: boolean = false;
-  
-  private returnFocusElement: HTMLElement | null = null;
-  private focusableElements: HTMLElement[] = [];
-  private eventListeners: Array<{ event: string; handler: (event: any) => void }> = [];
-
-  constructor(container: HTMLElement, options: FocusTrapOptions = {}) {
-    this.id = `focus-trap-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-    this.container = container;
-    this.options = {
-      autoFocus: true,
-      returnFocus: true,
-      escapeDeactivates: true,
-      clickOutsideDeactivates: false,
-      allowOutsideClick: false,
-      fallbackFocus: container,
-      ...options
-    };
-  }
-
-  // Activate focus trap
-  activate(): void {
-    if (this.isActive) return;
-
-    // Store current focus for return
-    if (this.options.returnFocus) {
-      this.returnFocusElement = document.activeElement as HTMLElement;
-    }
-
+    constructor(container, options = {}) {
+        this.isActive = false;
+        this.returnFocusElement = null;
+        this.focusableElements = [];
+        this.eventListeners = [];
+        this.id = `focus-trap-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+        this.container = container;
+        this.options = {
+            autoFocus: true,
+            returnFocus: true,
+            escapeDeactivates: true,
+            clickOutsideDeactivates: false,
+            allowOutsideClick: false,
+            fallbackFocus: container,
+            ...options
+        };
+    }
+    // Activate focus trap
+    activate() {
+        if (this.isActive)
+            return;
+        // Store current focus for return
+        if (this.options.returnFocus) {
+            this.returnFocusElement = document.activeElement;
+        }
+        // Get focusable elements within container
+        this.focusableElements = this.getFocusableElements();
+        // Auto-focus first element or fallback
+        if (this.options.autoFocus && this.focusableElements.length > 0) {
+            this.focusableElements[0].focus();
+        }
+        else if (this.options.fallbackFocus) {
+            this.options.fallbackFocus.focus();
+        }
+        // Setup event listeners
+        this.setupEventListeners();
+        this.isActive = true;
+    }
+    // Deactivate focus trap
+    deactivate() {
+        if (!this.isActive)
+            return;
+        // Remove event listeners
+        this.removeEventListeners();
+        // Return focus if requested
+        if (this.options.returnFocus && this.returnFocusElement) {
+            this.returnFocusElement.focus();
+        }
+        this.isActive = false;
+    }
     // Get focusable elements within container
-    this.focusableElements = this.getFocusableElements();
-
-    // Auto-focus first element or fallback
-    if (this.options.autoFocus && this.focusableElements.length > 0) {
-      this.focusableElements[0].focus();
-    } else if (this.options.fallbackFocus) {
-      this.options.fallbackFocus.focus();
-    }
-
+    getFocusableElements() {
+        const focusableSelectors = [
+            'a[href]',
+            'button:not([disabled])',
+            'input:not([disabled])',
+            'select:not([disabled])',
+            'textarea:not([disabled])',
+            '[tabindex]:not([tabindex="-1"])',
+            '[contenteditable="true"]'
+        ];
+        return Array.from(this.container.querySelectorAll(focusableSelectors.join(',')));
+    }
     // Setup event listeners
-    this.setupEventListeners();
-
-    this.isActive = true;
-  }
-
-  // Deactivate focus trap
-  deactivate(): void {
-    if (!this.isActive) return;
-
+    setupEventListeners() {
+        // Handle escape key
+        if (this.options.escapeDeactivates) {
+            const escapeHandler = (event) => {
+                if (event.key === 'Escape') {
+                    this.deactivate();
+                }
+            };
+            document.addEventListener('keydown', escapeHandler);
+            this.eventListeners.push({ event: 'keydown', handler: escapeHandler });
+        }
+        // Handle click outside
+        if (this.options.clickOutsideDeactivates) {
+            const clickHandler = (event) => {
+                if (!this.container.contains(event.target)) {
+                    this.deactivate();
+                }
+            };
+            document.addEventListener('click', clickHandler);
+            this.eventListeners.push({ event: 'click', handler: clickHandler });
+        }
+        // Handle tab key within trap
+        const tabHandler = (event) => {
+            if (event.key === 'Tab') {
+                event.preventDefault();
+                this.handleTabNavigation(event.shiftKey);
+            }
+        };
+        this.container.addEventListener('keydown', tabHandler);
+        this.eventListeners.push({ event: 'keydown', handler: tabHandler });
+    }
     // Remove event listeners
-    this.removeEventListeners();
-
-    // Return focus if requested
-    if (this.options.returnFocus && this.returnFocusElement) {
-      this.returnFocusElement.focus();
-    }
-
-    this.isActive = false;
-  }
-
-  // Get focusable elements within container
-  getFocusableElements(): HTMLElement[] {
-    const focusableSelectors = [
-      'a[href]',
-      'button:not([disabled])',
-      'input:not([disabled])',
-      'select:not([disabled])',
-      'textarea:not([disabled])',
-      '[tabindex]:not([tabindex="-1"])',
-      '[contenteditable="true"]'
-    ];
-
-    return Array.from(
-      this.container.querySelectorAll(focusableSelectors.join(','))
-    ) as HTMLElement[];
-  }
-
-  // Setup event listeners
-  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: 'keydown', handler: escapeHandler });
-    }
-
-    // Handle click outside
-    if (this.options.clickOutsideDeactivates) {
-      const clickHandler = (event: MouseEvent) => {
-        if (!this.container.contains(event.target as Node)) {
-          this.deactivate();
-        }
-      };
-      
-      document.addEventListener('click', clickHandler);
-      this.eventListeners.push({ event: 'click', handler: clickHandler });
-    }
-
-    // Handle tab key within trap
-    const tabHandler = (event: KeyboardEvent) => {
-      if (event.key === 'Tab') {
-        event.preventDefault();
-        this.handleTabNavigation(event.shiftKey);
-      }
-    };
-    
-    this.container.addEventListener('keydown', tabHandler);
-    this.eventListeners.push({ event: 'keydown', handler: tabHandler });
-  }
-
-  // Remove event listeners
-  private removeEventListeners(): void {
-    this.eventListeners.forEach(({ event, handler }) => {
-      if (event === 'keydown' && handler.toString().includes('tabHandler')) {
-        this.container.removeEventListener(event, handler);
-      } else {
-        document.removeEventListener(event, handler);
-      }
-    });
-    
-    this.eventListeners = [];
-  }
-
-  // Handle tab navigation within trap
-  private handleTabNavigation(isShiftTab: boolean): void {
-    if (this.focusableElements.length === 0) return;
-
-    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    let nextIndex: number;
-
-    if (isShiftTab) {
-      nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
-    } else {
-      nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
-    }
-
-    this.focusableElements[nextIndex]?.focus();
-  }
-
-  // Focus first element in trap
-  focusFirst(): void {
-    if (this.focusableElements.length > 0) {
-      this.focusableElements[0].focus();
-    }
-  }
-
-  // Focus last element in trap
-  focusLast(): void {
-    if (this.focusableElements.length > 0) {
-      this.focusableElements[this.focusableElements.length - 1].focus();
-    }
-  }
-
-  // Focus next element in trap
-  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 : 0;
-    this.focusableElements[nextIndex]?.focus();
-  }
-
-  // Focus previous element in trap
-  focusPrevious(): void {
-    if (this.focusableElements.length === 0) return;
-
-    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    const prevIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
-    this.focusableElements[prevIndex]?.focus();
-  }
-
-  // Get trap information
-  getInfo(): {
-    id: string;
-    isActive: boolean;
-    focusableElementsCount: number;
-    currentFocusIndex: number;
-    container: HTMLElement;
-  } {
-    const currentIndex = this.focusableElements.indexOf(document.activeElement as HTMLElement);
-    
-    return {
-      id: this.id,
-      isActive: this.isActive,
-      focusableElementsCount: this.focusableElements.length,
-      currentFocusIndex: currentIndex >= 0 ? currentIndex : -1,
-      container: this.container
-    };
-  }
+    removeEventListeners() {
+        this.eventListeners.forEach(({ event, handler }) => {
+            if (event === 'keydown' && handler.toString().includes('tabHandler')) {
+                this.container.removeEventListener(event, handler);
+            }
+            else {
+                document.removeEventListener(event, handler);
+            }
+        });
+        this.eventListeners = [];
+    }
+    // Handle tab navigation within trap
+    handleTabNavigation(isShiftTab) {
+        if (this.focusableElements.length === 0)
+            return;
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        let nextIndex;
+        if (isShiftTab) {
+            nextIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
+        }
+        else {
+            nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
+        }
+        this.focusableElements[nextIndex]?.focus();
+    }
+    // Focus first element in trap
+    focusFirst() {
+        if (this.focusableElements.length > 0) {
+            this.focusableElements[0].focus();
+        }
+    }
+    // Focus last element in trap
+    focusLast() {
+        if (this.focusableElements.length > 0) {
+            this.focusableElements[this.focusableElements.length - 1].focus();
+        }
+    }
+    // Focus next element in trap
+    focusNext() {
+        if (this.focusableElements.length === 0)
+            return;
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        const nextIndex = currentIndex < this.focusableElements.length - 1 ? currentIndex + 1 : 0;
+        this.focusableElements[nextIndex]?.focus();
+    }
+    // Focus previous element in trap
+    focusPrevious() {
+        if (this.focusableElements.length === 0)
+            return;
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        const prevIndex = currentIndex > 0 ? currentIndex - 1 : this.focusableElements.length - 1;
+        this.focusableElements[prevIndex]?.focus();
+    }
+    // Get trap information
+    getInfo() {
+        const currentIndex = this.focusableElements.indexOf(document.activeElement);
+        return {
+            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: HTMLElement[] = [];
-  private maxStackSize: number = 20;
-
-  // Push current focus to stack
-  pushFocus(): void {
-    const currentElement = document.activeElement as HTMLElement;
-    if (currentElement && currentElement !== document.body) {
-      this.focusStack.push(currentElement);
-      
-      // Maintain stack size
-      if (this.focusStack.length > this.maxStackSize) {
-        this.focusStack.shift();
-      }
-    }
-  }
-
-  // Pop and restore focus from stack
-  popFocus(): boolean {
-    const element = this.focusStack.pop();
-    if (element && element.offsetParent !== null) {
-      element.focus();
-      return true;
-    }
-    return false;
-  }
-
-  // Peek at top of focus stack
-  peekFocus(): HTMLElement | undefined {
-    return this.focusStack[this.focusStack.length - 1];
-  }
-
-  // Clear focus stack
-  clear(): void {
-    this.focusStack = [];
-  }
-
-  // Get stack size
-  getSize(): number {
-    return this.focusStack.length;
-  }
-
-  // Check if stack is empty
-  isEmpty(): boolean {
-    return this.focusStack.length === 0;
-  }
+    constructor() {
+        this.focusStack = [];
+        this.maxStackSize = 20;
+    }
+    // Push current focus to stack
+    pushFocus() {
+        const currentElement = document.activeElement;
+        if (currentElement && currentElement !== document.body) {
+            this.focusStack.push(currentElement);
+            // Maintain stack size
+            if (this.focusStack.length > this.maxStackSize) {
+                this.focusStack.shift();
+            }
+        }
+    }
+    // Pop and restore focus from stack
+    popFocus() {
+        const element = this.focusStack.pop();
+        if (element && element.offsetParent !== null) {
+            element.focus();
+            return true;
+        }
+        return false;
+    }
+    // Peek at top of focus stack
+    peekFocus() {
+        return this.focusStack[this.focusStack.length - 1];
+    }
+    // Clear focus stack
+    clear() {
+        this.focusStack = [];
+    }
+    // Get stack size
+    getSize() {
+        return this.focusStack.length;
+    }
+    // Check if stack is empty
+    isEmpty() {
+        return this.focusStack.length === 0;
+    }
 }
-
 // Focus navigation utilities
 export class FocusNavigation {
-  // Navigate to next heading
-  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 : 0;
-    
-    if (headings[nextIndex]) {
-      (headings[nextIndex] as HTMLElement).focus();
-    }
-  }
-
-  // Navigate to previous heading
-  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 : headings.length - 1;
-    
-    if (headings[prevIndex]) {
-      (headings[prevIndex] as HTMLElement).focus();
-    }
-  }
-
-  // Navigate to next landmark
-  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 : 0;
-    
-    if (landmarks[nextIndex]) {
-      (landmarks[nextIndex] as HTMLElement).focus();
-    }
-  }
-
-  // Navigate to previous landmark
-  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 : landmarks.length - 1;
-    
-    if (landmarks[prevIndex]) {
-      (landmarks[prevIndex] as HTMLElement).focus();
-    }
-  }
-
-  // Focus first focusable element in container
-  static focusFirstInContainer(container: HTMLElement): void {
-    const focusableSelectors = [
-      'a[href]',
-      'button:not([disabled])',
-      'input:not([disabled])',
-      'select:not([disabled])',
-      'textarea:not([disabled])',
-      '[tabindex]:not([tabindex="-1"])'
-    ];
-
-    const firstElement = container.querySelector(focusableSelectors.join(','));
-    if (firstElement) {
-      (firstElement as HTMLElement).focus();
-    }
-  }
-
-  // Focus last focusable element in container
-  static focusLastInContainer(container: HTMLElement): void {
-    const focusableSelectors = [
-      'a[href]',
-      'button:not([disabled])',
-      'input:not([disabled])',
-      'select:not([disabled])',
-      'textarea:not([disabled])',
-      '[tabindex]:not([tabindex="-1"])'
-    ];
-
-    const elements = Array.from(container.querySelectorAll(focusableSelectors.join(',')));
-    const lastElement = elements[elements.length - 1];
-    if (lastElement) {
-      (lastElement as HTMLElement).focus();
-    }
-  }
+    // Navigate to next heading
+    static focusNextHeading() {
+        const headings = Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
+        const currentIndex = headings.indexOf(document.activeElement);
+        const nextIndex = currentIndex < headings.length - 1 ? currentIndex + 1 : 0;
+        if (headings[nextIndex]) {
+            headings[nextIndex].focus();
+        }
+    }
+    // Navigate to previous heading
+    static focusPreviousHeading() {
+        const headings = Array.from(document.querySelectorAll('h1, h2, h3, h4, h5, h6'));
+        const currentIndex = headings.indexOf(document.activeElement);
+        const prevIndex = currentIndex > 0 ? currentIndex - 1 : headings.length - 1;
+        if (headings[prevIndex]) {
+            headings[prevIndex].focus();
+        }
+    }
+    // Navigate to next landmark
+    static focusNextLandmark() {
+        const landmarks = Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
+        const currentIndex = landmarks.indexOf(document.activeElement);
+        const nextIndex = currentIndex < landmarks.length - 1 ? currentIndex + 1 : 0;
+        if (landmarks[nextIndex]) {
+            landmarks[nextIndex].focus();
+        }
+    }
+    // Navigate to previous landmark
+    static focusPreviousLandmark() {
+        const landmarks = Array.from(document.querySelectorAll('[role="banner"], [role="main"], [role="navigation"], [role="complementary"], [role="contentinfo"]'));
+        const currentIndex = landmarks.indexOf(document.activeElement);
+        const prevIndex = currentIndex > 0 ? currentIndex - 1 : landmarks.length - 1;
+        if (landmarks[prevIndex]) {
+            landmarks[prevIndex].focus();
+        }
+    }
+    // Focus first focusable element in container
+    static focusFirstInContainer(container) {
+        const focusableSelectors = [
+            'a[href]',
+            'button:not([disabled])',
+            'input:not([disabled])',
+            'select:not([disabled])',
+            'textarea:not([disabled])',
+            '[tabindex]:not([tabindex="-1"])'
+        ];
+        const firstElement = container.querySelector(focusableSelectors.join(','));
+        if (firstElement) {
+            firstElement.focus();
+        }
+    }
+    // Focus last focusable element in container
+    static focusLastInContainer(container) {
+        const focusableSelectors = [
+            'a[href]',
+            'button:not([disabled])',
+            'input:not([disabled])',
+            'select:not([disabled])',
+            'textarea:not([disabled])',
+            '[tabindex]:not([tabindex="-1"])'
+        ];
+        const elements = Array.from(container.querySelectorAll(focusableSelectors.join(',')));
+        const lastElement = elements[elements.length - 1];
+        if (lastElement) {
+            lastElement.focus();
+        }
+    }
 }
-
 // Export default instances
 export const focusManager = new AccessibilityFocusManager();
 export const focusRestoration = new FocusRestoration();
-
 // Export default
 export default {
-  AccessibilityFocusManager,
-  FocusTrap,
-  FocusRestoration,
-  FocusNavigation,
-  focusManager,
-  focusRestoration
+    AccessibilityFocusManager,
+    FocusTrap,
+    FocusRestoration,
+    FocusNavigation,
+    focusManager,
+    focusRestoration
 };