@acorex/cdk 21.0.0-next52 → 21.0.1-next.1

package/full-screen/index.d.ts

@@ -0,0 +1,64 @@
+import * as i0 from '@angular/core';
+
+/**
+ * Fullscreen directive that provides CSS-based fullscreen functionality
+ * Usage: <element axFullscreen #fullscreen="axFullscreen"></element>
+ * Then: fullscreen.toggle() or fullscreen.enter() or fullscreen.exit()
+ */
+declare class AXFullScreenDirective {
+    /**
+     * Current fullscreen state
+     */
+    private readonly isFullscreenState;
+    /**
+     * Original element styles to restore
+     */
+    private originalStyles;
+    /**
+     * Original parent element reference
+     */
+    private originalParent;
+    /**
+     * Fullscreen container element
+     */
+    private fullscreenContainer;
+    /**
+     * Fullscreen change event
+     */
+    readonly fullscreenChange: i0.OutputEmitterRef<boolean>;
+    private readonly renderer;
+    private readonly elementRef;
+    constructor();
+    /**
+     * Toggle fullscreen state
+     */
+    toggle(): void;
+    /**
+     * Enter fullscreen mode using CSS
+     */
+    enter(): void;
+    /**
+     * Exit fullscreen mode
+     */
+    exit(): void;
+    /**
+     * Check if currently in fullscreen mode
+     */
+    isFullscreen(): boolean;
+    /**
+     * Store original element styles
+     */
+    private storeOriginalStyles;
+    /**
+     * Restore original element styles
+     */
+    private restoreOriginalStyles;
+    /**
+     * Convert camelCase to kebab-case for CSS properties
+     */
+    private camelToKebabCase;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXFullScreenDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AXFullScreenDirective, "[axFullscreen]", ["axFullscreen"], {}, { "fullscreenChange": "fullscreenChange"; }, never, never, true, never>;
+}
+
+export { AXFullScreenDirective };

package/overlay/index.d.ts

@@ -1,10 +1,33 @@
 import { AXComponentOptions, AXComponentContent } from '@acorex/core/components';
-import { AXPlacement } from '@acorex/cdk/common';
+import { AXPlacement, AXPlacementType, AXConnectedPosition } from '@acorex/cdk/common';
+import { AXZToken } from '@acorex/core/z-index';
 import * as i0 from '@angular/core';
