ember-bootstrap

import Component from '@glimmer/component'; import { type Timer } from '@ember/runloop'; import type { Placement } from '@popperjs/core'; import type { SimpleElement } from '@simple-dom/interface'; export interface ContextualHelpSignature { Args: { autoPlacement?: boolean; delay?: number; delayHide?: number; delayShow?: number; fade?: boolean; onHide?: <T extends ContextualHelpSignature>(self: ContextualHelp<T>) => unknown; onHidden?: <T extends ContextualHelpSignature>(self: ContextualHelp<T>) => unknown; onShow?: <T extends ContextualHelpSignature>(self: ContextualHelp<T>) => unknown; onShown?: <T extends ContextualHelpSignature>(self: ContextualHelp<T>) => unknown; placement?: Placement; renderInPlace?: boolean; transitionDuration?: number; title?: string; triggerElement?: string | null; triggerEvents?: string | string[]; viewportPadding?: number; viewportSelector?: string; visible?: boolean; }; } /** @class ContextualHelp @namespace Components @extends Glimmer.Component @private */ export default abstract class ContextualHelp<Signature extends ContextualHelpSignature> extends Component<Signature> { /** * @property title * @type string * @public */ /** * How to position the tooltip/popover - top | bottom | left | right * * @property title * @type string * @default 'top' * @public */ placement: string; /** * By default, it will dynamically reorient the tooltip/popover based on the available space in the viewport. For * example, if `placement` is "left", the tooltip/popover will display to the left when possible, otherwise it will * display right. Set to `false` to force placement according to the `placement` property * * @property autoPlacement * @type boolean * @default true * @public */ autoPlacement: boolean; /** * You can programmatically show the tooltip/popover by setting this to `true` * * @property visible * @type boolean * @default false * @public */ visible: boolean; /** * @property inDom * @type boolean * @private */ _inDom?: boolean; get inDom(): boolean; set inDom(value: boolean); /** * Set to false to disable fade animations. * * @property fade * @type boolean * @default true * @public */ fade: boolean; /** * Used to apply Bootstrap's visibility class * * @property showHelp * @type boolean * @default false * @private */ showHelp: boolean; /** * Delay showing and hiding the tooltip/popover (ms). Individual delays for showing and hiding can be specified by using the * `delayShow` and `delayHide` properties. * * @property delay * @type number * @default 0 * @public */ delay: number; /** * Delay showing the tooltip/popover. This property overrides the general delay set with the `delay` property. * * @property delayShow * @type number * @default 0 * @public */ delayShow: number | NonNullable<import("@glimmer/component/-private/component").Args<Signature>["delay"]>; /** * Delay hiding the tooltip/popover. This property overrides the general delay set with the `delay` property. * * @property delayHide * @type number * @default 0 * @public */ delayHide: number | NonNullable<import("@glimmer/component/-private/component").Args<Signature>["delay"]>; /** * The duration of the fade transition * * @property transitionDuration * @type number * @default 150 * @public */ transitionDuration: number; /** * Keeps the tooltip/popover within the bounds of this element when `autoPlacement` is true. Can be any valid CSS selector. * * @property viewportSelector * @type string * @default 'body' * @see viewportPadding * @see autoPlacement * @public */ viewportSelector: string; /** * Take a padding into account for keeping the tooltip/popover within the bounds of the element given by `viewportSelector`. * * @property viewportPadding * @type number * @default 0 * @see viewportSelector * @see autoPlacement * @public */ viewportPadding: number; _parent?: Element | SimpleElement | null; _parentFinder: string | Text; /** * The DOM element of the arrow element. * * @property arrowElement * @type object * @readonly * @private */ abstract get arrowElement(): HTMLElement | null; /** * The wormhole destinationElement * * @property destinationElement * @type object * @readonly * @private */ get destinationElement(): Element | null | undefined; /** * The DOM element of the viewport element. * * @property viewportElement * @type object * @readonly * @private */ get viewportElement(): Element | null; /** * The DOM element that triggers the tooltip/popover. By default, it is the parent element of this component. * You can set this to any CSS selector to have any other element trigger the tooltip/popover. * * @property triggerElement * @type string | null * @public */ triggerElement: null; triggerTargetElement?: Element | SimpleElement | null; /** * @method getTriggerTargetElement * @private */ getTriggerTargetElement(): Element | SimpleElement | undefined | null; /** * The event(s) that should trigger the tooltip/popover - click | hover | focus. * You can set this to a single event or multiple events, given as an array or a string separated by spaces. * * @property triggerEvents * @type array|string * @default 'hover focus' * @public */ triggerEvents: string[] | string; get _triggerEvents(): (string | string[])[]; /** * If true component will render in place, rather than be wormholed. * * @property renderInPlace * @type boolean * @default false * @public */ /** * @property _renderInPlace * @type boolean * @private */ get _renderInPlace(): boolean | NonNullable<import("@glimmer/component/-private/component").Args<Signature>["renderInPlace"]>; /** * Current hover state, 'in', 'out' or null * * @property hoverState * @type number * @private */ hoverState: string; /** * Current state for events */ hover: boolean; focus: boolean; click: boolean; get shouldShowHelp(): boolean; /** * Ember.run timer * * @property timer * @private */ timer: Timer | null; /** * Use CSS transitions? * * @property usesTransition * @type boolean * @readonly * @private */ usesTransition: boolean; /** * The DOM element of the overlay element. * * @property overlayElement * @type object * @readonly * @private */ overlayElement: HTMLElement; /** * This action is called immediately when the tooltip/popover is about to be shown. * * @event onShow * @public */ /** * This action will be called when the tooltip/popover has been made visible to the user (will wait for CSS transitions to complete). * * @event onShown * @public */ /** * This action is called immediately when the tooltip/popover is about to be hidden. * * @event onHide * @public */ /** * This action is called when the tooltip/popover has finished being hidden from the user (will wait for CSS transitions to complete). * * @event onHidden * @public */ /** * Called when a show event has been received * * @method enter * @param e * @private */ enter(e?: Event): void; /** * Called when a hide event has been received * * @method leave * @param e * @private */ leave(e?: Event): void; /** * Called for a click event * * @method toggle * @private */ toggle(): void; /** * Show the tooltip/popover * * @method show * @private */ show(): void; _show(skipTransition?: boolean): void; /** * Position the tooltip/popover's arrow * * @method replaceArrow * @param delta * @param dimension * @param isVertical * @private */ replaceArrow(delta: number, dimension: number, isVertical: boolean): void; /** * Hide the tooltip/popover * * @method hide * @private */ hide(): void; /** * @method addListeners * @private */ addListeners(): void; /** * @method removeListeners * @private */ removeListeners(): void; /** * @method handleTriggerEvent * @private */ handleTriggerEvent(handler: (event: Event) => unknown, e: Event): unknown; _handleEnter(e: Event): void; _handleLeave(e: Event): void; _handleToggle(e: Event): void; close(): void; setup(): void; showOrHide(): void; willDestroy(): void; }