cloud-ide-element 1.0.12 → 1.0.13

package/fesm2022/cloud-ide-element.mjs

@@ -3375,841 +3375,361 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
-class KeyboardShortcutService {
-    shortcuts = new Map();
-    overrides = new Map();
-    keydownListener;
-    constructor() {
-        this.setupGlobalListener();
+class CideEleFloatingContainerService {
+    injector;
+    containers = signal(new Map(), ...(ngDevMode ? [{ debugName: "containers" }] : []));
+    nextZIndex = signal(1000, ...(ngDevMode ? [{ debugName: "nextZIndex" }] : []));
+    instanceCounter = signal(0, ...(ngDevMode ? [{ debugName: "instanceCounter" }] : []));
+    // Dynamic component management
+    componentRegistry = new Map();
+    activeComponents = new Map();
+    constructor(injector) {
+        this.injector = injector;
+        // Keyboard shortcuts are registered by FloatingContainerShortcutsService independently
     }
-    ngOnDestroy() {
-        this.removeGlobalListener();
+    // Computed properties
+    visibleContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isVisible), ...(ngDevMode ? [{ debugName: "visibleContainers" }] : []));
+    minimizedContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isMinimized), ...(ngDevMode ? [{ debugName: "minimizedContainers" }] : []));
+    maximizedContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isMaximized), ...(ngDevMode ? [{ debugName: "maximizedContainers" }] : []));
+    // Container management methods
+    show(config) {
+        const containerId = config.id || this.generateId();
+        const instanceId = this.generateInstanceId(config.componentId || 'default');
+        // Get the highest z-index and add 1 to bring new container to front
+        const maxZIndex = this.getMaxZIndex();
+        const zIndex = maxZIndex + 1;
+        const now = new Date();
+        const container = {
+            id: containerId,
+            config: { ...config, id: containerId },
+            isVisible: true,
+            isMinimized: false,
+            isMaximized: false,
+            zIndex,
+            instanceId,
+            componentType: config.componentId || 'default',
+            createdAt: now,
+            lastAccessed: now
+        };
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            newContainers.set(containerId, container);
+            return newContainers;
+        });
+        this.nextZIndex.update(z => z + 1);
+        return containerId;
     }
-    /**
-     * Register a new keyboard shortcut
-     */
-    register(shortcut) {
-        this.shortcuts.set(shortcut.id, shortcut);
-        console.log(`⌨️ [KeyboardShortcut] Registered shortcut: ${shortcut.id} (${this.getKeyDescription(shortcut)})`);
+    hide(containerId) {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            const container = newContainers.get(containerId);
+            if (container) {
+                container.isVisible = false;
+                newContainers.set(containerId, container);
+            }
+            return newContainers;
+        });
     }
     /**
-     * Override an existing shortcut with new key combination
+     * Get the maximum z-index among all visible containers
      */
-    override(shortcutId, newKey, options) {
-        const originalShortcut = this.shortcuts.get(shortcutId);
-        if (!originalShortcut) {
-            console.warn(`⚠️ [KeyboardShortcut] Cannot override shortcut '${shortcutId}' - not found`);
-            return;
+    getMaxZIndex() {
+        const containers = this.containers();
+        let maxZIndex = 1000; // Base z-index
+        for (const container of containers.values()) {
+            if (container.isVisible && container.zIndex > maxZIndex) {
+                maxZIndex = container.zIndex;
+            }
         }
-        const override = {
-            shortcutId,
-            newKey,
-            newCtrlKey: options?.ctrlKey,
-            newAltKey: options?.altKey,
-            newShiftKey: options?.shiftKey,
-            newMetaKey: options?.metaKey
-        };
-        this.overrides.set(shortcutId, override);
-        console.log(`🔄 [KeyboardShortcut] Override registered for '${shortcutId}': ${this.getKeyDescription({ ...originalShortcut, ...options, key: newKey })}`);
-    }
-    /**
-     * Remove a shortcut
-     */
-    unregister(shortcutId) {
-        this.shortcuts.delete(shortcutId);
-        this.overrides.delete(shortcutId);
-        console.log(`🗑️ [KeyboardShortcut] Removed shortcut: ${shortcutId}`);
+        return maxZIndex;
     }
     /**
-     * Remove override for a shortcut (restore original key combination)
+     * Bring a container to the front (highest z-index)
      */
-    removeOverride(shortcutId) {
-        this.overrides.delete(shortcutId);
-        console.log(`🔄 [KeyboardShortcut] Override removed for: ${shortcutId}`);
+    bringToFront(containerId) {
+        const maxZIndex = this.getMaxZIndex();
+        const newZIndex = maxZIndex + 1;
+        console.log(`🎯 [FloatingContainer] Bringing container '${containerId}' to front`);
+        console.log(`🎯 [FloatingContainer] Current max z-index: ${maxZIndex}, new z-index: ${newZIndex}`);
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            const container = newContainers.get(containerId);
+            if (container) {
+                const oldZIndex = container.zIndex;
+                container.zIndex = newZIndex;
+                container.lastAccessed = new Date();
+                newContainers.set(containerId, container);
+                console.log(`🎯 [FloatingContainer] Container '${containerId}' z-index updated: ${oldZIndex} → ${newZIndex}`);
+            }
+            else {
+                console.warn(`⚠️ [FloatingContainer] Container '${containerId}' not found!`);
+            }
+            return newContainers;
+        });
     }
-    /**
-     * Get all registered shortcuts
-     */
-    getAllShortcuts() {
-        return Array.from(this.shortcuts.values());
+    minimize(containerId) {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            const container = newContainers.get(containerId);
+            if (container) {
+                container.isMinimized = !container.isMinimized;
+                newContainers.set(containerId, container);
+            }
+            return newContainers;
+        });
     }
-    /**
-     * Get shortcuts by category or filter
-     */
-    getShortcuts(filter) {
-        const shortcuts = this.getAllShortcuts();
-        return filter ? shortcuts.filter(filter) : shortcuts;
+    maximize(containerId) {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            const container = newContainers.get(containerId);
+            if (container) {
+                container.isMaximized = !container.isMaximized;
+                newContainers.set(containerId, container);
+            }
+            return newContainers;
+        });
     }
