ng-primitives 0.114.0 → 0.115.0

package/tooltip/index.d.ts

@@ -36,7 +36,7 @@ interface NgpTooltipConfig {
      */
     flip: NgpFlip;
     /**
-     * Define the container element or selector in to which the tooltip should be attached.
+     * Define the container element or selector into which the tooltip should be attached.
      * @default 'body'
      */
     container: HTMLElement | string | null;
@@ -74,6 +74,11 @@ interface NgpTooltipConfig {
      * @default 300
      */
     cooldown: number;
+    /**
+     * Whether hovering the tooltip content keeps it open while moving from the trigger.
+     * @default false
+     */
+    hoverableContent: boolean;
 }
 /**
  * Provide the default Tooltip configuration
@@ -122,6 +127,10 @@ type TooltipInput<T> = NgpOverlayContent<T> | string | null | undefined;
  * Apply the `ngpTooltipTrigger` directive to an element that triggers the tooltip to show.
  */
 declare class NgpTooltipTrigger<T = null> implements OnDestroy {
+    /**
+     * Maximum time allowed to cross from trigger to tooltip without pointer movement.
+     */
+    private static readonly HOVER_BRIDGE_TIMEOUT_MS;
     /**
      * Access the trigger element
      */
@@ -138,6 +147,10 @@ declare class NgpTooltipTrigger<T = null> implements OnDestroy {
      * Access the global tooltip configuration.
      */
     private readonly config;
+    /**
+     * Disposables for managing event listeners and timers with automatic teardown.
+     */
+    private readonly disposables;
     /**
      * Access the tooltip template ref.
      */
@@ -224,6 +237,11 @@ declare class NgpTooltipTrigger<T = null> implements OnDestroy {
      * @default 300
      */
     readonly cooldown: _angular_core.InputSignalWithTransform<number, NumberInput>;
+    /**
+     * Whether hovering tooltip content keeps the tooltip open.
+     * @default false
+     */
+    readonly hoverableContent: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /**
      * The overlay that manages the tooltip
      * @internal
@@ -242,6 +260,26 @@ declare class NgpTooltipTrigger<T = null> implements OnDestroy {
      * Determine if the trigger element has overflow.
      */
     private readonly hasOverflow;
+    /**
+     * Tracks whether pointer is currently over trigger.
+     */
+    private triggerHovered;
+    /**
+     * Tracks whether pointer is currently over tooltip content.
+     */
+    private contentHovered;
+    /**
+     * Current pointer grace polygon used while crossing trigger -> tooltip.
+     */
+    private hoverBridgePolygon;
+    /**
+     * Cleanup callback for the document pointermove listener.
+     */
+    private removePointerMoveListener?;
+    /**
+     * Cleanup callback for the hover bridge timeout.
+     */
+    private clearHoverBridgeTimeout?;
     /**
      * Store the state of the tooltip.
      * @internal
@@ -271,7 +309,17 @@ declare class NgpTooltipTrigger<T = null> implements OnDestroy {
      * Hide the tooltip from an interaction (respects disabled state).
      * @internal
      */
-    protected hideFromInteraction(): void;
+    protected hideFromInteraction(event?: MouseEvent): void;
+    /**
+     * Called by tooltip content when pointer enters the tooltip.
+     * @internal
+     */
+    onTooltipHoverStart(): void;
+    /**
+     * Called by tooltip content when pointer leaves the tooltip.
+     * @internal
+     */
+    onTooltipHoverEnd(): void;
     /**
      * Create the overlay that will contain the tooltip
      */
@@ -280,8 +328,20 @@ declare class NgpTooltipTrigger<T = null> implements OnDestroy {
      * Set the tooltip id.
      */
     setTooltipId(id: string): void;
+    /**
+     * Register document-level pointer tracking while crossing trigger -> tooltip.
+     */
+    private registerPointerMoveListener;
+    /**
+     * Clear hover bridge state and global listeners.
+     */
+    private clearHoverBridge;
+    /**
+     * Close if pointer leaves trigger and does not move into tooltip soon enough.
+     */
+    private scheduleHoverBridgeCloseFallback;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpTooltipTrigger<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpTooltipTrigger<any>, "[ngpTooltipTrigger]", ["ngpTooltipTrigger"], { "tooltip": { "alias": "ngpTooltipTrigger"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpTooltipTriggerDisabled"; "required": false; "isSignal": true; }; "placement": { "alias": "ngpTooltipTriggerPlacement"; "required": false; "isSignal": true; }; "offset": { "alias": "ngpTooltipTriggerOffset"; "required": false; "isSignal": true; }; "showDelay": { "alias": "ngpTooltipTriggerShowDelay"; "required": false; "isSignal": true; }; "hideDelay": { "alias": "ngpTooltipTriggerHideDelay"; "required": false; "isSignal": true; }; "flip": { "alias": "ngpTooltipTriggerFlip"; "required": false; "isSignal": true; }; "shift": { "alias": "ngpTooltipTriggerShift"; "required": false; "isSignal": true; }; "container": { "alias": "ngpTooltipTriggerContainer"; "required": false; "isSignal": true; }; "showOnOverflow": { "alias": "ngpTooltipTriggerShowOnOverflow"; "required": false; "isSignal": true; }; "context": { "alias": "ngpTooltipTriggerContext"; "required": false; "isSignal": true; }; "useTextContent": { "alias": "ngpTooltipTriggerUseTextContent"; "required": false; "isSignal": true; }; "trackPosition": { "alias": "ngpTooltipTriggerTrackPosition"; "required": false; "isSignal": true; }; "position": { "alias": "ngpTooltipTriggerPosition"; "required": false; "isSignal": true; }; "scrollBehavior": { "alias": "ngpTooltipTriggerScrollBehavior"; "required": false; "isSignal": true; }; "cooldown": { "alias": "ngpTooltipTriggerCooldown"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpTooltipTrigger<any>, "[ngpTooltipTrigger]", ["ngpTooltipTrigger"], { "tooltip": { "alias": "ngpTooltipTrigger"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpTooltipTriggerDisabled"; "required": false; "isSignal": true; }; "placement": { "alias": "ngpTooltipTriggerPlacement"; "required": false; "isSignal": true; }; "offset": { "alias": "ngpTooltipTriggerOffset"; "required": false; "isSignal": true; }; "showDelay": { "alias": "ngpTooltipTriggerShowDelay"; "required": false; "isSignal": true; }; "hideDelay": { "alias": "ngpTooltipTriggerHideDelay"; "required": false; "isSignal": true; }; "flip": { "alias": "ngpTooltipTriggerFlip"; "required": false; "isSignal": true; }; "shift": { "alias": "ngpTooltipTriggerShift"; "required": false; "isSignal": true; }; "container": { "alias": "ngpTooltipTriggerContainer"; "required": false; "isSignal": true; }; "showOnOverflow": { "alias": "ngpTooltipTriggerShowOnOverflow"; "required": false; "isSignal": true; }; "context": { "alias": "ngpTooltipTriggerContext"; "required": false; "isSignal": true; }; "useTextContent": { "alias": "ngpTooltipTriggerUseTextContent"; "required": false; "isSignal": true; }; "trackPosition": { "alias": "ngpTooltipTriggerTrackPosition"; "required": false; "isSignal": true; }; "position": { "alias": "ngpTooltipTriggerPosition"; "required": false; "isSignal": true; }; "scrollBehavior": { "alias": "ngpTooltipTriggerScrollBehavior"; "required": false; "isSignal": true; }; "cooldown": { "alias": "ngpTooltipTriggerCooldown"; "required": false; "isSignal": true; }; "hoverableContent": { "alias": "ngpTooltipTriggerHoverableContent"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 type NgpTooltipPlacement = 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';