bootstrap-vue-next/dist/src/directives/utils.d.mts

Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development

import { ComponentInternalInstance, Directive, DirectiveBinding, VNode } from 'vue';
import { BPopoverProps } from '../types/ComponentProps';
import { ElementWithPopper } from '../utils/floatingUi';
interface _ComponentInternalInstance extends ComponentInternalInstance {
    provides?: Record<string, unknown>;
    setupState?: any;
}
interface _VNode extends VNode {
    ctx?: _ComponentInternalInstance | null;
    ssContent?: VNode | null;
}
/**
 * Represents per-instance state for directives using UID namespacing
 */
export interface DirectiveInstanceState {
    binding: string;
    destroying: boolean;
}
/**
 * Gets the component instance UID from a directive binding
 * @throws Error if binding.instance is not available
 */
export declare function getDirectiveUid(binding: DirectiveBinding): number;
/**
 * Initializes UID-namespaced storage on an element for a directive
 * @param el - The HTML element
 * @param propertyName - The property name (e.g., '$__tooltip', '$__popover')
 * @param uid - The component instance UID
 * @param binding - The directive binding value to cache
 * @returns The initialized instance state
 */
export declare function initDirectiveInstance(el: HTMLElement & Record<string, unknown>, propertyName: string, uid: number, binding: DirectiveBinding): DirectiveInstanceState;
/**
 * Gets the instance state for a directive, if it exists
 * @param el - The HTML element
 * @param propertyName - The property name (e.g., '$__tooltip', '$__popover')
 * @param uid - The component instance UID
 * @returns The instance state or undefined if not found
 */
export declare function getDirectiveInstance(el: HTMLElement & Record<string, unknown>, propertyName: string, uid: number): DirectiveInstanceState | undefined;
/**
 * Checks if the directive binding has changed for this instance
 * @param instance - The directive instance state
 * @param binding - The current directive binding
 * @returns true if the binding has changed, false otherwise
 */
export declare function hasBindingChanged(instance: DirectiveInstanceState, binding: DirectiveBinding): boolean;
/**
 * Updates the cached binding value for a directive instance
 * @param instance - The directive instance state
 * @param binding - The new directive binding
 */
export declare function updateBindingCache(instance: DirectiveInstanceState, binding: DirectiveBinding): void;
/**
 * Cleans up a directive instance
 * @param el - The HTML element
 * @param propertyName - The property name (e.g., '$__tooltip', '$__popover')
 * @param uid - The component instance UID
 */
export declare function cleanupDirectiveInstance(el: HTMLElement & Record<string, unknown>, propertyName: string, uid: number): void;
export declare function findProvides(binding: DirectiveBinding, vnode: _VNode): Record<string, unknown>;
export declare function findComponentParent(vnode: VNode, root: ComponentInternalInstance): _ComponentInternalInstance | null;
/**
 * Creates a floating UI directive (tooltip or popover) with UID-namespaced state management
 * @param propertyName - The property name for storing state (e.g., '$__tooltip', '$__popover')
 * @param componentDefaultsKey - The key for accessing component defaults (e.g., 'BTooltip', 'BPopover')
 * @param buildProps - Optional function to customize the props passed to bind()
 * @returns A Vue directive object
 */
export declare function createFloatingDirective(propertyName: string, componentDefaultsKey: string, buildProps?: (text: {
    title?: string;
    body?: string;
}, defaults: unknown, binding: Readonly<DirectiveBinding>, el: Readonly<HTMLElement>) => BPopoverProps): Directive<ElementWithPopper>;
export {};