-    /**
-     * Check if a shortcut is registered
-     */
-    hasShortcut(shortcutId) {
-        return this.shortcuts.has(shortcutId);
+    getContainer(containerId) {
+        return this.containers().get(containerId);
     }
-    /**
-     * Get shortcut information
-     */
-    getShortcut(shortcutId) {
-        return this.shortcuts.get(shortcutId);
+    isVisible(containerId) {
+        const container = this.getContainer(containerId);
+        return container ? container.isVisible : false;
     }
-    /**
-     * Clear all shortcuts
-     */
-    clearAll() {
-        this.shortcuts.clear();
-        this.overrides.clear();
-        console.log(`🧹 [KeyboardShortcut] All shortcuts cleared`);
+    isMinimized(containerId) {
+        const container = this.getContainer(containerId);
+        return container ? container.isMinimized : false;
     }
-    /**
-     * Set up global keyboard listener
-     */
-    setupGlobalListener() {
-        this.keydownListener = (event) => {
-            this.handleKeydown(event);
-        };
-        document.addEventListener('keydown', this.keydownListener);
-        console.log(`🎧 [KeyboardShortcut] Global keyboard listener attached`);
+    isMaximized(containerId) {
+        const container = this.getContainer(containerId);
+        return container ? container.isMaximized : false;
     }
-    /**
-     * Remove global keyboard listener
-     */
-    removeGlobalListener() {
-        if (this.keydownListener) {
-            document.removeEventListener('keydown', this.keydownListener);
-            this.keydownListener = undefined;
-            console.log(`🎧 [KeyboardShortcut] Global keyboard listener removed`);
-        }
+    hideAll() {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            for (const [id, container] of newContainers) {
+                container.isVisible = false;
+                newContainers.set(id, container);
+            }
+            return newContainers;
+        });
     }
-    /**
-     * Handle keydown events
-     */
-    handleKeydown(event) {
-        for (const [shortcutId, shortcut] of this.shortcuts) {
-            if (this.matchesShortcut(event, shortcut)) {
-                // Check for override
-                const override = this.overrides.get(shortcutId);
-                if (override && !this.matchesOverride(event, override)) {
-                    continue; // Skip if override doesn't match
-                }
-                if (shortcut.preventDefault !== false) {
-                    event.preventDefault();
-                }
-                if (shortcut.stopPropagation) {
-                    event.stopPropagation();
+    minimizeAll() {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            for (const [id, container] of newContainers) {
+                if (container.isVisible) {
+                    container.isMinimized = true;
+                    newContainers.set(id, container);
                 }
-                console.log(`⌨️ [KeyboardShortcut] Executing shortcut: ${shortcutId}`);
-                shortcut.action();
-                break; // Only execute one shortcut per keydown
             }
-        }
+            return newContainers;
+        });
     }
-    /**
-     * Check if event matches shortcut
-     */
-    matchesShortcut(event, shortcut) {
-        return event.key === shortcut.key &&
-            (shortcut.ctrlKey === undefined || event.ctrlKey === shortcut.ctrlKey) &&
-            (shortcut.altKey === undefined || event.altKey === shortcut.altKey) &&
-            (shortcut.shiftKey === undefined || event.shiftKey === shortcut.shiftKey) &&
-            (shortcut.metaKey === undefined || event.metaKey === shortcut.metaKey);
+    generateId() {
+        return `floating-container-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
     }
-    /**
-     * Check if event matches override
-     */
-    matchesOverride(event, override) {
-        return event.key === override.newKey &&
-            (override.newCtrlKey === undefined || event.ctrlKey === override.newCtrlKey) &&
-            (override.newAltKey === undefined || event.altKey === override.newAltKey) &&
-            (override.newShiftKey === undefined || event.shiftKey === override.newShiftKey) &&
-            (override.newMetaKey === undefined || event.metaKey === override.newMetaKey);
+    generateInstanceId(componentType) {
+        const counter = this.instanceCounter() + 1;
+        this.instanceCounter.update(c => c + 1);
+        return `${componentType}-instance-${counter}-${Date.now()}`;
     }
-    /**
-     * Get human-readable key description
-     */
-    getKeyDescription(shortcut) {
-        const modifiers = [];
-        if (shortcut.ctrlKey)
-            modifiers.push('Ctrl');
-        if (shortcut.altKey)
-            modifiers.push('Alt');
-        if (shortcut.shiftKey)
-            modifiers.push('Shift');
-        if (shortcut.metaKey)
-            modifiers.push('Meta');
-        return [...modifiers, shortcut.key].join(' + ');
+    // Multiple instance management methods
+    getInstancesByComponentType(componentType) {
+        return Array.from(this.containers().values())
+            .filter(container => container.componentType === componentType);
     }
-    /**
-     * Get key description for a shortcut ID
-     */
-    getKeyDescriptionForShortcut(shortcutId) {
-        const shortcut = this.shortcuts.get(shortcutId);
-        if (!shortcut)
-            return 'Not found';
-        const override = this.overrides.get(shortcutId);
-        if (override) {
-            return this.getKeyDescription({
-                key: override.newKey,
-                ctrlKey: override.newCtrlKey,
-                altKey: override.newAltKey,
-                shiftKey: override.newShiftKey,
-                metaKey: override.newMetaKey
-            });
-        }
-        return this.getKeyDescription(shortcut);
+    getActiveInstancesByComponentType(componentType) {
+        return Array.from(this.containers().values())
+            .filter(container => container.componentType === componentType && container.isVisible);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class FloatingContainerShortcutsService {
-    keyboardShortcutService = inject(KeyboardShortcutService);
-    containerService = inject(CideEleFloatingContainerService);
-    // Z-index layers for different container states
-    Z_INDEX_LAYERS = {
-        HIDDEN: 100, // Hidden containers (behind everything)
-        BACKGROUND: 1000, // Background containers
-        NORMAL: 2000, // Normal visible containers
-        FOCUSED: 3000, // Focused containers
-        MODAL: 4000, // Modal containers
-        TOOLTIP: 5000 // Tooltips and overlays
-    };
-    constructor() {
-        this.registerDefaultShortcuts();
+    getInstanceCount(componentType) {
+        return this.getInstancesByComponentType(componentType).length;
     }
-    /**
-     * Register default floating container shortcuts
-     */
-    registerDefaultShortcuts() {
-        console.log('🎯 [FloatingContainerShortcuts] Registering default shortcuts');
-        // Alt + 1, Alt + 2, etc. - Focus specific containers
-        this.registerNumberShortcuts();
-        // Alt + N - New container
-        this.keyboardShortcutService.register({
-            id: 'floating-container-new',
-            key: 'n',
-            altKey: true,
-            description: 'Create new floating container',
-            action: () => this.openNewContainer(),
-            preventDefault: true
-        });
-        // Alt + P - Previous container
-        this.keyboardShortcutService.register({
-            id: 'floating-container-previous',
-            key: 'p',
-            altKey: true,
-            description: 'Focus previous container',
-            action: () => this.focusPreviousContainer(),
-            preventDefault: true
-        });
-        // Alt + H - Hide all containers
-        this.keyboardShortcutService.register({
-            id: 'floating-container-hide-all',
-            key: 'h',
-            altKey: true,
-            description: 'Hide all containers',
-            action: () => this.hideAllContainers(),
-            preventDefault: true
-        });
-        // Alt + S - Show all containers
-        this.keyboardShortcutService.register({
-            id: 'floating-container-show-all',
-            key: 's',
-            altKey: true,
-            description: 'Show all containers',
-            action: () => this.showAllContainers(),
-            preventDefault: true
-        });
-        // Alt + M - Minimize all containers
-        this.keyboardShortcutService.register({
-            id: 'floating-container-minimize-all',
-            key: 'm',
-            altKey: true,
-            description: 'Minimize all containers',
-            action: () => this.minimizeAllContainers(),
-            preventDefault: true
-        });
-        // Alt + W - Close current container
-        this.keyboardShortcutService.register({
-            id: 'floating-container-close-current',
-            key: 'w',
-            altKey: true,
-            description: 'Close current container',
-            action: () => this.closeCurrentContainer(),
-            preventDefault: true
-        });
-        // Alt + D - Duplicate current container
-        this.keyboardShortcutService.register({
-            id: 'floating-container-duplicate',
-            key: 'd',
-            altKey: true,
-            description: 'Duplicate current container',
-            action: () => this.duplicateCurrentContainer(),
-            preventDefault: true
+    getActiveInstanceCount(componentType) {
+        return this.getActiveInstancesByComponentType(componentType).length;
+    }
+    // Close all instances of a component type
+    closeAllInstancesOfType(componentType) {
+        const instances = this.getInstancesByComponentType(componentType);
+        instances.forEach(instance => {
+            this.hide(instance.id);
         });
-        // Alt + T - Toggle container visibility
-        this.keyboardShortcutService.register({
-            id: 'floating-container-toggle-visibility',
-            key: 't',
-            altKey: true,
-            description: 'Toggle container visibility',
-            action: () => this.toggleContainerVisibility(),
-            preventDefault: true
+    }
+    // Minimize all instances of a component type
+    minimizeAllInstancesOfType(componentType) {
+        const instances = this.getActiveInstancesByComponentType(componentType);
+        instances.forEach(instance => {
+            this.minimize(instance.id);
         });
-        // Alt + O - Open file uploader
-        this.keyboardShortcutService.register({
-            id: 'floating-container-open-file-uploader',
-            key: 'o',
-            altKey: true,
-            description: 'Open file uploader',
-            action: () => this.openFileUploader(),
-            preventDefault: true
+    }
+    // Bring all instances of a component type to front
+    bringAllInstancesToFront(componentType) {
+        const instances = this.getActiveInstancesByComponentType(componentType);
+        instances.forEach(instance => {
+            this.bringToFront(instance.id);
         });
-        // Alt + R - Open entity rights sharing
-        this.keyboardShortcutService.register({
-            id: 'floating-container-open-entity-rights',
-            key: 'r',
-            altKey: true,
-            description: 'Open entity rights sharing',
-            action: () => this.openEntityRightsSharing(),
-            preventDefault: true
+    }
+    // Get instance by unique instance ID
+    getInstanceByInstanceId(instanceId) {
+        return Array.from(this.containers().values())
+            .find(container => container.instanceId === instanceId);
+    }
+    // Update last accessed time
+    updateLastAccessed(containerId) {
+        this.containers.update(containers => {
+            const newContainers = new Map(containers);
+            const container = newContainers.get(containerId);
+            if (container) {
+                container.lastAccessed = new Date();
+                newContainers.set(containerId, container);
+            }
+            return newContainers;
         });
-        console.log('✅ [FloatingContainerShortcuts] Default shortcuts registered');
     }
+    // ===== DYNAMIC COMPONENT MANAGEMENT =====
     /**
-     * Register number shortcuts (Alt + 1, Alt + 2, etc.)
+     * Register a component for dynamic loading
      */
-    registerNumberShortcuts() {
-        for (let i = 1; i <= 9; i++) {
-            this.keyboardShortcutService.register({
-                id: `floating-container-focus-${i}`,
-                key: i.toString(),
-                altKey: true,
-                description: `Focus container ${i}`,
-                action: () => this.focusContainerByIndex(i - 1),
-                preventDefault: true
-            });
-        }
+    registerComponent(componentId, componentType) {
+        this.componentRegistry.set(componentId, componentType);
     }
     /**
-     * Open new floating container
+     * Unregister a component
      */
-    openNewContainer() {
-        console.log('🎯 [FloatingContainerShortcuts] Opening new container');
-        const containerId = this.containerService.show({
-            id: 'new-container-' + Date.now(),
-            title: 'New Container',
-            width: '400px',
-            height: '300px'
-        });
-        console.log('✅ [FloatingContainerShortcuts] New container created:', containerId);
+    unregisterComponent(componentId) {
+        this.componentRegistry.delete(componentId);
     }
     /**
-     * Focus previous container
+     * Get registered component type
      */
-    focusPreviousContainer() {
-        console.log('🎯 [FloatingContainerShortcuts] Focusing previous container');
-        const containers = this.containerService.visibleContainers();
-        if (containers.length > 0) {
-            // For now, just focus the last container
-            const previousIndex = containers.length - 1;
-            this.containerService.bringToFront(containers[previousIndex].id);
-        }
+    getComponentType(componentId) {
+        return this.componentRegistry.get(componentId);
     }
     /**
-     * Hide all containers
+     * Check if component is registered
      */
-    hideAllContainers() {
-        console.log('🎯 [FloatingContainerShortcuts] Hiding all containers');
-        const containers = this.containerService.visibleContainers();
-        containers.forEach(container => {
-            this.containerService.setZIndex(container.id, this.Z_INDEX_LAYERS.HIDDEN);
-        });
-        console.log('✅ [FloatingContainerShortcuts] All containers hidden');
+    isComponentRegistered(componentId) {
+        return this.componentRegistry.has(componentId);
     }
     /**
-     * Show all containers
+     * Get registered component IDs
      */
-    showAllContainers() {
-        console.log('🎯 [FloatingContainerShortcuts] Showing all containers');
-        const containers = this.containerService.visibleContainers();
-        containers.forEach((container, index) => {
-            this.containerService.setZIndex(container.id, this.Z_INDEX_LAYERS.NORMAL + index);
-        });
-        console.log('✅ [FloatingContainerShortcuts] All containers shown');
+    getRegisteredComponentIds() {
+        return Array.from(this.componentRegistry.keys());
     }
     /**
-     * Minimize all containers
+     * Create and load component dynamically
      */
-    minimizeAllContainers() {
-        console.log('🎯 [FloatingContainerShortcuts] Minimizing all containers');
-        const containers = this.containerService.visibleContainers();
-        containers.forEach(container => {
-            // Implement minimize logic here
-            console.log('📦 [FloatingContainerShortcuts] Minimizing container:', container.id);
-        });
-        console.log('✅ [FloatingContainerShortcuts] All containers minimized');
+    loadComponent(componentId, viewContainer, config) {
+        const componentType = this.componentRegistry.get(componentId);
+        if (!componentType) {
+            return null;
+        }
+        try {
+            viewContainer.clear();
+            const componentRef = viewContainer.createComponent(componentType, {
+                injector: this.injector
+            });
+            // Set inputs if provided
+            if (config?.inputs) {
+                Object.keys(config.inputs).forEach(key => {
+                    if (componentRef.instance && typeof componentRef.instance === 'object' && key in componentRef.instance) {
+                        componentRef.instance[key] = config.inputs[key];
+                    }
+                });
+            }
+            // Set outputs if provided
+            if (config?.outputs) {
+                Object.keys(config.outputs).forEach(key => {
+                    if (componentRef.instance && typeof componentRef.instance === 'object' && key in componentRef.instance) {
+                        const output = componentRef.instance[key];
+                        if (output && typeof output.subscribe === 'function') {
+                            output.subscribe(config.outputs[key]);
+                        }
+                    }
+                });
+            }
+            this.activeComponents.set(componentId, componentRef);
+            return componentRef;
+        }
+        catch (error) {
+            return null;
+        }
     }
     /**
-     * Focus container by index
+     * Destroy component
      */
-    focusContainerByIndex(index) {
-        console.log('🎯 [FloatingContainerShortcuts] Focusing container at index:', index);
-        const containers = this.containerService.visibleContainers();
-        if (containers[index]) {
-            this.containerService.bringToFront(containers[index].id);
-            console.log('✅ [FloatingContainerShortcuts] Container focused:', containers[index].id);
-        }
-        else {
-            console.warn('⚠️ [FloatingContainerShortcuts] Container not found at index:', index);
+    destroyComponent(componentId) {
+        const componentRef = this.activeComponents.get(componentId);
+        if (componentRef) {
+            componentRef.destroy();
+            this.activeComponents.delete(componentId);
         }
     }
     /**
-     * Open file uploader
+     * Get active component count
      */
-    openFileUploader() {
-        console.log('🎯 [FloatingContainerShortcuts] Opening file uploader');
-        // Implement file uploader opening logic here
-        console.log('✅ [FloatingContainerShortcuts] File uploader opened');
+    getActiveComponentCount() {
+        return this.activeComponents.size;
     }
     /**
-     * Open entity rights sharing
+     * Clear all active components
      */
-    openEntityRightsSharing() {
-        console.log('🎯 [FloatingContainerShortcuts] Opening entity rights sharing');
-        // Implement entity rights sharing opening logic here
-        console.log('✅ [FloatingContainerShortcuts] Entity rights sharing opened');
+    clearActiveComponents() {
+        this.activeComponents.forEach(componentRef => componentRef.destroy());
+        this.activeComponents.clear();
     }
+    // ===== CONTAINER MANAGER FUNCTIONALITY =====
     /**
-     * Duplicate current container
+     * Get config signal for a container
      */
-    duplicateCurrentContainer() {
-        console.log('🎯 [FloatingContainerShortcuts] Duplicating current container');
-        const containers = this.containerService.visibleContainers();
-        if (containers.length > 0) {
-            const containerToDuplicate = containers[containers.length - 1]; // Use last container
-            const newContainerId = this.containerService.show({
-                id: 'duplicate-' + Date.now(),
-                title: `${containerToDuplicate.config.title} (Copy)`,
-                width: containerToDuplicate.config.width,
-                height: containerToDuplicate.config.height
-            });
-            console.log('✅ [FloatingContainerShortcuts] Container duplicated:', newContainerId);
-        }
-        else {
-            console.warn('⚠️ [FloatingContainerShortcuts] No container to duplicate');
-        }
+    getConfigSignal(config) {
+        return signal(config);
     }
     /**
-     * Close current container
+     * Get minimized signal for a container
      */
-    closeCurrentContainer() {
-        console.log('🎯 [FloatingContainerShortcuts] Closing current container');
-        const containers = this.containerService.visibleContainers();
-        if (containers.length > 0) {
-            const containerToClose = containers[containers.length - 1]; // Use last container
-            this.containerService.hide(containerToClose.id);
-            console.log('✅ [FloatingContainerShortcuts] Container closed:', containerToClose.id);
-        }
-        else {
-            console.warn('⚠️ [FloatingContainerShortcuts] No container to close');
-        }
+    getMinimizedSignal(containerId) {
+        return computed(() => {
+            const container = this.getContainer(containerId);
+            return container?.isMinimized || false;
+        });
     }
     /**
-     * Toggle container visibility
+     * Get maximized signal for a container
      */
-    toggleContainerVisibility() {
-        console.log('🎯 [FloatingContainerShortcuts] Toggling container visibility');
-        const containers = this.containerService.visibleContainers();
-        if (containers.length > 0) {
-            const containerToToggle = containers[containers.length - 1]; // Use last container
-            const currentZIndex = this.containerService.getZIndexSignal(containerToToggle.id)();
-            if (currentZIndex === this.Z_INDEX_LAYERS.HIDDEN) {
-                this.containerService.setZIndex(containerToToggle.id, this.Z_INDEX_LAYERS.NORMAL);
-                console.log('✅ [FloatingContainerShortcuts] Container shown:', containerToToggle.id);
-            }
-            else {
-                this.containerService.setZIndex(containerToToggle.id, this.Z_INDEX_LAYERS.HIDDEN);
-                console.log('✅ [FloatingContainerShortcuts] Container hidden:', containerToToggle.id);
-            }
-        }
-        else {
-            console.warn('⚠️ [FloatingContainerShortcuts] No container to toggle');
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-class CideEleFloatingContainerService {
-    injector;
-    shortcutsService;
-    containers = signal(new Map(), ...(ngDevMode ? [{ debugName: "containers" }] : []));
-    nextZIndex = signal(1000, ...(ngDevMode ? [{ debugName: "nextZIndex" }] : []));
-    instanceCounter = signal(0, ...(ngDevMode ? [{ debugName: "instanceCounter" }] : []));
-    // Dynamic component management
-    componentRegistry = new Map();
-    activeComponents = new Map();
-    constructor(injector, shortcutsService) {
-        this.injector = injector;
-        this.shortcutsService = shortcutsService;
-        // Keyboard shortcuts are automatically registered by FloatingContainerShortcutsService
-        console.log('🎯 [FloatingContainerService] Shortcuts service injected and shortcuts registered');
-    }
-    // Computed properties
-    visibleContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isVisible), ...(ngDevMode ? [{ debugName: "visibleContainers" }] : []));
-    minimizedContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isMinimized), ...(ngDevMode ? [{ debugName: "minimizedContainers" }] : []));
-    maximizedContainers = computed(() => Array.from(this.containers().values()).filter(container => container.isMaximized), ...(ngDevMode ? [{ debugName: "maximizedContainers" }] : []));
-    // Container management methods
-    show(config) {
-        const containerId = config.id || this.generateId();
-        const instanceId = this.generateInstanceId(config.componentId || 'default');
-        // Get the highest z-index and add 1 to bring new container to front
-        const maxZIndex = this.getMaxZIndex();
-        const zIndex = maxZIndex + 1;
-        const now = new Date();
-        const container = {
-            id: containerId,
-            config: { ...config, id: containerId },
-            isVisible: true,
-            isMinimized: false,
-            isMaximized: false,
-            zIndex,
-            instanceId,
-            componentType: config.componentId || 'default',
-            createdAt: now,
-            lastAccessed: now
-        };
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            newContainers.set(containerId, container);
-            return newContainers;
+    getMaximizedSignal(containerId) {
+        return computed(() => {
+            const container = this.getContainer(containerId);
+            return container?.isMaximized || false;
         });
-        this.nextZIndex.update(z => z + 1);
-        return containerId;
     }
-    hide(containerId) {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            const container = newContainers.get(containerId);
-            if (container) {
-                container.isVisible = false;
-                newContainers.set(containerId, container);
-            }
-            return newContainers;
+    getZIndexSignal(containerId) {
+        return computed(() => {
+            const container = this.getContainer(containerId);
+            const zIndex = container?.zIndex || 1000;
+            console.log(`🎯 [FloatingContainer] Z-index signal for '${containerId}': ${zIndex}`);
+            return zIndex;
         });
     }
     /**
-     * Get the maximum z-index among all visible containers
-     */
-    getMaxZIndex() {
-        const containers = this.containers();
-        let maxZIndex = 1000; // Base z-index
-        for (const container of containers.values()) {
-            if (container.isVisible && container.zIndex > maxZIndex) {
-                maxZIndex = container.zIndex;
-            }
-        }
-        return maxZIndex;
-    }
-    /**
-     * Bring a container to the front (highest z-index)
+     * Set z-index for a specific container
      */
-    bringToFront(containerId) {
-        const maxZIndex = this.getMaxZIndex();
-        const newZIndex = maxZIndex + 1;
-        console.log(`🎯 [FloatingContainer] Bringing container '${containerId}' to front`);
-        console.log(`🎯 [FloatingContainer] Current max z-index: ${maxZIndex}, new z-index: ${newZIndex}`);
+    setZIndex(containerId, zIndex) {
+        console.log(`🎯 [FloatingContainer] Setting z-index for '${containerId}' to ${zIndex}`);
         this.containers.update(containers => {
             const newContainers = new Map(containers);
             const container = newContainers.get(containerId);
             if (container) {
                 const oldZIndex = container.zIndex;
-                container.zIndex = newZIndex;
+                container.zIndex = zIndex;
                 container.lastAccessed = new Date();
                 newContainers.set(containerId, container);
-                console.log(`🎯 [FloatingContainer] Container '${containerId}' z-index updated: ${oldZIndex} → ${newZIndex}`);
+                console.log(`🎯 [FloatingContainer] Container '${containerId}' z-index updated: ${oldZIndex} → ${zIndex}`);
             }
             else {
-                console.warn(`⚠️ [FloatingContainer] Container '${containerId}' not found!`);
-            }
-            return newContainers;
-        });
-    }
-    minimize(containerId) {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            const container = newContainers.get(containerId);
-            if (container) {
-                container.isMinimized = !container.isMinimized;
-                newContainers.set(containerId, container);
-            }
-            return newContainers;
-        });
-    }
-    maximize(containerId) {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            const container = newContainers.get(containerId);
-            if (container) {
-                container.isMaximized = !container.isMaximized;
-                newContainers.set(containerId, container);
-            }
-            return newContainers;
-        });
-    }
-    getContainer(containerId) {
-        return this.containers().get(containerId);
-    }
-    isVisible(containerId) {
-        const container = this.getContainer(containerId);
-        return container ? container.isVisible : false;
-    }
-    isMinimized(containerId) {
-        const container = this.getContainer(containerId);
-        return container ? container.isMinimized : false;
-    }
-    isMaximized(containerId) {
-        const container = this.getContainer(containerId);
-        return container ? container.isMaximized : false;
-    }
-    hideAll() {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            for (const [id, container] of newContainers) {
-                container.isVisible = false;
-                newContainers.set(id, container);
-            }
-            return newContainers;
-        });
-    }
-    minimizeAll() {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            for (const [id, container] of newContainers) {
-                if (container.isVisible) {
-                    container.isMinimized = true;
-                    newContainers.set(id, container);
-                }
-            }
-            return newContainers;
-        });
-    }
-    generateId() {
-        return `floating-container-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-    }
-    generateInstanceId(componentType) {
-        const counter = this.instanceCounter() + 1;
-        this.instanceCounter.update(c => c + 1);
-        return `${componentType}-instance-${counter}-${Date.now()}`;
-    }
-    // Multiple instance management methods
-    getInstancesByComponentType(componentType) {
-        return Array.from(this.containers().values())
-            .filter(container => container.componentType === componentType);
-    }
-    getActiveInstancesByComponentType(componentType) {
-        return Array.from(this.containers().values())
-            .filter(container => container.componentType === componentType && container.isVisible);
-    }
-    getInstanceCount(componentType) {
-        return this.getInstancesByComponentType(componentType).length;
-    }
-    getActiveInstanceCount(componentType) {
-        return this.getActiveInstancesByComponentType(componentType).length;
-    }
-    // Close all instances of a component type
-    closeAllInstancesOfType(componentType) {
-        const instances = this.getInstancesByComponentType(componentType);
-        instances.forEach(instance => {
-            this.hide(instance.id);
-        });
-    }
-    // Minimize all instances of a component type
-    minimizeAllInstancesOfType(componentType) {
-        const instances = this.getActiveInstancesByComponentType(componentType);
-        instances.forEach(instance => {
-            this.minimize(instance.id);
-        });
-    }
-    // Bring all instances of a component type to front
-    bringAllInstancesToFront(componentType) {
-        const instances = this.getActiveInstancesByComponentType(componentType);
-        instances.forEach(instance => {
-            this.bringToFront(instance.id);
-        });
-    }
-    // Get instance by unique instance ID
-    getInstanceByInstanceId(instanceId) {
-        return Array.from(this.containers().values())
-            .find(container => container.instanceId === instanceId);
-    }
-    // Update last accessed time
-    updateLastAccessed(containerId) {
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            const container = newContainers.get(containerId);
-            if (container) {
-                container.lastAccessed = new Date();
-                newContainers.set(containerId, container);
-            }
-            return newContainers;
-        });
-    }
-    // ===== DYNAMIC COMPONENT MANAGEMENT =====
-    /**
-     * Register a component for dynamic loading
-     */
-    registerComponent(componentId, componentType) {
-        this.componentRegistry.set(componentId, componentType);
-    }
-    /**
-     * Unregister a component
-     */
-    unregisterComponent(componentId) {
-        this.componentRegistry.delete(componentId);
-    }
-    /**
-     * Get registered component type
-     */
-    getComponentType(componentId) {
-        return this.componentRegistry.get(componentId);
-    }
-    /**
-     * Check if component is registered
-     */
-    isComponentRegistered(componentId) {
-        return this.componentRegistry.has(componentId);
-    }
-    /**
-     * Get registered component IDs
-     */
-    getRegisteredComponentIds() {
-        return Array.from(this.componentRegistry.keys());
-    }
-    /**
-     * Create and load component dynamically
-     */
-    loadComponent(componentId, viewContainer, config) {
-        const componentType = this.componentRegistry.get(componentId);
-        if (!componentType) {
-            return null;
-        }
-        try {
-            viewContainer.clear();
-            const componentRef = viewContainer.createComponent(componentType, {
-                injector: this.injector
-            });
-            // Set inputs if provided
-            if (config?.inputs) {
-                Object.keys(config.inputs).forEach(key => {
-                    if (componentRef.instance && typeof componentRef.instance === 'object' && key in componentRef.instance) {
-                        componentRef.instance[key] = config.inputs[key];
-                    }
-                });
-            }
-            // Set outputs if provided
-            if (config?.outputs) {
-                Object.keys(config.outputs).forEach(key => {
-                    if (componentRef.instance && typeof componentRef.instance === 'object' && key in componentRef.instance) {
-                        const output = componentRef.instance[key];
-                        if (output && typeof output.subscribe === 'function') {
-                            output.subscribe(config.outputs[key]);
-                        }
-                    }
-                });
-            }
-            this.activeComponents.set(componentId, componentRef);
-            return componentRef;
-        }
-        catch (error) {
-            return null;
-        }
-    }
-    /**
-     * Destroy component
-     */
-    destroyComponent(componentId) {
-        const componentRef = this.activeComponents.get(componentId);
-        if (componentRef) {
-            componentRef.destroy();
-            this.activeComponents.delete(componentId);
-        }
-    }
-    /**
-     * Get active component count
-     */
-    getActiveComponentCount() {
-        return this.activeComponents.size;
-    }
-    /**
-     * Clear all active components
-     */
-    clearActiveComponents() {
-        this.activeComponents.forEach(componentRef => componentRef.destroy());
-        this.activeComponents.clear();
-    }
-    // ===== CONTAINER MANAGER FUNCTIONALITY =====
-    /**
-     * Get config signal for a container
-     */
-    getConfigSignal(config) {
-        return signal(config);
-    }
-    /**
-     * Get minimized signal for a container
-     */
-    getMinimizedSignal(containerId) {
-        return computed(() => {
-            const container = this.getContainer(containerId);
-            return container?.isMinimized || false;
-        });
-    }
-    /**
-     * Get maximized signal for a container
-     */
-    getMaximizedSignal(containerId) {
-        return computed(() => {
-            const container = this.getContainer(containerId);
-            return container?.isMaximized || false;
-        });
-    }
-    getZIndexSignal(containerId) {
-        return computed(() => {
-            const container = this.getContainer(containerId);
-            const zIndex = container?.zIndex || 1000;
-            console.log(`🎯 [FloatingContainer] Z-index signal for '${containerId}': ${zIndex}`);
-            return zIndex;
-        });
-    }
-    /**
-     * Set z-index for a specific container
-     */
-    setZIndex(containerId, zIndex) {
-        console.log(`🎯 [FloatingContainer] Setting z-index for '${containerId}' to ${zIndex}`);
-        this.containers.update(containers => {
-            const newContainers = new Map(containers);
-            const container = newContainers.get(containerId);
-            if (container) {
-                const oldZIndex = container.zIndex;
-                container.zIndex = zIndex;
-                container.lastAccessed = new Date();
-                newContainers.set(containerId, container);
-                console.log(`🎯 [FloatingContainer] Container '${containerId}' z-index updated: ${oldZIndex} → ${zIndex}`);
-            }
-            else {
-                console.warn(`⚠️ [FloatingContainer] Container '${containerId}' not found for z-index update!`);
+                console.warn(`⚠️ [FloatingContainer] Container '${containerId}' not found for z-index update!`);
             }
             return newContainers;
         });
@@ -4254,7 +3774,7 @@ class CideEleFloatingContainerService {
     onMaximize(containerId) {
         this.maximize(containerId);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleFloatingContainerService, deps: [{ token: i0.Injector }, { token: FloatingContainerShortcutsService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleFloatingContainerService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleFloatingContainerService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideEleFloatingContainerService, decorators: [{
@@ -4262,7 +3782,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i0.Injector }, { type: FloatingContainerShortcutsService }] });
+        }], ctorParameters: () => [{ type: i0.Injector }] });
 
 class CideEleFloatingFileUploaderService {
     containerService = inject(CideEleFloatingContainerService);
@@ -6065,9 +5585,201 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 type: Output
             }] } });
 
