cloud-ide-layout 1.0.23 → 1.0.25

package/fesm2022/{cloud-ide-layout-cloud-ide-layout-urOTUFvE.mjs → cloud-ide-layout-cloud-ide-layout-B7zJJ9zM.mjs}

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, inject, signal, computed, effect, Component, ElementRef, HostListener, ViewContainerRef, ViewChild, ViewChildren, InjectionToken, PLATFORM_ID } from '@angular/core';
+import { Injectable, inject, signal, computed, effect, Component, ElementRef, HostListener, ViewContainerRef, ViewChild, ViewChildren, InjectionToken, PLATFORM_ID, EventEmitter, Output, Input } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { cidePath, hostManagerRoutesUrl, coreRoutesUrl, commonRoutesUrl, designConfigRoutesUrl } from 'cloud-ide-lms-model';
 import { Observable, throwError, of, BehaviorSubject, interval, take as take$1 } from 'rxjs';
@@ -7,12 +7,14 @@ import { map, filter, tap, catchError, shareReplay, take, distinctUntilChanged }
 import * as i2 from '@angular/router';
 import { Router, NavigationEnd, RouteReuseStrategy, RouterModule } from '@angular/router';
 import { Title } from '@angular/platform-browser';
-import { CideEleFileManagerService, CideElementsService, CideInputComponent, CideIconComponent, CideEleDropdownComponent, CideEleResizerDirective, TooltipDirective, CideSpinnerComponent, CideEleSkeletonLoaderComponent } from 'cloud-ide-element';
+import { CideEleFileManagerService, CideElementsService, CideInputComponent, CideIconComponent, CideEleDropdownComponent, CideEleResizerDirective, TooltipDirective, CideSpinnerComponent, CideEleSkeletonLoaderComponent, CideEleFloatingContainerManagerComponent, CideEleGlobalNotificationsComponent, CideEleButtonComponent, CideEleFloatingContainerService } from 'cloud-ide-element';
 import * as i1 from '@angular/common';
 import { CommonModule, NgClass, NgFor, NgIf, isPlatformBrowser } from '@angular/common';
 import { CloudIdeAuthService, authGuard } from 'cloud-ide-auth';
 import { trigger, state, transition, style, animate } from '@angular/animations';
 import { merge } from 'lodash';
