Trilium Frontend API
    Preparing search index...

    Interface Options

    interface Options {
        allowList: Record<
            keyof HTMLElementTagNameMap
            | "*",
            (string | RegExp)[],
        >;
        animation: boolean;
        boundary: Boundary;
        container: string | false | Element;
        customClass?: string | (() => string);
        delay: number | { hide: number; show: number };
        fallbackPlacements: string[];
        html: boolean;
        offset: string | Offset | OffsetFunction;
        placement: PopoverPlacement | (() => PopoverPlacement);
        popperConfig: Partial<Options> | PopperConfigFunction;
        sanitize: boolean;
        sanitizeFn: () => void;
        selector: string | false;
        template: string;
        title:
            | string
            | JQuery
            | Element
            | ((this: HTMLElement) => string | JQuery | Element);
        trigger:
            | "click"
            | "focus"
            | "hover"
            | "manual"
            | "click hover"
            | "click focus"
            | "hover focus"
            | "click hover focus";
    }
    Index

    Properties

    allowList animation boundary container customClass? delay fallbackPlacements html offset placement popperConfig sanitize sanitizeFn selector template title trigger

    Properties

    allowList: Record<keyof HTMLElementTagNameMap | "*", (string | RegExp)[]>

    Object which contains allowed attributes and tags

    https://v5.getbootstrap.com/docs/5.0/getting-started/javascript/#sanitizer

    animation: boolean

    Apply a CSS fade transition to the tooltip

    true
    boundary: Boundary

    Overflow constraint boundary of the popover. Accepts the values of 'viewport', 'window', 'scrollParent', or an HTMLElement reference (JavaScript only).

    https://popper.js.org/docs/v1/#modifiers..preventOverflow.boundariesElement

    'scrollParent'
    container: string | false | Element

    Appends the tooltip to a specific element. Example: container: 'body'. This option is particularly useful in that it allows you to position the tooltip in the flow of the document near the triggering element - which will prevent the tooltip from floating away from the triggering element during a window resize.

    false
    customClass?: string | (() => string)

    Add classes to the tooltip when it is shown. Note that these classes will be added in addition to any classes specified in the template. To add multiple classes, separate them with spaces: 'class-1 class-2'.

    You can also pass a function that should return a single string containing additional class names.

    ''
    delay: number | { hide: number; show: number }

    Delay showing and hiding the popover (ms) - does not apply to manual trigger type

    If a number is supplied, delay is applied to both hide/show

    0
    fallbackPlacements: string[]

    Allow to specify which position Popper will use on fallback.

    https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements

    ['top', 'right', 'bottom', 'left']
    html: boolean

    Allow HTML in the tooltip.

    If true, HTML tags in the tooltip's title will be rendered in the tooltip. If false, innerText property will be used to insert content into the DOM.

    Use text if you're worried about XSS attacks.

    false
    offset: string | Offset | OffsetFunction

    Offset of the tooltip relative to its target.

    When a function is used to determine the offset, it is called with an object containing the popper placement, the reference, and popper rects as its first argument. The triggering element DOM node is passed as the second argument. The function must return an array with two numbers: [skidding, distance].

    https://popper.js.org/docs/v2/modifiers/offset

    [0, 0]
    placement: PopoverPlacement | (() => PopoverPlacement)

    How to position the popover - auto | top | bottom | left | right. When auto is specified, it will dynamically reorient the popover.

    When a function is used to determine the placement, it is called with the popover DOM node as its first argument and the triggering element DOM node as its second. The this context is set to the popover instance.

    'top'
    popperConfig: Partial<Options> | PopperConfigFunction

    To change Bootstrap's default Popper.js config

    When a function is used to create the Popper configuration, it's called with an object that contains the Bootstrap's default Popper configuration. It helps you use and merge the default with your own configuration. The function must return a configuration object for Popper.

    https://popper.js.org/docs/v2

    null
    sanitize: boolean

    Enable or disable the sanitization. If activated 'template' and 'title' options will be sanitized.

    true
    sanitizeFn: () => void

    Here you can supply your own sanitize function. This can be useful if you prefer to use a dedicated library to perform sanitization.

    null
    selector: string | false

    If a selector is provided, tooltip objects will be delegated to the specified targets. In practice, this is used to also apply tooltips to dynamically added DOM elements (jQuery.on support).

    false
    template: string

    Base HTML to use when creating the tooltip.

    The tooltip's title will be injected into the .tooltip-inner.

    .tooltip-arrow will become the tooltip's arrow.

    The outermost wrapper element should have the .tooltip class and role="tooltip".

    '<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
    title:
        | string
        | JQuery
        | Element
        | ((this: HTMLElement) => string | JQuery | Element)

    Default title value if title attribute isn't present.

    If a function is given, it will be called with its this reference set to the element that the popover is attached to.

    ''
    trigger:
        | "click"
        | "focus"
        | "hover"
        | "manual"
        | "click hover"
        | "click focus"
        | "hover focus"
        | "click hover focus"

    How tooltip is triggered - click | hover | focus | manual. You may pass multiple triggers; separate them with a space.

    'manual' indicates that the tooltip will be triggered programmatically via the .tooltip('show'), .tooltip('hide') and .tooltip('toggle') methods; this value cannot be combined with any other trigger.

    'hover' on its own will result in tooltips that cannot be triggered via the keyboard, and should only be used if alternative methods for conveying the same information for keyboard users is present.

    'hover focus'

    Settings

    Member Visibility

    On This Page

    Properties