-/**
-<!-- Basic horizontal (left-right) layout -->
-<div class="panel-container">
+class KeyboardShortcutService {
+    shortcuts = new Map();
+    overrides = new Map();
+    keydownListener;
+    constructor() {
+        this.setupGlobalListener();
+    }
+    ngOnDestroy() {
+        this.removeGlobalListener();
+    }
+    /**
+     * Register a new keyboard shortcut
+     */
+    register(shortcut) {
+        this.shortcuts.set(shortcut.id, shortcut);
+        console.log(`⌨️ [KeyboardShortcut] Registered shortcut: ${shortcut.id} (${this.getKeyDescription(shortcut)})`);
+    }
+    /**
+     * Override an existing shortcut with new key combination
+     */
+    override(shortcutId, newKey, options) {
+        const originalShortcut = this.shortcuts.get(shortcutId);
+        if (!originalShortcut) {
+            console.warn(`⚠️ [KeyboardShortcut] Cannot override shortcut '${shortcutId}' - not found`);
+            return;
+        }
+        const override = {
+            shortcutId,
+            newKey,
+            newCtrlKey: options?.ctrlKey,
+            newAltKey: options?.altKey,
+            newShiftKey: options?.shiftKey,
+            newMetaKey: options?.metaKey
+        };
+        this.overrides.set(shortcutId, override);
+        console.log(`🔄 [KeyboardShortcut] Override registered for '${shortcutId}': ${this.getKeyDescription({ ...originalShortcut, ...options, key: newKey })}`);
+    }
+    /**
+     * Remove a shortcut
+     */
+    unregister(shortcutId) {
+        this.shortcuts.delete(shortcutId);
+        this.overrides.delete(shortcutId);
+        console.log(`🗑️ [KeyboardShortcut] Removed shortcut: ${shortcutId}`);
+    }
+    /**
+     * Remove override for a shortcut (restore original key combination)
+     */
+    removeOverride(shortcutId) {
+        this.overrides.delete(shortcutId);
+        console.log(`🔄 [KeyboardShortcut] Override removed for: ${shortcutId}`);
+    }
+    /**
+     * Get all registered shortcuts
+     */
+    getAllShortcuts() {
+        return Array.from(this.shortcuts.values());
+    }
+    /**
+     * Get shortcuts by category or filter
+     */
+    getShortcuts(filter) {
+        const shortcuts = this.getAllShortcuts();
+        return filter ? shortcuts.filter(filter) : shortcuts;
+    }
+    /**
+     * Check if a shortcut is registered
+     */
+    hasShortcut(shortcutId) {
+        return this.shortcuts.has(shortcutId);
+    }
+    /**
+     * Get shortcut information
+     */
+    getShortcut(shortcutId) {
+        return this.shortcuts.get(shortcutId);
+    }
+    /**
+     * Clear all shortcuts
+     */
+    clearAll() {
+        this.shortcuts.clear();
+        this.overrides.clear();
+        console.log(`🧹 [KeyboardShortcut] All shortcuts cleared`);
+    }
+    /**
+     * Set up global keyboard listener
+     */
+    setupGlobalListener() {
+        this.keydownListener = (event) => {
+            this.handleKeydown(event);
+        };
+        document.addEventListener('keydown', this.keydownListener);
+        console.log(`🎧 [KeyboardShortcut] Global keyboard listener attached`);
+    }
+    /**
+     * Remove global keyboard listener
+     */
+    removeGlobalListener() {
+        if (this.keydownListener) {
+            document.removeEventListener('keydown', this.keydownListener);
+            this.keydownListener = undefined;
+            console.log(`🎧 [KeyboardShortcut] Global keyboard listener removed`);
+        }
+    }
+    /**
+     * Handle keydown events
+     */
+    handleKeydown(event) {
+        for (const [shortcutId, shortcut] of this.shortcuts) {
+            if (this.matchesShortcut(event, shortcut)) {
+                // Check for override
+                const override = this.overrides.get(shortcutId);
+                if (override && !this.matchesOverride(event, override)) {
+                    continue; // Skip if override doesn't match
+                }
+                if (shortcut.preventDefault !== false) {
+                    event.preventDefault();
+                }
+                if (shortcut.stopPropagation) {
+                    event.stopPropagation();
+                }
+                console.log(`⌨️ [KeyboardShortcut] Executing shortcut: ${shortcutId}`);
+                shortcut.action();
+                break; // Only execute one shortcut per keydown
+            }
+        }
+    }
+    /**
+     * Check if event matches shortcut
+     */
+    matchesShortcut(event, shortcut) {
+        return event.key === shortcut.key &&
+            (shortcut.ctrlKey === undefined || event.ctrlKey === shortcut.ctrlKey) &&
+            (shortcut.altKey === undefined || event.altKey === shortcut.altKey) &&
+            (shortcut.shiftKey === undefined || event.shiftKey === shortcut.shiftKey) &&
+            (shortcut.metaKey === undefined || event.metaKey === shortcut.metaKey);
+    }
+    /**
+     * Check if event matches override
+     */
+    matchesOverride(event, override) {
+        return event.key === override.newKey &&
+            (override.newCtrlKey === undefined || event.ctrlKey === override.newCtrlKey) &&
+            (override.newAltKey === undefined || event.altKey === override.newAltKey) &&
+            (override.newShiftKey === undefined || event.shiftKey === override.newShiftKey) &&
+            (override.newMetaKey === undefined || event.metaKey === override.newMetaKey);
+    }
+    /**
+     * Get human-readable key description
+     */
+    getKeyDescription(shortcut) {
+        const modifiers = [];
+        if (shortcut.ctrlKey)
+            modifiers.push('Ctrl');
+        if (shortcut.altKey)
+            modifiers.push('Alt');
+        if (shortcut.shiftKey)
+            modifiers.push('Shift');
+        if (shortcut.metaKey)
+            modifiers.push('Meta');
+        return [...modifiers, shortcut.key].join(' + ');
+    }
+    /**
+     * Get key description for a shortcut ID
+     */
+    getKeyDescriptionForShortcut(shortcutId) {
+        const shortcut = this.shortcuts.get(shortcutId);
+        if (!shortcut)
+            return 'Not found';
+        const override = this.overrides.get(shortcutId);
+        if (override) {
+            return this.getKeyDescription({
+                key: override.newKey,
+                ctrlKey: override.newCtrlKey,
+                altKey: override.newAltKey,
+                shiftKey: override.newShiftKey,
+                metaKey: override.newMetaKey
+            });
+        }
+        return this.getKeyDescription(shortcut);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: KeyboardShortcutService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+<!-- Basic horizontal (left-right) layout -->
+<div class="panel-container">
     <div class="left-panel">
         Left Panel Content
     </div>
@@ -10654,8 +10366,294 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "20.1.7", ng
   ` }]
             }], ctorParameters: null, propDecorators: null }) });
 
+class FloatingContainerShortcutsService {
+    keyboardShortcutService = inject(KeyboardShortcutService);
+    containerService = inject(CideEleFloatingContainerService);
+    // Z-index layers for different container states
+    Z_INDEX_LAYERS = {
+        HIDDEN: 100, // Hidden containers (behind everything)
+        BACKGROUND: 1000, // Background containers
+        NORMAL: 2000, // Normal visible containers
+        FOCUSED: 3000, // Focused containers
+        MODAL: 4000, // Modal containers
+        TOOLTIP: 5000 // Tooltips and overlays
+    };
+    constructor() {
+        this.registerDefaultShortcuts();
+    }
+    /**
+     * Register default floating container shortcuts
+     */
+    registerDefaultShortcuts() {
+        console.log('🎯 [FloatingContainerShortcuts] Registering default shortcuts');
+        // Alt + 1, Alt + 2, etc. - Focus specific containers
+        this.registerNumberShortcuts();
+        // Alt + N - New container
+        this.keyboardShortcutService.register({
+            id: 'floating-container-new',
+            key: 'n',
+            altKey: true,
+            description: 'Create new floating container',
+            action: () => this.openNewContainer(),
+            preventDefault: true
+        });
+        // Alt + P - Previous container
+        this.keyboardShortcutService.register({
+            id: 'floating-container-previous',
+            key: 'p',
+            altKey: true,
+            description: 'Focus previous container',
+            action: () => this.focusPreviousContainer(),
+            preventDefault: true
+        });
+        // Alt + H - Hide all containers
+        this.keyboardShortcutService.register({
+            id: 'floating-container-hide-all',
+            key: 'h',
+            altKey: true,
+            description: 'Hide all containers',
+            action: () => this.hideAllContainers(),
+            preventDefault: true
+        });
+        // Alt + S - Show all containers
+        this.keyboardShortcutService.register({
+            id: 'floating-container-show-all',
+            key: 's',
+            altKey: true,
+            description: 'Show all containers',
+            action: () => this.showAllContainers(),
+            preventDefault: true
+        });
+        // Alt + M - Minimize all containers
+        this.keyboardShortcutService.register({
+            id: 'floating-container-minimize-all',
+            key: 'm',
+            altKey: true,
+            description: 'Minimize all containers',
+            action: () => this.minimizeAllContainers(),
+            preventDefault: true
+        });
+        // Alt + W - Close current container
+        this.keyboardShortcutService.register({
+            id: 'floating-container-close-current',
+            key: 'w',
+            altKey: true,
+            description: 'Close current container',
+            action: () => this.closeCurrentContainer(),
+            preventDefault: true
+        });
+        // Alt + D - Duplicate current container
+        this.keyboardShortcutService.register({
+            id: 'floating-container-duplicate',
+            key: 'd',
+            altKey: true,
+            description: 'Duplicate current container',
+            action: () => this.duplicateCurrentContainer(),
+            preventDefault: true
+        });
+        // Alt + T - Toggle container visibility
+        this.keyboardShortcutService.register({
+            id: 'floating-container-toggle-visibility',
+            key: 't',
+            altKey: true,
+            description: 'Toggle container visibility',
+            action: () => this.toggleContainerVisibility(),
+            preventDefault: true
+        });
+        // Alt + O - Open file uploader
+        this.keyboardShortcutService.register({
+            id: 'floating-container-open-file-uploader',
+            key: 'o',
+            altKey: true,
+            description: 'Open file uploader',
+            action: () => this.openFileUploader(),
+            preventDefault: true
+        });
+        // Alt + R - Open entity rights sharing
+        this.keyboardShortcutService.register({
+            id: 'floating-container-open-entity-rights',
+            key: 'r',
+            altKey: true,
+            description: 'Open entity rights sharing',
+            action: () => this.openEntityRightsSharing(),
+            preventDefault: true
+        });
+        console.log('✅ [FloatingContainerShortcuts] Default shortcuts registered');
+    }
+    /**
+     * Register number shortcuts (Alt + 1, Alt + 2, etc.)
+     */
+    registerNumberShortcuts() {
+        for (let i = 1; i <= 9; i++) {
+            this.keyboardShortcutService.register({
+                id: `floating-container-focus-${i}`,
+                key: i.toString(),
+                altKey: true,
+                description: `Focus container ${i}`,
+                action: () => this.focusContainerByIndex(i - 1),
+                preventDefault: true
+            });
+        }
+    }
+    /**
+     * Open new floating container
+     */
+    openNewContainer() {
+        console.log('🎯 [FloatingContainerShortcuts] Opening new container');
+        const containerId = this.containerService.show({
+            id: 'new-container-' + Date.now(),
+            title: 'New Container',
+            width: '400px',
+            height: '300px'
+        });
+        console.log('✅ [FloatingContainerShortcuts] New container created:', containerId);
+    }
+    /**
+     * Focus previous container
+     */
+    focusPreviousContainer() {
+        console.log('🎯 [FloatingContainerShortcuts] Focusing previous container');
+        const containers = this.containerService.visibleContainers();
+        if (containers.length > 0) {
+            // For now, just focus the last container
+            const previousIndex = containers.length - 1;
+            this.containerService.bringToFront(containers[previousIndex].id);
+        }
+    }
+    /**
+     * Hide all containers
+     */
+    hideAllContainers() {
+        console.log('🎯 [FloatingContainerShortcuts] Hiding all containers');
+        const containers = this.containerService.visibleContainers();
+        containers.forEach(container => {
+            this.containerService.setZIndex(container.id, this.Z_INDEX_LAYERS.HIDDEN);
+        });
+        console.log('✅ [FloatingContainerShortcuts] All containers hidden');
+    }
+    /**
+     * Show all containers
+     */
+    showAllContainers() {
+        console.log('🎯 [FloatingContainerShortcuts] Showing all containers');
+        const containers = this.containerService.visibleContainers();
+        containers.forEach((container, index) => {
+            this.containerService.setZIndex(container.id, this.Z_INDEX_LAYERS.NORMAL + index);
+        });
+        console.log('✅ [FloatingContainerShortcuts] All containers shown');
+    }
+    /**
+     * Minimize all containers
+     */
+    minimizeAllContainers() {
+        console.log('🎯 [FloatingContainerShortcuts] Minimizing all containers');
+        const containers = this.containerService.visibleContainers();
+        containers.forEach(container => {
+            // Implement minimize logic here
+            console.log('📦 [FloatingContainerShortcuts] Minimizing container:', container.id);
+        });
+        console.log('✅ [FloatingContainerShortcuts] All containers minimized');
+    }
+    /**
+     * Focus container by index
+     */
+    focusContainerByIndex(index) {
+        console.log('🎯 [FloatingContainerShortcuts] Focusing container at index:', index);
+        const containers = this.containerService.visibleContainers();
+        if (containers[index]) {
+            this.containerService.bringToFront(containers[index].id);
+            console.log('✅ [FloatingContainerShortcuts] Container focused:', containers[index].id);
+        }
+        else {
+            console.warn('⚠️ [FloatingContainerShortcuts] Container not found at index:', index);
+        }
+    }
+    /**
+     * Open file uploader
+     */
+    openFileUploader() {
+        console.log('🎯 [FloatingContainerShortcuts] Opening file uploader');
+        // Implement file uploader opening logic here
+        console.log('✅ [FloatingContainerShortcuts] File uploader opened');
+    }
+    /**
+     * Open entity rights sharing
+     */
+    openEntityRightsSharing() {
+        console.log('🎯 [FloatingContainerShortcuts] Opening entity rights sharing');
+        // Implement entity rights sharing opening logic here
+        console.log('✅ [FloatingContainerShortcuts] Entity rights sharing opened');
+    }
+    /**
+     * Duplicate current container
+     */
+    duplicateCurrentContainer() {
+        console.log('🎯 [FloatingContainerShortcuts] Duplicating current container');
+        const containers = this.containerService.visibleContainers();
+        if (containers.length > 0) {
+            const containerToDuplicate = containers[containers.length - 1]; // Use last container
+            const newContainerId = this.containerService.show({
+                id: 'duplicate-' + Date.now(),
+                title: `${containerToDuplicate.config.title} (Copy)`,
+                width: containerToDuplicate.config.width,
+                height: containerToDuplicate.config.height
+            });
+            console.log('✅ [FloatingContainerShortcuts] Container duplicated:', newContainerId);
+        }
+        else {
+            console.warn('⚠️ [FloatingContainerShortcuts] No container to duplicate');
+        }
+    }
+    /**
+     * Close current container
+     */
+    closeCurrentContainer() {
+        console.log('🎯 [FloatingContainerShortcuts] Closing current container');
+        const containers = this.containerService.visibleContainers();
+        if (containers.length > 0) {
+            const containerToClose = containers[containers.length - 1]; // Use last container
+            this.containerService.hide(containerToClose.id);
+            console.log('✅ [FloatingContainerShortcuts] Container closed:', containerToClose.id);
+        }
+        else {
+            console.warn('⚠️ [FloatingContainerShortcuts] No container to close');
+        }
+    }
+    /**
+     * Toggle container visibility
+     */
+    toggleContainerVisibility() {
+        console.log('🎯 [FloatingContainerShortcuts] Toggling container visibility');
+        const containers = this.containerService.visibleContainers();
+        if (containers.length > 0) {
+            const containerToToggle = containers[containers.length - 1]; // Use last container
+            const currentZIndex = this.containerService.getZIndexSignal(containerToToggle.id)();
+            if (currentZIndex === this.Z_INDEX_LAYERS.HIDDEN) {
+                this.containerService.setZIndex(containerToToggle.id, this.Z_INDEX_LAYERS.NORMAL);
+                console.log('✅ [FloatingContainerShortcuts] Container shown:', containerToToggle.id);
+            }
+            else {
+                this.containerService.setZIndex(containerToToggle.id, this.Z_INDEX_LAYERS.HIDDEN);
+                console.log('✅ [FloatingContainerShortcuts] Container hidden:', containerToToggle.id);
+            }
+        }
+        else {
+            console.warn('⚠️ [FloatingContainerShortcuts] No container to toggle');
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FloatingContainerShortcutsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
 class CideEleFloatingFeaturesService {
     containerService = inject(CideEleFloatingContainerService);
+    shortcutsService = inject(FloatingContainerShortcutsService);
     constructor() {
         // File uploader is handled by its own dedicated service
         // Entity rights sharing is handled by its own dedicated service