+import * as i2$1 from '@angular/forms';
+import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
 
 class CloudIdeLayoutService {
     constructor() { }
@@ -2651,8 +2653,8 @@ class CideLytSidedrawerWrapperComponent {
     }
     ngOnInit() {
         // Initialize the component map (You'd likely populate this from a config or service)
-        this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-B4p_uGox.mjs').then(m => m.CideLytSidedrawerNotesComponent);
-        this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-B-VlqH0O.mjs').then(m => m.CideLytDrawerThemeComponent);
+        this.componentMap['drowar_notes'] = () => import('./cloud-ide-layout-sidedrawer-notes.component-OKwCnhEf.mjs').then(m => m.CideLytSidedrawerNotesComponent);
+        this.componentMap['drawer_theme'] = () => import('./cloud-ide-layout-drawer-theme.component-gmPE1a4W.mjs').then(m => m.CideLytDrawerThemeComponent);
     }
     async loadComponent(configFor) {
         console.log('🔍 SIDEDRAWER - Loading component:', configFor, 'Current tab:', this.currentTabId);
@@ -2996,15 +2998,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
 
 class CloudIdeLayoutComponent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CloudIdeLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CloudIdeLayoutComponent, isStandalone: true, selector: "cide-lyt-wrapper", ngImport: i0, template: `
-    <cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
-  `, isInline: true, styles: [""], dependencies: [{ kind: "component", type: CideLytLayoutWrapperComponent, selector: "cide-lyt-layout-wrapper" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CloudIdeLayoutComponent, isStandalone: true, selector: "cide-lyt-wrapper", ngImport: i0, template: `
+    <cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
+    
+    <!-- Floating Container Manager -->
+    <cide-ele-floating-container-manager></cide-ele-floating-container-manager>
+    
+    <!-- Global Notifications and Confirmation Dialogs -->
+    <cide-ele-global-notifications></cide-ele-global-notifications>
+  `, isInline: true, styles: [""], dependencies: [{ kind: "component", type: CideLytLayoutWrapperComponent, selector: "cide-lyt-layout-wrapper" }, { kind: "component", type: CideEleFloatingContainerManagerComponent, selector: "cide-ele-floating-container-manager" }, { kind: "component", type: CideEleGlobalNotificationsComponent, selector: "cide-ele-global-notifications" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CloudIdeLayoutComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cide-lyt-wrapper', standalone: true, template: `
-    <cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
-  `, imports: [CideLytLayoutWrapperComponent] }]
+            args: [{ selector: 'cide-lyt-wrapper', standalone: true, template: `
+    <cide-lyt-layout-wrapper></cide-lyt-layout-wrapper>
+    
+    <!-- Floating Container Manager -->
+    <cide-ele-floating-container-manager></cide-ele-floating-container-manager>
+    
+    <!-- Global Notifications and Confirmation Dialogs -->
+    <cide-ele-global-notifications></cide-ele-global-notifications>
+  `, imports: [
+                        CideLytLayoutWrapperComponent,
+                        CideEleFloatingContainerManagerComponent,
+                        CideEleGlobalNotificationsComponent
+                    ] }]
         }] });
 
 var cloudIdeLayout_component = /*#__PURE__*/Object.freeze({
@@ -3024,7 +3042,7 @@ const layoutControlPannelChildRoutes = [{
     },
     {
         path: "home",
-        loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-DtB5EqE3.mjs').then(c => c.CideLytHomeWrapperComponent),
+        loadComponent: () => import('./cloud-ide-layout-home-wrapper.component-iPkvBOgE.mjs').then(c => c.CideLytHomeWrapperComponent),
         canActivate: [authGuard],
         data: {
             reuseTab: true, // For CustomRouteReuseStrategy
@@ -3281,13 +3299,508 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 }]
         }] });
 
+class CideLytFloatingEntityRightsSharingComponent {
+    data;
+    close = new EventEmitter();
+    save = new EventEmitter();
+    fb = inject(FormBuilder);
+    // State signals
+    entities = signal([], ...(ngDevMode ? [{ debugName: "entities" }] : []));
+    selectedEntityId = signal('', ...(ngDevMode ? [{ debugName: "selectedEntityId" }] : []));
+    entitiesLoading = signal(false, ...(ngDevMode ? [{ debugName: "entitiesLoading" }] : []));
+    accessPassLoading = signal(false, ...(ngDevMode ? [{ debugName: "accessPassLoading" }] : []));
+    saving = signal(false, ...(ngDevMode ? [{ debugName: "saving" }] : []));
+    // Form
+    rightsForm;
+    ngOnInit() {
+        this.initializeForm();
+        this.loadEntities();
+    }
+    initializeForm() {
+        this.rightsForm = this.fb.group({
+            can_view: [false],
+            can_edit: [false],
+            is_owner: [false],
+            syepm_isactive: [true]
+        });
+    }
+    async loadEntities() {
+        this.entitiesLoading.set(true);
+        try {
+            // Mock data for now
+            const mockEntities = [
+                {
+                    _id: 'owner-entity',
+                    syen_name: 'Owner Entity',
+                    syen_entity_code: 'E001',
+                    syen_isactive: true
+                },
+                {
+                    _id: 'entity-1',
+                    syen_name: 'Entity 1',
+                    syen_entity_code: 'E002',
+                    syen_isactive: true
+                },
+                {
+                    _id: 'entity-2',
+                    syen_name: 'Entity 2',
+                    syen_entity_code: 'E003',
+                    syen_isactive: true
+                }
+            ];
+            this.entities.set(mockEntities);
+        }
+        catch (error) {
+            console.error('Error loading entities:', error);
+        }
+        finally {
+            this.entitiesLoading.set(false);
+        }
+    }
+    selectEntity(entityId) {
+        this.selectedEntityId.set(entityId);
+        this.loadAccessPassData();
+    }
+    async loadAccessPassData() {
+        if (!this.selectedEntityId())
+            return;
+        this.accessPassLoading.set(true);
+        try {
+            // Mock data for now
+            await new Promise(resolve => setTimeout(resolve, 500));
+            // Set form values based on mock data
+            this.rightsForm.patchValue({
+                can_view: true,
+                can_edit: false,
+                is_owner: this.selectedEntityId() === 'owner-entity',
+                syepm_isactive: true
+            });
+        }
+        catch (error) {
+            console.error('Error loading access pass data:', error);
+        }
+        finally {
+            this.accessPassLoading.set(false);
+        }
+    }
+    async saveRights() {
+        if (this.rightsForm.invalid)
+            return;
+        this.saving.set(true);
+        try {
+            const formValue = this.rightsForm.value;
+            console.log('Saving rights:', formValue);
+            // TODO: Replace with actual API call
+            await new Promise(resolve => setTimeout(resolve, 1000));
+            console.log('Rights saved successfully');
+            this.save.emit(formValue);
+        }
+        catch (error) {
+            console.error('Error saving rights:', error);
+        }
+        finally {
+            this.saving.set(false);
+        }
+    }
+    onCancel() {
+        this.close.emit();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytFloatingEntityRightsSharingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideLytFloatingEntityRightsSharingComponent, isStandalone: true, selector: "cide-lyt-floating-entity-rights-sharing", inputs: { data: "data" }, outputs: { close: "close", save: "save" }, ngImport: i0, template: `
+    <!-- Entity Rights Sharing Content -->
+    <div class="tw-p-4 tw-overflow-y-auto tw-max-h-[calc(80vh-120px)] tw-scrollbar-thin tw-scrollbar-thumb-gray-300 tw-scrollbar-track-transparent tw-select-none">
+      <!-- Entity Selection -->
+      <div class="tw-mb-4">
+        
+        @if (entitiesLoading()) {
+        <div class="tw-flex tw-items-center tw-justify-center tw-py-6">
+          <cide-ele-spinner size="sm"></cide-ele-spinner>
+          <span class="tw-ml-3 tw-text-gray-600 tw-text-sm">Loading entities...</span>
+        </div>
+        } @else if (entities().length === 0) {
+        <div class="tw-text-center tw-py-6">
+          <div class="tw-w-10 tw-h-10 tw-bg-gray-100 tw-rounded-xl tw-flex tw-items-center tw-justify-center tw-mx-auto tw-mb-2">
+            <cide-ele-icon class="tw-w-5 tw-h-5 tw-text-gray-400">business</cide-ele-icon>
+          </div>
+          <p class="tw-text-gray-500 tw-text-sm">No entities available</p>
+        </div>
+        } @else {
+        <div class="tw-space-y-2">
+          @defer (when entities().length > 0) {
+            @for (entity of entities(); track entity._id || entity.syen_name) {
+            <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-border tw-border-gray-200 tw-border-opacity-50 tw-rounded-xl tw-p-3 tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-shadow-md hover:tw-border-blue-300 hover:tw-border-opacity-50 hover:tw-scale-[1.01] tw-group tw-select-none"
+              [class.tw-border-blue-500]="selectedEntityId() === entity._id"
+              [class.tw-bg-blue-50]="selectedEntityId() === entity._id"
+              (click)="selectEntity(entity._id || '')">
+              <div class="tw-flex tw-items-start tw-space-x-3">
+                <div class="tw-w-6 tw-h-6 tw-bg-gray-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center tw-flex-shrink-0">
+                  <cide-ele-icon class="tw-text-gray-600">person</cide-ele-icon>
+                </div>
+                <div class="tw-flex-1 tw-min-w-0">
+                  <div class="tw-flex tw-items-center tw-space-x-2 tw-mb-1">
+                    <h4 class="tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate">{{ entity.syen_name }}</h4>
+                    @if (entity._id === 'owner-entity') {
+                    <div class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-space-x-1">
+                      <cide-ele-icon>admin_panel_settings</cide-ele-icon>
+                      <span>Owner</span>
+                    </div>
+                    }
+                  </div>
+                  <div class="tw-flex tw-items-center tw-space-x-3">
+                    <div class="tw-flex tw-items-center tw-space-x-1">
+                      <cide-ele-icon class="tw-text-gray-400">visibility</cide-ele-icon>
+                      <span class="tw-text-xs tw-text-gray-500">View</span>
+                    </div>
+                    <div class="tw-flex tw-items-center tw-space-x-1">
+                      <cide-ele-icon class="tw-text-gray-400">edit</cide-ele-icon>
+                      <span class="tw-text-xs tw-text-gray-500">Edit</span>
+                    </div>
+                  </div>
+                </div>
+                @if (selectedEntityId() === entity._id) {
+                <div class="tw-w-4 tw-h-4 tw-bg-green-500 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-flex-shrink-0">
+                  <cide-ele-icon class="tw-text-white">done</cide-ele-icon>
+                </div>
+                }
+              </div>
+            </div>
+            }
+          } @placeholder {
+            <div class="tw-flex tw-items-center tw-justify-center tw-py-4">
+              <cide-ele-spinner size="sm"></cide-ele-spinner>
+              <span class="tw-ml-2 tw-text-sm tw-text-gray-600">Loading entities...</span>
+            </div>
+          }
+        </div>
+        }
+      </div>
+
+      <!-- Rights Management -->
+      @if (selectedEntityId()) {
+      <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-border tw-border-gray-200 tw-border-opacity-50 tw-rounded-xl tw-p-3 tw-shadow-sm">
+        <div class="tw-flex tw-items-center tw-space-x-2 tw-mb-3">
+          <cide-ele-icon class="tw-text-green-600">security</cide-ele-icon>
+          <h3 class="tw-text-sm tw-font-semibold tw-text-gray-900">Manage Rights</h3>
+        </div>
+        
+        @if (accessPassLoading()) {
+        <div class="tw-flex tw-items-center tw-justify-center tw-min-h-[80px]">
+          <cide-ele-spinner size="sm"></cide-ele-spinner>
+          <span class="tw-ml-3 tw-text-gray-600 tw-text-sm">Loading...</span>
+        </div>
+        } @else {
+        @defer (when !accessPassLoading()) {
+          <form [formGroup]="rightsForm" (ngSubmit)="saveRights()">
+            <div class="tw-flex tw-flex-wrap tw-gap-3 tw-min-h-[80px] tw-items-center">
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="can_view" 
+                  label="View">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="can_edit" 
+                  label="Edit">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="is_owner" 
+                  label="Is Owner">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="syepm_isactive" 
+                  label="Is Active">
+                </cide-ele-input>
+              </div>
+            </div>
+          </form>
+        } @placeholder {
+          <div class="tw-flex tw-items-center tw-justify-center tw-min-h-[80px]">
+            <cide-ele-spinner size="sm"></cide-ele-spinner>
+            <span class="tw-ml-2 tw-text-sm tw-text-gray-600">Loading rights...</span>
+          </div>
+        }
+        }
+      </div>
+      }
+    </div>
+
+    <!-- Footer -->
+    <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-px-4 tw-py-3 tw-border-t tw-border-gray-200 tw-border-opacity-30 tw-flex tw-justify-end tw-space-x-2">
+      <button cideEleButton variant="secondary" size="xs" type="button" (click)="onCancel()">
+        Cancel
+      </button>
+      @if (selectedEntityId()) {
+      <button cideEleButton variant="primary" size="xs" type="button" (click)="saveRights()" 
+        [disabled]="rightsForm.invalid || saving()" [loading]="saving()">
+        {{ saving() ? 'Saving...' : 'Save' }}
+      </button>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSpinnerComponent, selector: "cide-ele-spinner", inputs: ["size", "type"] }], deferBlockDependencies: [() => [CideIconComponent], () => [i2$1.ɵNgNoValidate, i2$1.NgControlStatus, i2$1.NgControlStatusGroup, i2$1.FormGroupDirective, i2$1.FormControlName, CideInputComponent]] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytFloatingEntityRightsSharingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cide-lyt-floating-entity-rights-sharing', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        CideEleButtonComponent,
+                        CideInputComponent,
+                        CideIconComponent,
+                        CideSpinnerComponent
+                    ], template: `
+    <!-- Entity Rights Sharing Content -->
+    <div class="tw-p-4 tw-overflow-y-auto tw-max-h-[calc(80vh-120px)] tw-scrollbar-thin tw-scrollbar-thumb-gray-300 tw-scrollbar-track-transparent tw-select-none">
+      <!-- Entity Selection -->
+      <div class="tw-mb-4">
+        
+        @if (entitiesLoading()) {
+        <div class="tw-flex tw-items-center tw-justify-center tw-py-6">
+          <cide-ele-spinner size="sm"></cide-ele-spinner>
+          <span class="tw-ml-3 tw-text-gray-600 tw-text-sm">Loading entities...</span>
+        </div>
+        } @else if (entities().length === 0) {
+        <div class="tw-text-center tw-py-6">
+          <div class="tw-w-10 tw-h-10 tw-bg-gray-100 tw-rounded-xl tw-flex tw-items-center tw-justify-center tw-mx-auto tw-mb-2">
+            <cide-ele-icon class="tw-w-5 tw-h-5 tw-text-gray-400">business</cide-ele-icon>
+          </div>
+          <p class="tw-text-gray-500 tw-text-sm">No entities available</p>
+        </div>
+        } @else {
+        <div class="tw-space-y-2">
+          @defer (when entities().length > 0) {
+            @for (entity of entities(); track entity._id || entity.syen_name) {
+            <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-border tw-border-gray-200 tw-border-opacity-50 tw-rounded-xl tw-p-3 tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-shadow-md hover:tw-border-blue-300 hover:tw-border-opacity-50 hover:tw-scale-[1.01] tw-group tw-select-none"
+              [class.tw-border-blue-500]="selectedEntityId() === entity._id"
+              [class.tw-bg-blue-50]="selectedEntityId() === entity._id"
+              (click)="selectEntity(entity._id || '')">
+              <div class="tw-flex tw-items-start tw-space-x-3">
+                <div class="tw-w-6 tw-h-6 tw-bg-gray-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center tw-flex-shrink-0">
+                  <cide-ele-icon class="tw-text-gray-600">person</cide-ele-icon>
+                </div>
+                <div class="tw-flex-1 tw-min-w-0">
+                  <div class="tw-flex tw-items-center tw-space-x-2 tw-mb-1">
+                    <h4 class="tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate">{{ entity.syen_name }}</h4>
+                    @if (entity._id === 'owner-entity') {
+                    <div class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-space-x-1">
+                      <cide-ele-icon>admin_panel_settings</cide-ele-icon>
+                      <span>Owner</span>
+                    </div>
+                    }
+                  </div>
+                  <div class="tw-flex tw-items-center tw-space-x-3">
+                    <div class="tw-flex tw-items-center tw-space-x-1">
+                      <cide-ele-icon class="tw-text-gray-400">visibility</cide-ele-icon>
+                      <span class="tw-text-xs tw-text-gray-500">View</span>
+                    </div>
+                    <div class="tw-flex tw-items-center tw-space-x-1">
+                      <cide-ele-icon class="tw-text-gray-400">edit</cide-ele-icon>
+                      <span class="tw-text-xs tw-text-gray-500">Edit</span>
+                    </div>
+                  </div>
+                </div>
+                @if (selectedEntityId() === entity._id) {
+                <div class="tw-w-4 tw-h-4 tw-bg-green-500 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-flex-shrink-0">
+                  <cide-ele-icon class="tw-text-white">done</cide-ele-icon>
+                </div>
+                }
+              </div>
+            </div>
+            }
+          } @placeholder {
+            <div class="tw-flex tw-items-center tw-justify-center tw-py-4">
+              <cide-ele-spinner size="sm"></cide-ele-spinner>
+              <span class="tw-ml-2 tw-text-sm tw-text-gray-600">Loading entities...</span>
+            </div>
+          }
+        </div>
+        }
+      </div>
+
+      <!-- Rights Management -->
+      @if (selectedEntityId()) {
+      <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-border tw-border-gray-200 tw-border-opacity-50 tw-rounded-xl tw-p-3 tw-shadow-sm">
+        <div class="tw-flex tw-items-center tw-space-x-2 tw-mb-3">
+          <cide-ele-icon class="tw-text-green-600">security</cide-ele-icon>
+          <h3 class="tw-text-sm tw-font-semibold tw-text-gray-900">Manage Rights</h3>
+        </div>
+        
+        @if (accessPassLoading()) {
+        <div class="tw-flex tw-items-center tw-justify-center tw-min-h-[80px]">
+          <cide-ele-spinner size="sm"></cide-ele-spinner>
+          <span class="tw-ml-3 tw-text-gray-600 tw-text-sm">Loading...</span>
+        </div>
+        } @else {
+        @defer (when !accessPassLoading()) {
+          <form [formGroup]="rightsForm" (ngSubmit)="saveRights()">
+            <div class="tw-flex tw-flex-wrap tw-gap-3 tw-min-h-[80px] tw-items-center">
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="can_view" 
+                  label="View">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="can_edit" 
+                  label="Edit">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="is_owner" 
+                  label="Is Owner">
+                </cide-ele-input>
+              </div>
+              
+              <div class="tw-flex tw-items-center tw-space-x-2">
+                <cide-ele-input 
+                  type="checkbox" 
+                  formControlName="syepm_isactive" 
+                  label="Is Active">
+                </cide-ele-input>
+              </div>
+            </div>
+          </form>
+        } @placeholder {
+          <div class="tw-flex tw-items-center tw-justify-center tw-min-h-[80px]">
+            <cide-ele-spinner size="sm"></cide-ele-spinner>
+            <span class="tw-ml-2 tw-text-sm tw-text-gray-600">Loading rights...</span>
+          </div>
+        }
+        }
+      </div>
+      }
+    </div>
+
+    <!-- Footer -->
+    <div class="tw-bg-white tw-bg-opacity-80 tw-backdrop-blur-sm tw-px-4 tw-py-3 tw-border-t tw-border-gray-200 tw-border-opacity-30 tw-flex tw-justify-end tw-space-x-2">
+      <button cideEleButton variant="secondary" size="xs" type="button" (click)="onCancel()">
+        Cancel
+      </button>
+      @if (selectedEntityId()) {
+      <button cideEleButton variant="primary" size="xs" type="button" (click)="saveRights()" 
+        [disabled]="rightsForm.invalid || saving()" [loading]="saving()">
+        {{ saving() ? 'Saving...' : 'Save' }}
+      </button>
+      }
+    </div>
+  ` }]
+        }], propDecorators: { data: [{
+                type: Input
+            }], close: [{
+                type: Output
+            }], save: [{
+                type: Output
+            }] } });
+
+var floatingEntityRightsSharing_component = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    CideLytFloatingEntityRightsSharingComponent: CideLytFloatingEntityRightsSharingComponent
+});
+
+class CideLytFloatingEntityRightsSharingService {
+    containerService = inject(CideEleFloatingContainerService);
+    /**
+     * Show entity rights sharing in floating container
+     */
+    async show(data) {
+        console.log('🚀 Showing entity rights sharing...');
+        console.log('📋 Current registered components:', this.containerService.getRegisteredComponentIds());
+        // Lazy registration - only register if not already registered
+        if (!this.containerService.isComponentRegistered('entity-rights-sharing')) {
+            console.log('📝 Registering entity rights sharing component...');
+            await this.registerEntityRightsSharingComponent();
+            console.log('📋 Components after registration:', this.containerService.getRegisteredComponentIds());
+        }
+        else {
+            console.log('✅ Entity rights sharing component already registered');
+        }
+        const config = {
+            id: 'entity-rights-sharing-main',
+            title: 'Entity Rights Sharing',
+            icon: 'share',
+            width: '450px',
+            height: '500px',
+            minWidth: '400px',
+            minHeight: '400px',
+            resizable: true,
+            draggable: true,
+            closable: true,
+            minimizable: true,
+            maximizable: true,
+            componentId: 'entity-rights-sharing',
+            componentConfig: {
+                inputs: data ? { data } : undefined
+            }
+        };
+        const containerId = this.containerService.show(config);
+        console.log('✅ Container created with ID:', containerId);
+        return containerId;
+    }
+    /**
+     * Hide entity rights sharing
+     */
+    hide() {
+        this.containerService.hide('entity-rights-sharing-main');
+    }
+    /**
+     * Register the entity rights sharing component
+     */
+    async registerEntityRightsSharingComponent() {
+        try {
+            console.log('📦 Importing entity rights sharing component...');
+            const module = await Promise.resolve().then(function () { return floatingEntityRightsSharing_component; });
+            console.log('📦 Module imported:', module);
+            console.log('📦 Component class:', module.CideLytFloatingEntityRightsSharingComponent);
+            if (!module.CideLytFloatingEntityRightsSharingComponent) {
+                throw new Error('Component class not found in module');
+            }
+            this.containerService.registerComponent('entity-rights-sharing', module.CideLytFloatingEntityRightsSharingComponent);
+            console.log('✅ Entity rights sharing component registered successfully');
+            console.log('📋 Available components after registration:', this.containerService.getRegisteredComponentIds());
+        }
+        catch (error) {
+            console.error('❌ Failed to register entity rights sharing component:', error);
+            console.error('❌ Error details:', error);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CideLytFloatingEntityRightsSharingService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
 /*
  * Public API Surface of cloud-ide-layout
  */
+// Floating Container (moved to cloud-ide-element)
+// export * from './lib/components/floating-container';
+// Layout Components
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { AppStateHelperService as A, CideLytSharedWrapperComponent as C, ENVIRONMENT_CONFIG as E, CideLytSidebarService as a, CideLytRequestService as b, CideLytSidedrawerService as c, CideLytThemeService as d, CloudIdeLayoutService as e, CloudIdeLayoutComponent as f, CideLytSharedService as g, layoutControlPannelChildRoutes as h, CustomRouteReuseStrategy as i, AppStateService as j, CideLytUserStatusService as k, layoutRoutes as l, CacheManagerService as m, CideLytFileManagerService as n, processThemeVariable as p, setCSSVariable as s, themeFactory as t };
-//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-urOTUFvE.mjs.map
+export { AppStateHelperService as A, CideLytSharedWrapperComponent as C, ENVIRONMENT_CONFIG as E, CideLytSidebarService as a, CideLytRequestService as b, CideLytSidedrawerService as c, CideLytThemeService as d, CloudIdeLayoutService as e, CloudIdeLayoutComponent as f, CideLytSharedService as g, layoutControlPannelChildRoutes as h, CustomRouteReuseStrategy as i, AppStateService as j, CideLytUserStatusService as k, layoutRoutes as l, CacheManagerService as m, CideLytFileManagerService as n, CideLytFloatingEntityRightsSharingComponent as o, processThemeVariable as p, CideLytFloatingEntityRightsSharingService as q, setCSSVariable as s, themeFactory as t };
+//# sourceMappingURL=cloud-ide-layout-cloud-ide-layout-B7zJJ9zM.mjs.map