-import { EmbeddedViewRef, ComponentRef } from '@angular/core';
+import { ElementRef, EmbeddedViewRef, ComponentRef } from '@angular/core';
 
 interface AXOverlayRef<T> {
     instance: EmbeddedViewRef<T> | ComponentRef<T>;
+    /** Updates the overlay position relative to the anchor */
+    updatePosition: () => void;
+    /** Destroys the overlay and removes it from the DOM */
+    dispose: () => void;
+    /** The overlay container element */
+    overlayElement: HTMLElement | null;
+    /** The z-index token for this overlay */
+    zToken: AXZToken | null;
+    /** Brings this overlay to the front of all other overlays */
+    bringToFront: () => void;
+}
+interface AXOverlayAnchorOptions {
+    /** The anchor element to position relative to */
+    anchor: HTMLElement | ElementRef<HTMLElement>;
+    /** Placement of the overlay relative to the anchor */
+    placement?: AXPlacementType;
+    /** Horizontal offset in pixels */
+    offsetX?: number;
+    /** Vertical offset in pixels */
+    offsetY?: number;
+    /** Whether to flip the overlay when it overflows the viewport */
+    autoFlip?: boolean;
 }
 interface AXOverlayOptions extends AXComponentOptions {
     backdrop?: {
@@ -14,14 +37,78 @@ interface AXOverlayOptions extends AXComponentOptions {
         closeOnClick?: boolean;
     };
     position?: AXPlacement;
+    /** Anchor-based positioning options for tooltips, popovers, etc. */
+    anchorOptions?: AXOverlayAnchorOptions;
+    /** Custom CSS class for the overlay panel */
+    panelClass?: string | string[];
+    /** Whether to close when clicking outside */
+    closeOnOutsideClick?: boolean;
+    /** Whether to close when pressing Escape */
+    closeOnEscape?: boolean;
+    /** Width of the overlay container (e.g., 'auto', '200px', '100%') */
+    width?: string;
+    /** Callback when the overlay is disposed (e.g., due to scroll) */
+    onDispose?: () => void;
 }
+/**
+ * Calculates the position of an overlay element relative to an anchor element.
+ */
+declare function calculateAnchorPosition(anchorRect: DOMRect, overlayRect: DOMRect, position: AXConnectedPosition): {
+    top: number;
+    left: number;
+};
+/**
+ * Checks if the overlay position fits within the viewport.
+ */
+declare function fitsInViewport(position: {
+    top: number;
+    left: number;
+}, overlayRect: DOMRect, viewportWidth: number, viewportHeight: number, margin?: number): boolean;
+/**
+ * Finds the best position for an overlay that fits in the viewport.
+ */
+declare function findBestPosition(anchorRect: DOMRect, overlayRect: DOMRect, positions: AXConnectedPosition[], viewportWidth: number, viewportHeight: number): {
+    position: AXConnectedPosition;
+    coords: {
+        top: number;
+        left: number;
+    };
+};
 
 declare class AXOverlayService {
     private componentService;
-    create<T = any>(content: AXComponentContent<T>, options?: AXOverlayOptions): Promise<AXOverlayRef<T>>;
+    private document;
+    private zIndexService;
+    /**
+     * Creates an overlay with optional anchor-based positioning.
+     * @param content - Component or template to display
+     * @param options - Configuration options for the overlay
+     * @returns Promise<AXOverlayRef> - Reference to the created overlay
+     */
+    create<T = unknown>(content: AXComponentContent<T>, options?: AXOverlayOptions): Promise<AXOverlayRef<T>>;
+    /**
+     * Creates a backdrop element.
+     */
+    private createBackdrop;
+    /**
+     * Creates a centered overlay container (for modals/popups).
+     */
+    private createCenteredOverlayContainer;
+    /**
+     * Gets the host element from a ComponentRef or EmbeddedViewRef.
+     */
+    private getHostElement;
+    /**
+     * Creates an overlay container element and appends the content to it.
+     */
+    private createOverlayContainer;
+    /**
+     * Positions the overlay container relative to the anchor element.
+     */
+    private positionOverlay;
     static ɵfac: i0.ɵɵFactoryDeclaration<AXOverlayService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<AXOverlayService>;
 }
 
-export { AXOverlayService };
-export type { AXOverlayOptions, AXOverlayRef };
+export { AXOverlayService, calculateAnchorPosition, findBestPosition, fitsInViewport };
+export type { AXOverlayAnchorOptions, AXOverlayOptions, AXOverlayRef };

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@acorex/cdk",
-  "version": "21.0.0-next52",
+  "version": "21.0.1-next.1",
   "peerDependencies": {
-    "@acorex/core": "21.0.0-next52",
+    "@acorex/core": "21.0.1-next.1",
     "@angular/common": "^20.0.0",
     "@angular/core": "^20.0.0",
     "quill": ">=2.0.2",
@@ -41,6 +41,10 @@
       "types": "./dom/index.d.ts",
       "default": "./fesm2022/acorex-cdk-dom.mjs"
     },
+    "./double-click": {
+      "types": "./double-click/index.d.ts",
+      "default": "./fesm2022/acorex-cdk-double-click.mjs"
+    },
     "./drag-drop": {
       "types": "./drag-drop/index.d.ts",
       "default": "./fesm2022/acorex-cdk-drag-drop.mjs"
@@ -53,6 +57,10 @@
       "types": "./focus-trap/index.d.ts",
       "default": "./fesm2022/acorex-cdk-focus-trap.mjs"
     },
+    "./full-screen": {
+      "types": "./full-screen/index.d.ts",
+      "default": "./fesm2022/acorex-cdk-full-screen.mjs"
+    },
     "./input-mask": {
       "types": "./input-mask/index.d.ts",
       "default": "./fesm2022/acorex-cdk-input-mask.mjs"
@@ -104,6 +112,10 @@
     "./wysiwyg": {
       "types": "./wysiwyg/index.d.ts",
       "default": "./fesm2022/acorex-cdk-wysiwyg.mjs"
+    },
+    "./z-index": {
+      "types": "./z-index/index.d.ts",
+      "default": "./fesm2022/acorex-cdk-z-index.mjs"
     }
   },
   "dependencies": {

package/z-index/README.md

@@ -0,0 +1,3 @@
+# @acorex/cdk/z-index
+
+Secondary entry point of `@acorex/cdk`. It can be used by importing from `@acorex/cdk/z-index`.

package/z-index/index.d.ts

@@ -0,0 +1,14 @@
+import * as i0 from '@angular/core';
+import { OnDestroy } from '@angular/core';
+
+declare class AXZindexDirective implements OnDestroy {
+    #private;
+    private el;
+    private z;
+    private token;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AXZindexDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AXZindexDirective, "[axZindex]", ["axZindex"], {}, {}, never, never, true, never>;
+}
+
+export { AXZindexDirective };