watercolor-ui
Version:
A modern minimalist cross-framework component library
167 lines • 4.65 kB
TypeScript
/**
* 计算弹出框位置
* @param {HTMLElement} trigger - 触发器元素
* @param {HTMLElement} popover - 弹出框元素
* @param {string} placement - 位置
* @param {number} offset - 偏移量
* @returns {Object} 位置坐标
*/
export function calculatePopoverPosition(trigger: HTMLElement, popover: HTMLElement, placement?: string, offset?: number): Object;
/**
* 检测碰撞并调整位置
* @param {Object} position - 原始位置
* @param {HTMLElement} popover - 弹出框元素
* @param {string} placement - 位置
* @returns {Object} 调整后的位置和最终placement
*/
export function detectCollisionAndAdjust(position: Object, popover: HTMLElement, placement: string): Object;
/**
* 生成 Popover 组件的 CSS 类名
* @param {Object} options - 配置选项
* @returns {Object} 各部分的类名
*/
export function getPopoverClasses(options?: Object): Object;
export namespace placements {
let TOP: string;
let BOTTOM: string;
let LEFT: string;
let RIGHT: string;
let TOP_START: string;
let TOP_END: string;
let BOTTOM_START: string;
let BOTTOM_END: string;
let LEFT_START: string;
let LEFT_END: string;
let RIGHT_START: string;
let RIGHT_END: string;
}
export namespace triggers {
let CLICK: string;
let HOVER: string;
let FOCUS: string;
let MANUAL: string;
}
export namespace sizes {
let SM: string;
let MD: string;
let LG: string;
}
/**
* Popover 控制器类
*/
export class PopoverController {
constructor(options?: {});
options: {
trigger: string;
placement: string;
offset: number;
delay: number;
hideDelay: number;
autoClose: boolean;
closeOnOutsideClick: boolean;
closeOnEscape: boolean;
};
isOpen: boolean;
triggerElement: HTMLElement | null;
popoverElement: HTMLElement | null;
timeouts: Set<any>;
eventCleanups: any[];
/**
* 事件处理器
*/
handleTriggerClick(event: any): void;
handleTriggerMouseEnter(): void;
handleTriggerMouseLeave(): void;
handleTriggerFocus(): void;
handleTriggerBlur(): void;
handleOutsideClick(event: any): void;
handleEscapeKey(event: any): void;
handleResize(): void;
handleScroll(): void;
/**
* 初始化控制器
* @param {HTMLElement} trigger - 触发器元素
* @param {HTMLElement} popover - 弹出框元素
*/
init(trigger: HTMLElement, popover: HTMLElement): void;
/**
* 绑定事件
*/
bindEvents(): void;
/**
* 添加事件监听器
* @param {Element} element - 目标元素
* @param {string} event - 事件名
* @param {Function} handler - 处理函数
* @param {boolean} capture - 是否捕获
*/
addEventListener(element: Element, event: string, handler: Function, capture?: boolean): void;
/**
* 打开弹出框
*/
open(): void;
/**
* 关闭弹出框
*/
close(): void;
/**
* 切换弹出框状态
*/
toggle(): void;
/**
* 更新位置
*/
updatePosition(): void;
/**
* 更新箭头方向
* @param {string} placement - 位置
*/
updateArrowDirection(placement: string): void;
/**
* 清除所有定时器
*/
clearTimeouts(): void;
/**
* 销毁控制器
*/
destroy(): void;
}
export namespace utils {
/**
* 创建 Popover 控制器实例
* @param {Object} options - 配置选项
* @returns {PopoverController} 控制器实例
*/
function createController(options?: Object): PopoverController;
/**
* 检测是否支持 Popover API
* @returns {boolean} 是否支持
*/
function isPopoverSupported(): boolean;
/**
* 获取最佳位置
* @param {HTMLElement} trigger - 触发器元素
* @param {HTMLElement} popover - 弹出框元素
* @param {Array} preferredPlacements - 优先位置列表
* @returns {string} 最佳位置
*/
function getBestPlacement(trigger: HTMLElement, popover: HTMLElement, preferredPlacements?: any[]): string;
/**
* 调试信息
* @param {string} message - 消息
* @param {*} data - 数据
*/
function debug(message: string, data: any): void;
}
declare namespace _default {
export { PopoverController };
export { calculatePopoverPosition };
export { detectCollisionAndAdjust };
export { getPopoverClasses };
export { utils };
export { placements };
export { triggers };
export { sizes };
}
export default _default;
//# sourceMappingURL=utils.d.ts.map