@shival99/z-ui 2.2.6 → 2.3.1

package/types/shival99-z-ui-components-z-overlay.d.ts

@@ -0,0 +1,145 @@
+import { AutoUpdateOptions, Placement } from '@floating-ui/dom';
+import * as i0 from '@angular/core';
+import { ApplicationRef, EnvironmentInjector, Type, Injector, ViewContainerRef, ComponentRef, TemplateRef, EmbeddedViewRef } from '@angular/core';
+import { Observable } from 'rxjs';
+
+type ZOverlaySide = 'top' | 'bottom' | 'left' | 'right';
+type ZOverlayPlacement = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'left-top' | 'left-bottom' | 'right' | 'right-top' | 'right-bottom';
+interface ZFloatingPlacementConfig {
+    reference: Element;
+    floating: HTMLElement;
+    placement: ZOverlayPlacement;
+    fallbackPlacements: ZOverlayPlacement[];
+    offset: number;
+    viewportPadding?: number;
+    push?: boolean;
+    flexibleDimensions?: boolean;
+}
+interface ZFloatingPlacementResult {
+    x: number;
+    y: number;
+    placement: ZOverlayPlacement;
+}
+interface ZFloatingArrowOffsetConfig {
+    triggerRect: DOMRectReadOnly;
+    overlayRect: DOMRectReadOnly;
+    placement: ZOverlayPlacement;
+    edgePadding?: number;
+}
+interface ZOverlaySizeConfig {
+    width?: string | number;
+    minWidth?: string | number;
+    maxWidth?: string | number;
+    height?: string | number;
+    minHeight?: string | number;
+    maxHeight?: string | number;
+}
+interface ZOverlayGlobalConfig {
+    hasBackdrop: boolean;
+    backdropClass?: string;
+    panelClass?: string;
+    scrollLock?: boolean;
+    size?: ZOverlaySizeConfig;
+}
+interface ZOverlayAnchoredConfig {
+    panelClass?: string;
+}
+
+declare function computeZOverlayPlacement(config: ZFloatingPlacementConfig): Promise<ZFloatingPlacementResult>;
+/** Bọc lại `autoUpdate` của Floating UI — thay cho `scrollStrategies.reposition()` của CDK. */
+declare function startZOverlayAutoUpdate(reference: Element, floating: HTMLElement, onUpdate: () => void, options?: Partial<AutoUpdateOptions>): () => void;
+/**
+ * Tính độ lệch mũi tên so với tâm overlay, kẹp trong biên overlay.
+ * Y hệt logic `_calculateArrowOffset` cũ của tooltip/popover — chỉ tách ra dùng chung.
+ */
+declare function computeZOverlayArrowOffset(config: ZFloatingArrowOffsetConfig): number;
+
+declare const Z_OVERLAY_DEFAULT_VIEWPORT_PADDING = 8;
+declare const Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING = 12;
+declare const Z_OVERLAY_CONTAINER_CLASS = "z-overlay-container";
+declare const Z_OVERLAY_HOST_CLASS = "z-overlay-host";
+/** Z-UI position name -> Floating UI placement (12 vị trí khớp 1:1). */
+declare const Z_OVERLAY_PLACEMENT_MAP: Record<ZOverlayPlacement, Placement>;
+declare const Z_OVERLAY_PLACEMENT_REVERSE_MAP: Record<Placement, ZOverlayPlacement>;
+/**
+ * Thứ tự fallback khi vị trí chính không đủ chỗ (không gồm vị trí chính — flip() tự thử trước).
+ * Dùng chung cho tooltip lẫn popover, hai nơi này vốn có bảng y hệt nhau.
+ */
+declare const Z_OVERLAY_FALLBACK_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]>;
+/** Thứ tự ưu tiên khi vị trí chính còn đủ chỗ (tooltip dùng để giữ đúng cạnh, không nhảy sang cạnh đối diện). */
+declare const Z_OVERLAY_PREFERRED_SIDE_ORDER: Record<ZOverlayPlacement, ZOverlayPlacement[]>;
+
+/**
+ * Thay cho `OverlayRef` của CDK. `overlayElement` là pane được Floating UI định vị
+ * (overlay neo theo trigger) hoặc chính `hostElement` (overlay toàn màn hình — modal/drawer).
+ */
+declare class ZOverlayRef {
+    readonly hostElement: HTMLElement;
+    readonly overlayElement: HTMLElement;
+    readonly backdropElement: HTMLElement | null;
+    private readonly _appRef;
+    private readonly _envInjector;
+    private readonly _onDispose?;
+    private _componentRef;
+    private _embeddedViewRef;
+    constructor(hostElement: HTMLElement, overlayElement: HTMLElement, backdropElement: HTMLElement | null, _appRef: ApplicationRef, _envInjector: EnvironmentInjector, _onDispose?: (() => void) | undefined);
+    hasAttached(): boolean;
+    /**
+     * `viewContainerRef`, khi được truyền, cho component tạo ra thừa hưởng injector/vị trí trong
+     * cây view của chính VCR đó (giữ đúng ngữ nghĩa `ZModalOptions.zViewContainerRef` công khai) —
+     * dù vậy DOM node vẫn luôn được chuyển vào `overlayElement`, y hệt `DomPortalOutlet` của CDK cũ.
+     */
+    attach<T>(component: Type<T>, options?: {
+        injector?: Injector;
+        viewContainerRef?: ViewContainerRef;
+    }): ComponentRef<T>;
+    /** Gắn một `TemplateRef` (thay `TemplatePortal`) — chỉ dùng cho overlay tự do (z-dynamic.service). */
+    attachTemplate<C>(templateRef: TemplateRef<C>, viewContainerRef: ViewContainerRef, context: C): EmbeddedViewRef<C>;
+    updateSize(size: ZOverlaySizeConfig): void;
+    backdropClick(): Observable<MouseEvent>;
+    outsidePointerEvents(): Observable<PointerEvent>;
+    dispose(): void;
+}
+
+/**
+ * Tạo overlay host `[popover=manual]` (top layer, thay cho `.cdk-overlay-pane`) và trả về `ZOverlayRef`.
+ *
+ * - `createAnchored`: overlay neo theo trigger (tooltip/popover) — có thêm `.z-overlay-pane` để
+ *   Floating UI định vị bằng `left`/`top` (không dùng `transform`, vì các class `z-animate-*`
+ *   trong `animations.css` đã chiếm `transform` cho hiệu ứng enter/exit).
+ * - `createGlobal`: overlay toàn màn hình (modal/drawer) — component gắn vào tự định vị bằng
+ *   `zModalVariants`/`zDrawerVariants` (đã là `fixed` + toạ độ cố định), nên không cần pane riêng.
+ */
+declare class ZOverlayService {
+    private readonly _appRef;
+    private readonly _envInjector;
+    private readonly _document;
+    private readonly _scrollLock;
+    private _container;
+    createAnchored(config?: ZOverlayAnchoredConfig): ZOverlayRef;
+    createGlobal(config: ZOverlayGlobalConfig): ZOverlayRef;
+    private _createHost;
+    private _showHost;
+    private _getContainer;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ZOverlayService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ZOverlayService>;
+}
+
+/**
+ * Khoá scroll trang khi overlay toàn màn hình (modal/drawer) mở — thay cho
+ * `scrollStrategies.block()` của CDK. Đếm tham chiếu để modal-trong-modal không mở khoá sớm.
+ * Dùng `top`/`left` âm theo vị trí scroll hiện tại (giống thuật toán `BlockScrollStrategy` của CDK)
+ * để không giật layout và giữ nguyên vị trí scroll khi mở khoá lại.
+ */
+declare class ZScrollLockService {
+    private readonly _document;
+    private _lockCount;
+    private _scrollPosition;
+    lock(): void;
+    unlock(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ZScrollLockService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ZScrollLockService>;
+}
+
+export { ZOverlayRef, ZOverlayService, ZScrollLockService, Z_OVERLAY_CONTAINER_CLASS, Z_OVERLAY_DEFAULT_ARROW_EDGE_PADDING, Z_OVERLAY_DEFAULT_VIEWPORT_PADDING, Z_OVERLAY_FALLBACK_ORDER, Z_OVERLAY_HOST_CLASS, Z_OVERLAY_PLACEMENT_MAP, Z_OVERLAY_PLACEMENT_REVERSE_MAP, Z_OVERLAY_PREFERRED_SIDE_ORDER, computeZOverlayArrowOffset, computeZOverlayPlacement, startZOverlayAutoUpdate };
+export type { ZFloatingArrowOffsetConfig, ZFloatingPlacementConfig, ZFloatingPlacementResult, ZOverlayAnchoredConfig, ZOverlayGlobalConfig, ZOverlayPlacement, ZOverlaySide, ZOverlaySizeConfig };

package/types/shival99-z-ui-components-z-popover.d.ts

@@ -23,8 +23,7 @@ interface ZPopoverControl {
 
 declare class ZPopoverComponent implements OnInit, OnDestroy {
     private static readonly _openPopovers;
-    private readonly _overlay;
-    private readonly _overlayPositionBuilder;
+    private readonly _overlayService;
     private readonly _renderer;
     private readonly _destroyRef;
     private readonly _platformId;
@@ -54,7 +53,7 @@ declare class ZPopoverComponent implements OnInit, OnDestroy {
     private _componentRef;
     private _delaySubject;
     private _listenerCleanups;
-    private _positionSubscription;
+    private _autoUpdateCleanup;
     private _scrollSubscription;
     private _viewportResizeSubscription;
     private _resizeObserver;
@@ -74,7 +73,6 @@ declare class ZPopoverComponent implements OnInit, OnDestroy {
     isOpen(): boolean;
     updatePosition(): void;
     private _createOverlay;
-    private _createScrollStrategy;
     private _disposeOverlay;
     private _setupDelayMechanism;
     private _setupTriggers;
@@ -85,19 +83,17 @@ declare class ZPopoverComponent implements OnInit, OnDestroy {
     private _showPopover;
     private _isNestedPopoverTarget;
     private _setupResizeObserver;
-    private _updatePositionAfterContentSettles;
     private _schedulePositionUpdate;
     private _scheduleSettledPositionUpdate;
     private _cancelScheduledPositionUpdate;
     private _updatePositionNow;
+    private _applyPosition;
     private _markViewportSettling;
     private _shouldDeferForMobileKeyboard;
     private _shouldSkipMobileKeyboardUpdate;
     private _isMobileOverlayTextInputFocused;
     private _clearViewportResizeTimeout;
-    private _applyMobilePopoverPosition;
     private _isTriggerVisibleInViewport;
-    private _setOverlayPaneStyles;
     private _setupPopoverHover;
     private _hidePopover;
     private _clearHideTimeout;
@@ -117,7 +113,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     readonly zHideDelay: _angular_core.InputSignal<number>;
     readonly zDisabled: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zOffset: _angular_core.InputSignal<number>;
-    readonly zPopoverWidth: _angular_core.InputSignal<number | "auto" | "trigger">;
+    readonly zPopoverWidth: _angular_core.InputSignal<number | "trigger" | "auto">;
     readonly zTriggerRef: _angular_core.InputSignal<HTMLElement | ElementRef<HTMLElement> | null>;
     readonly zManualClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
     readonly zOutsideClickClose: _angular_core.InputSignalWithTransform<boolean, string | boolean>;
@@ -132,8 +128,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     readonly zPositionChange: _angular_core.OutputEmitterRef<ZPopoverPosition>;
     readonly zOutsideClick: _angular_core.OutputEmitterRef<MouseEvent>;
     private readonly _trigger;
-    private readonly _overlay;
-    private readonly _overlayPositionBuilder;
+    private readonly _overlayService;
     private readonly _elementRef;
     private readonly _renderer;
     private readonly _destroyRef;
@@ -145,7 +140,7 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     private _componentRef;
     private _delaySubject;
     private _listenerCleanups;
-    private _positionSubscription;
+    private _autoUpdateCleanup;
     private _scrollSubscription;
     private _viewportResizeSubscription;
     private _resizeObserver;
@@ -166,7 +161,6 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     isOpen(): boolean;
     updatePosition(): void;
     private _createOverlay;
-    private _createScrollStrategy;
     private _getWidthConfig;
     private _getTriggerElement;
     private _disposeOverlay;
@@ -179,19 +173,17 @@ declare class ZPopoverDirective implements OnInit, OnDestroy {
     private _showPopover;
     private _isNestedPopoverTarget;
     private _setupResizeObserver;
-    private _updatePositionAfterContentSettles;
     private _schedulePositionUpdate;
     private _scheduleSettledPositionUpdate;
     private _cancelScheduledPositionUpdate;
     private _updatePositionNow;
+    private _applyPosition;
     private _markViewportSettling;
     private _shouldDeferForMobileKeyboard;
     private _shouldSkipMobileKeyboardUpdate;
     private _isMobileOverlayTextInputFocused;
     private _clearViewportResizeTimeout;
-    private _applyMobilePopoverPosition;
     private _isTriggerVisibleInViewport;
-    private _setOverlayPaneStyles;
     private _setupPopoverHover;
     private _hidePopover;
     private _clearHideTimeout;

package/types/shival99-z-ui-components-z-skeleton.d.ts

@@ -25,6 +25,8 @@ declare class ZSkeletonComponent implements AfterViewInit {
     private readonly _calculatedRows;
     ngAfterViewInit(): void;
     protected readonly containerClass: _angular_core.Signal<string>;
+    protected readonly hostDisplay: _angular_core.Signal<"inline-block" | "block">;
+    protected readonly hostWidth: _angular_core.Signal<string | undefined>;
     protected readonly hostHeight: _angular_core.Signal<string | undefined>;
     protected readonly skeletonClasses: _angular_core.Signal<string>;
     protected readonly circleStyles: _angular_core.Signal<{

package/types/shival99-z-ui-components-z-table.d.ts

@@ -6,7 +6,6 @@ import { ZInputAlign, ZInputSize } from '@shival99/z-ui/components/z-input';
 import * as _angular_core from '@angular/core';
 import { TemplateRef, Type, AfterViewInit, ElementRef, OnInit } from '@angular/core';
 import { CdkDragDrop } from '@angular/cdk/drag-drop';
-import { ConnectedPosition } from '@angular/cdk/overlay';
 import { ZPopoverPosition, ZPopoverTrigger, ZPopoverControl, ZPopoverDirective } from '@shival99/z-ui/components/z-popover';
 import { ClassValue } from 'clsx';
 import { NgScrollbar } from 'ngx-scrollbar';
@@ -1120,6 +1119,8 @@ declare class ZTableComponent<T> implements AfterViewInit {
     private readonly _document;
     private readonly _zExcel;
     private readonly _zTranslate;
+    private readonly _overlayService;
+    private readonly _viewContainerRef;
     /** Prevents recursive scroll sync between thead/tbody/tfoot */
     private readonly _isSyncingScroll;
     private _lastSyncedScrollLeft;
@@ -1134,6 +1135,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     private _filterEmitDebounceTimeout;
     /** Keeps the bulk bar mounted long enough for its exit animation */
     private _bulkBarTimer;
+    private _bulkBarOverlayRef;
     private _contentRowMenuOutsideTimer;
     private _contentRowMenuOutsideCleanup;
     private _cellInteractionOutsideCleanup;
@@ -1242,6 +1244,7 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly bulkBarConfig: _angular_core.WritableSignal<ZTableBulkActionOptions<T> | null>;
     protected readonly bulkBarContext: _angular_core.WritableSignal<ZTableBulkActionContext<T> | null>;
     protected readonly bulkBarItems: _angular_core.WritableSignal<ZTableBulkActionRenderItem<T>[]>;
+    protected readonly bulkBarTemplateRef: _angular_core.Signal<TemplateRef<unknown> | undefined>;
     /** True when table body is scrolled away from left edge (shows left pin shadow) */
     protected readonly hasScrollLeft: _angular_core.WritableSignal<boolean>;
     /** True when table has right-pinned columns and body isn't scrolled to the end */
@@ -1854,7 +1857,6 @@ declare class ZTableComponent<T> implements AfterViewInit {
     protected readonly bulkActionConfig: _angular_core.Signal<ZTableBulkActionOptions<T> | null>;
     protected readonly bulkActionItems: _angular_core.Signal<ZTableBulkActionRenderItem<T>[]>;
     protected readonly showBulkBar: _angular_core.Signal<boolean>;
-    protected readonly bulkBarPositions: ConnectedPosition[];
     private readonly _bulkBarExitDuration;
     /** Stable identity key per virtual index (row/group id, not array index) — prevents height jitter on fast scroll. */
     private readonly _virtualItemKeys;
@@ -1922,6 +1924,8 @@ declare class ZTableComponent<T> implements AfterViewInit {
     private _getExcelColumnHeader;
     private _getExcelColumnHeaderAlign;
     private _clearBulkBarTimer;
+    private _openBulkBarOverlay;
+    private _disposeBulkBarOverlay;
     private _clearContentRowMenuOutsideListener;
     /**
      * Wraps state mutations with a debounced processing indicator.

package/types/shival99-z-ui-components-z-tabs.d.ts

@@ -13,11 +13,11 @@ declare class ZTabPanelDirective {
 }
 
 declare const zTabsVariants: (props?: ({
-    zType?: "line" | "soft" | "segment" | "segment-solid" | "folder" | "folder-soft" | "folder-solid" | "underline" | "underlined" | "badge" | "sharp" | "sharp-line" | "sharp-line-filled" | "vertical-sharp" | "code-line" | null | undefined;
+    zType?: "line" | "soft" | "segment" | "segment-solid" | "pill-solid" | "pill-blur" | "folder" | "folder-soft" | "folder-solid" | "underline" | "underlined" | "badge" | "sharp" | "sharp-line" | "sharp-line-filled" | "vertical-sharp" | "code-line" | null | undefined;
     zOrientation?: "horizontal" | "vertical" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const zTabItemVariants: (props?: ({
-    zType?: "line" | "soft" | "segment" | "segment-solid" | "folder" | "folder-soft" | "folder-solid" | "underline" | "underlined" | "badge" | "sharp" | "sharp-line" | "sharp-line-filled" | "vertical-sharp" | "code-line" | null | undefined;
+    zType?: "line" | "soft" | "segment" | "segment-solid" | "pill-solid" | "pill-blur" | "folder" | "folder-soft" | "folder-solid" | "underline" | "underlined" | "badge" | "sharp" | "sharp-line" | "sharp-line-filled" | "vertical-sharp" | "code-line" | null | undefined;
     zSize?: "xs" | "sm" | "default" | "lg" | null | undefined;
     zOrientation?: "horizontal" | "vertical" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
@@ -30,7 +30,7 @@ interface ZTab {
     badge?: string | number;
     template?: TemplateRef<unknown>;
 }
-type ZTabsType = 'line' | 'soft' | 'segment' | 'segment-solid' | 'folder' | 'folder-soft' | 'folder-solid' | 'underline' | 'underlined' | 'badge' | 'sharp' | 'sharp-line' | 'sharp-line-filled' | 'vertical-sharp' | 'code-line';
+type ZTabsType = 'line' | 'soft' | 'segment' | 'segment-solid' | 'pill-solid' | 'pill-blur' | 'folder' | 'folder-soft' | 'folder-solid' | 'underline' | 'underlined' | 'badge' | 'sharp' | 'sharp-line' | 'sharp-line-filled' | 'vertical-sharp' | 'code-line';
 type ZTabsSize = 'xs' | 'sm' | 'default' | 'lg';
 type ZTabsOrientation = 'horizontal' | 'vertical';
 type ZTabsContentFit = 'none' | 'screen';
@@ -60,6 +60,15 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
     protected readonly loadedTabs: _angular_core.WritableSignal<Set<string>>;
     protected readonly canScrollLeft: _angular_core.WritableSignal<boolean>;
     protected readonly canScrollRight: _angular_core.WritableSignal<boolean>;
+    protected readonly bouncingTab: _angular_core.WritableSignal<string | null>;
+    protected readonly isGlideType: _angular_core.Signal<boolean>;
+    protected readonly glideStyle: _angular_core.WritableSignal<{
+        transform: string;
+        width: string;
+        height: string;
+    } | null>;
+    protected readonly glideReady: _angular_core.WritableSignal<boolean>;
+    protected readonly glideSquashing: _angular_core.WritableSignal<boolean>;
     protected readonly panelRenderStates: _angular_core.Signal<Map<string, boolean>>;
     private _resizeObserver?;
     private readonly _cacheInstanceId;
@@ -79,6 +88,7 @@ declare class ZTabsComponent implements OnInit, AfterViewInit, OnDestroy {
     protected scrollLeft(): void;
     protected scrollRight(): void;
     protected onTabsScroll(): void;
+    private _updateGlideIndicator;
     private _setupResizeObserver;
     private _restoreActiveTabFromCache;
     private _saveActiveTabToCache;

package/types/shival99-z-ui-components-z-toast.d.ts

@@ -57,7 +57,7 @@ declare class ZToastComponent {
     private readonly _themeService;
     private readonly _config;
     readonly class: _angular_core.InputSignal<ClassValue>;
-    readonly zVariant: _angular_core.InputSignal<"default" | "success" | "error" | "warning" | "info" | null | undefined>;
+    readonly zVariant: _angular_core.InputSignal<"success" | "error" | "warning" | "info" | "default" | null | undefined>;
     readonly zTheme: _angular_core.InputSignal<ZToastTheme | undefined>;
     readonly zPosition: _angular_core.InputSignal<ZToastPosition | undefined>;
     readonly zRichColors: _angular_core.InputSignal<boolean | undefined>;
@@ -118,7 +118,7 @@ declare class ZToastCustomComponent {
 declare function provideZToast(config?: Partial<ZToasterConfig>): EnvironmentProviders;
 
 declare class ZToastService implements OnDestroy {
-    private readonly _overlay;
+    private readonly _overlayService;
     private readonly _injector;
     private readonly _platformId;
     private readonly _document;
@@ -143,6 +143,12 @@ declare class ZToastService implements OnDestroy {
     ngOnDestroy(): void;
     private _ensureToasterAttached;
     private _moveToTop;
+    /**
+     * Theo dõi cả hai container overlay (`.cdk-overlay-container` — z-command/z-gallery-preview/
+     * z-dynamic.service vẫn dùng CDK, và `.z-overlay-container` — tooltip/popover/modal/drawer dùng
+     * engine mới) để bật toast lên top layer mỗi khi có overlay khác vừa mở, giữ đúng hành vi
+     * "toast luôn nổi trên cùng" bất kể overlay đó thuộc engine nào.
+     */
     private _setupOverlayObserver;
     private _disconnectObserver;
     private _attachToaster;
@@ -153,7 +159,7 @@ declare class ZToastService implements OnDestroy {
 }
 
 declare const zToastVariants: (props?: ({
-    zVariant?: "default" | "success" | "error" | "warning" | "info" | null | undefined;
+    zVariant?: "success" | "error" | "warning" | "info" | "default" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type ZToastVariants = VariantProps<typeof zToastVariants>;
 

package/types/shival99-z-ui-components-z-tooltip.d.ts

@@ -1,9 +1,11 @@
+import * as _shival99_z_ui_components_z_overlay from '@shival99/z-ui/components/z-overlay';
+import { ZOverlayPlacement } from '@shival99/z-ui/components/z-overlay';
 import * as _angular_core from '@angular/core';
 import { TemplateRef, OnInit, OnDestroy } from '@angular/core';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 
-type ZTooltipPosition = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'left-top' | 'left-bottom' | 'right' | 'right-top' | 'right-bottom';
+type ZTooltipPosition = ZOverlayPlacement;
 
 declare const zTooltipVariants: (props?: ({
     zType?: "default" | "dark" | "light" | "primary" | "success" | "warning" | "error" | "info" | null | undefined;
@@ -32,8 +34,8 @@ interface ZTooltipConfig {
 
 declare class ZTooltipDirective implements OnInit, OnDestroy {
     readonly zContent: _angular_core.InputSignal<ZTooltipContent>;
-    readonly zPosition: _angular_core.InputSignal<ZTooltipPosition>;
-    readonly zTooltipPosition: _angular_core.InputSignal<ZTooltipPosition | undefined>;
+    readonly zPosition: _angular_core.InputSignal<_shival99_z_ui_components_z_overlay.ZOverlayPlacement>;
+    readonly zTooltipPosition: _angular_core.InputSignal<_shival99_z_ui_components_z_overlay.ZOverlayPlacement | undefined>;
     readonly zTrigger: _angular_core.InputSignal<ZTooltipTrigger>;
     readonly zTooltipTrigger: _angular_core.InputSignal<ZTooltipTrigger | undefined>;
     readonly zType: _angular_core.InputSignal<"default" | "dark" | "light" | "primary" | "success" | "warning" | "error" | "info" | null | undefined>;
@@ -64,8 +66,7 @@ declare class ZTooltipDirective implements OnInit, OnDestroy {
     private readonly _offset;
     readonly zShow: _angular_core.OutputEmitterRef<void>;
     readonly zHide: _angular_core.OutputEmitterRef<void>;
-    private readonly _overlay;
-    private readonly _overlayPositionBuilder;
+    private readonly _overlayService;
     private readonly _elementRef;
     private readonly _renderer;
     private readonly _destroyRef;
@@ -75,7 +76,7 @@ declare class ZTooltipDirective implements OnInit, OnDestroy {
     private _componentRef;
     private _delaySubject;
     private _listenerCleanups;
-    private _positionSubscription;
+    private _autoUpdateCleanup;
     private _hideTimeout;
     private readonly _isVisible;
     constructor();
@@ -87,13 +88,14 @@ declare class ZTooltipDirective implements OnInit, OnDestroy {
     private _isFormControlValueTruncated;
     hide(): void;
     toggle(): void;
-    private _createOverlay;
+    private _getAnchorElement;
     private _disposeOverlay;
     private _setupDelayMechanism;
     private _setupTriggers;
     private _setupOutsideClick;
     private _delay;
     private _showTooltip;
+    private _applyPosition;
     private _setupTooltipHover;
     private _hideTooltip;
     private _clearHideTimeout;

package/types/shival99-z-ui-services.d.ts

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { Type, TemplateRef, ViewContainerRef, EventEmitter, ComponentRef, Signal, InjectionToken } from '@angular/core';
-import { PositionStrategy, ScrollStrategy, OverlayConfig, OverlayRef } from '@angular/cdk/overlay';
+import { ZOverlayRef } from '@shival99/z-ui/components/z-overlay';
 import { ZFormatNumExcelOptions } from '@shival99/z-ui/utils';
 import { HttpHeaders, HttpContext, HttpParams, HttpClient } from '@angular/common/http';
 import { Router } from '@angular/router';
@@ -56,7 +56,7 @@ interface ZDynamicTemplateContext<TData, TResult> {
     /** Data passed to `open`. */
     data: TData | undefined;
 }
-/** Options for opening a free-form CDK dynamic overlay. */
+/** Options for opening a free-form global dynamic overlay. */
 interface ZDynamicOptions<TData = unknown> {
     /** Data injected into a component or exposed in a template context. */
     data?: TData;
@@ -65,29 +65,27 @@ interface ZDynamicOptions<TData = unknown> {
     /** Whether the overlay renders a backdrop. Defaults to `true`. */
     hasBackdrop?: boolean;
     /** CSS class or classes applied to the backdrop. */
-    backdropClass?: string | string[];
-    /** CSS class or classes applied to the overlay pane. */
-    panelClass?: string | string[];
-    /** Custom position strategy. Defaults to a global overlay strategy. */
-    positionStrategy?: PositionStrategy;
-    /** Custom scroll strategy. Defaults to the CDK block strategy. */
-    scrollStrategy?: ScrollStrategy;
+    backdropClass?: string;
+    /** CSS class or classes applied to the overlay host. */
+    panelClass?: string;
+    /** Locks page scroll while the overlay is open. Defaults to `true`. */
+    scrollLock?: boolean;
     /** Close when the backdrop is clicked. Defaults to `true`. */
     closeOnBackdropClick?: boolean;
     /** Close when Escape is pressed. Defaults to `true`. */
     closeOnEscape?: boolean;
-    /** Initial pane width passed to CDK. */
-    width?: OverlayConfig['width'];
-    /** Initial pane height passed to CDK. */
-    height?: OverlayConfig['height'];
-    /** Minimum pane width passed to CDK. */
-    minWidth?: OverlayConfig['minWidth'];
-    /** Maximum pane width passed to CDK. */
-    maxWidth?: OverlayConfig['maxWidth'];
-    /** Minimum pane height passed to CDK. */
-    minHeight?: OverlayConfig['minHeight'];
-    /** Maximum pane height passed to CDK. */
-    maxHeight?: OverlayConfig['maxHeight'];
+    /** Initial pane width. */
+    width?: string | number;
+    /** Initial pane height. */
+    height?: string | number;
+    /** Minimum pane width. */
+    minWidth?: string | number;
+    /** Maximum pane width. */
+    maxWidth?: string | number;
+    /** Minimum pane height. */
+    minHeight?: string | number;
+    /** Maximum pane height. */
+    maxHeight?: string | number;
 }
 /** Result type emitted when a dynamic overlay closes. */
 type ZDynamicResult<TResult> = TResult | undefined;
@@ -108,7 +106,7 @@ declare class ZDynamicRef<T = unknown, TResult = unknown> {
     componentInstance: T | null;
     /** Emits the close result once, then completes. */
     readonly afterClose: EventEmitter<ZDynamicResult<TResult>>;
-    constructor(_overlayRef: OverlayRef | undefined, _platformId: object);
+    constructor(_overlayRef: ZOverlayRef | undefined, _platformId: object);
     private _closeOnBackdropClick;
     private _closeOnEscape;
     /** Configures close triggers for the instance. */
@@ -117,7 +115,11 @@ declare class ZDynamicRef<T = unknown, TResult = unknown> {
     isClosed(): boolean;
     /** Closes the overlay and emits the optional result exactly once. */
     close(result?: TResult): void;
-    /** Updates the overlay position using its configured strategy. */
+    /**
+     * @deprecated Không còn tác dụng — overlay tự do giờ luôn dùng vị trí toàn cục (global),
+     * tự canh giữa bằng CSS, không còn "chiến lược định vị" nào cần cập nhật lại. Giữ lại method
+     * rỗng để không phá vỡ code đang gọi nó.
+     */
     updatePosition(): void;
     /** Updates the overlay pane dimensions. */
     updateSize(width?: string, height?: string): void;
@@ -126,19 +128,19 @@ declare class ZDynamicRef<T = unknown, TResult = unknown> {
 }
 
 /**
- * Opens components and templates in a bare CDK overlay.
+ * Opens components and templates in a bare global overlay (no anchored positioning).
  *
- * @description The service supplies overlay lifecycle and positioning only. The
- * mounted content owns its complete layout, including close controls and styling.
+ * @description The service supplies overlay lifecycle only. The mounted content owns its
+ * complete layout, including close controls and styling.
  */
 declare class ZDynamicService {
-    private readonly _overlay;
+    private readonly _overlayService;
     private readonly _injector;
     private readonly _platformId;
     private readonly _zIndexService;
     /** Alias for `open`, matching the create-style API used by modal and drawer services. */
     create<T, TData = unknown, TResult = unknown>(content: ZDynamicContent<T>, options?: ZDynamicOptions<TData>): ZDynamicRef<T, TResult>;
-    /** Opens a component or template in a free-form CDK overlay. */
+    /** Opens a component or template in a free-form global overlay. */
     open<T, TData = unknown, TResult = unknown>(content: ZDynamicContent<T>, options?: ZDynamicOptions<TData>): ZDynamicRef<T, TResult>;
     private _createOverlay;
     private _isTemplate;
@@ -582,6 +584,16 @@ declare class ZOverlayContainerService {
     static ɵprov: i0.ɵɵInjectableDeclaration<ZOverlayContainerService>;
 }
 
+/**
+ * Bề mặt tối thiểu mà dịch vụ này cần — khớp cấu trúc với cả CDK `OverlayRef`
+ * (z-command, z-gallery-preview, z-dynamic.service vẫn dùng CDK) lẫn `ZOverlayRef`
+ * mới (tooltip/popover/modal/drawer), không cần import type từ nơi nào trong hai bên.
+ */
+interface ZOverlayZIndexTarget {
+    readonly hostElement: HTMLElement;
+    readonly backdropElement?: HTMLElement | null;
+}
+
 /**
  * Global z-index counter for overlay components (z-modal, z-drawer, etc.).
  *
@@ -597,9 +609,18 @@ declare class ZOverlayZIndexService {
      * Kept for backward compatibility with existing overlay flow.
      */
     next(): number;
-    applyToOverlay(overlayRef: OverlayRef): number;
-    deferMoveToTop(overlayRef: OverlayRef): void;
-    moveToTop(overlayRef: OverlayRef): void;
+    applyToOverlay(overlayRef: ZOverlayZIndexTarget): number;
+    /**
+     * @deprecated Thừa với overlay đã dùng native Popover API (`[popover]` + `showPopover()`):
+     * top layer đã tự xếp overlay hiện gần nhất lên trên cùng, hide+show lại chỉ là restack thủ
+     * công cho hành vi mà trình duyệt đã làm sẵn. CDK 22 cũng mặc định `usePopover: true` nên
+     * z-command/z-gallery-preview cũng đang gọi thừa. Chỉ còn có ý nghĩa làm fallback DOM-reorder
+     * (nhánh `else` trong `moveToTop`) cho trình duyệt KHÔNG hỗ trợ Popover API (Chrome <114,
+     * Firefox <125, Safari <17). Xoá khi dự án xác nhận không còn cần hỗ trợ nhóm trình duyệt đó.
+     */
+    deferMoveToTop(overlayRef: ZOverlayZIndexTarget): void;
+    /** @deprecated Xem ghi chú tại {@link deferMoveToTop}. */
+    moveToTop(overlayRef: ZOverlayZIndexTarget): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ZOverlayZIndexService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<ZOverlayZIndexService>;
 }