popper.js

  • Version 1.16.1
  • Published
  • 1.72 MB
  • No dependencies
  • MIT license

Install

npm i popper.js
yarn add popper.js
pnpm add popper.js

Overview

A kickass library to manage your poppers

Index

Classes

class Popper

class Popper {}

    constructor

    constructor(
    reference: Element | Popper.ReferenceObject,
    popper: Element,
    options?: Popper.PopperOptions
    );

      property Defaults

      static Defaults: Popper.PopperOptions;

        property modifiers

        static modifiers: (Popper.BaseModifier & { name: string })[];

          property options

          options: Popper.PopperOptions;

            property placements

            static placements: Popper.Placement[];

              property popper

              popper: Element;

                property reference

                reference: Element | Popper.ReferenceObject;

                  method destroy

                  destroy: () => void;

                    method disableEventListeners

                    disableEventListeners: () => void;

                      method enableEventListeners

                      enableEventListeners: () => void;

                        method scheduleUpdate

                        scheduleUpdate: () => void;

                          method update

                          update: () => void;

                            Type Aliases

                            type BaseModifier

                            type BaseModifier = Popper.BaseModifier;

                              type Behavior

                              type Behavior = Popper.Behavior;

                                type Boundary

                                type Boundary = Popper.Boundary;

                                  type Data

                                  type Data = Popper.Data;

                                    type ModifierFn

                                    type ModifierFn = Popper.ModifierFn;

                                      type Modifiers

                                      type Modifiers = Popper.Modifiers;

                                        type Offset

                                        type Offset = Popper.Offset;

                                          type Padding

                                          type Padding = Popper.Padding;

                                            type Placement

                                            type Placement = Popper.Placement;

                                              type PopperOptions

                                              type PopperOptions = Popper.PopperOptions;

                                                type Position

                                                type Position = Popper.Position;

                                                  type ReferenceObject

                                                  type ReferenceObject = Popper.ReferenceObject;

                                                    Namespaces

                                                    namespace Popper

                                                    namespace Popper {}
                                                    • This kind of namespace declaration is not necessary, but is kept here for backwards-compatibility with popper.js 1.x. It can be removed in 2.x so that the default export is simply the Popper class and all the types / interfaces are top-level named exports.

                                                    interface Attributes

                                                    interface Attributes {}

                                                      property 'x-out-of-boundaries'

                                                      'x-out-of-boundaries': '' | false;

                                                        property 'x-placement'

                                                        'x-placement': Placement;

                                                          interface BaseModifier

                                                          interface BaseModifier {}

                                                            property enabled

                                                            enabled?: boolean;

                                                              property fn

                                                              fn?: ModifierFn;

                                                                property order

                                                                order?: number;

                                                                  interface Data

                                                                  interface Data {}

                                                                    property arrowElement

                                                                    arrowElement: Element;

                                                                      property arrowStyles

                                                                      arrowStyles: CSSStyleDeclaration;

                                                                        property attributes

                                                                        attributes: Attributes;

                                                                          property boundaries

                                                                          boundaries: Object;

                                                                            property flipped

                                                                            flipped: boolean;

                                                                              property hide

                                                                              hide: boolean;

                                                                                property instance

                                                                                instance: Popper;

                                                                                  property offsets

                                                                                  offsets: {
                                                                                  popper: Offset;
                                                                                  reference: Offset;
                                                                                  arrow: {
                                                                                  top: number;
                                                                                  left: number;
                                                                                  };
                                                                                  };

                                                                                    property originalPlacement

                                                                                    originalPlacement: Placement;

                                                                                      property placement

                                                                                      placement: Placement;

                                                                                        property styles

                                                                                        styles: CSSStyleDeclaration;

                                                                                          interface Modifiers

                                                                                          interface Modifiers {}

                                                                                            property applyStyle

                                                                                            applyStyle?: BaseModifier & {
                                                                                            onLoad?: Function;
                                                                                            gpuAcceleration?: boolean;
                                                                                            };

                                                                                              property arrow

                                                                                              arrow?: BaseModifier & {
                                                                                              element?: string | Element;
                                                                                              };

                                                                                                property computeStyle

                                                                                                computeStyle?: BaseModifier & {
                                                                                                gpuAcceleration?: boolean;
                                                                                                x?: 'bottom' | 'top';
                                                                                                y?: 'left' | 'right';
                                                                                                };

                                                                                                  property flip

                                                                                                  flip?: BaseModifier & {
                                                                                                  behavior?: Behavior | Position[];
                                                                                                  padding?: number | Padding;
                                                                                                  boundariesElement?: Boundary | Element;
                                                                                                  flipVariations?: boolean;
                                                                                                  flipVariationsByContent?: boolean;
                                                                                                  };

                                                                                                    property hide

                                                                                                    hide?: BaseModifier;

                                                                                                      property inner

                                                                                                      inner?: BaseModifier;

                                                                                                        property keepTogether

                                                                                                        keepTogether?: BaseModifier;

                                                                                                          property offset

                                                                                                          offset?: BaseModifier & {
                                                                                                          offset?: number | string;
                                                                                                          };

                                                                                                            property preventOverflow

                                                                                                            preventOverflow?: BaseModifier & {
                                                                                                            priority?: Position[];
                                                                                                            padding?: number | Padding;
                                                                                                            boundariesElement?: Boundary | Element;
                                                                                                            escapeWithReference?: boolean;
                                                                                                            };

                                                                                                              property shift

                                                                                                              shift?: BaseModifier;

                                                                                                                index signature

                                                                                                                [name: string]: (BaseModifier & Record<string, any>) | undefined;

                                                                                                                  interface Offset

                                                                                                                  interface Offset {}

                                                                                                                    property height

                                                                                                                    height: number;

                                                                                                                      property left

                                                                                                                      left: number;

                                                                                                                        property top

                                                                                                                        top: number;

                                                                                                                          property width

                                                                                                                          width: number;

                                                                                                                            interface Padding

                                                                                                                            interface Padding {}

                                                                                                                              property bottom

                                                                                                                              bottom?: number;

                                                                                                                                property left

                                                                                                                                left?: number;

                                                                                                                                  property right

                                                                                                                                  right?: number;

                                                                                                                                    property top

                                                                                                                                    top?: number;

                                                                                                                                      interface PopperOptions

                                                                                                                                      interface PopperOptions {}

                                                                                                                                        property eventsEnabled

                                                                                                                                        eventsEnabled?: boolean;

                                                                                                                                          property modifiers

                                                                                                                                          modifiers?: Modifiers;

                                                                                                                                            property placement

                                                                                                                                            placement?: Placement;

                                                                                                                                              property positionFixed

                                                                                                                                              positionFixed?: boolean;

                                                                                                                                                property removeOnDestroy

                                                                                                                                                removeOnDestroy?: boolean;

                                                                                                                                                  method onCreate

                                                                                                                                                  onCreate: (data: Data) => void;

                                                                                                                                                    method onUpdate

                                                                                                                                                    onUpdate: (data: Data) => void;

                                                                                                                                                      interface ReferenceObject

                                                                                                                                                      interface ReferenceObject {}

                                                                                                                                                        property clientHeight

                                                                                                                                                        clientHeight: number;

                                                                                                                                                          property clientWidth

                                                                                                                                                          clientWidth: number;

                                                                                                                                                            property referenceNode

                                                                                                                                                            referenceNode?: Node;

                                                                                                                                                              method getBoundingClientRect

                                                                                                                                                              getBoundingClientRect: () => ClientRect;

                                                                                                                                                                type Behavior

                                                                                                                                                                type Behavior = 'flip' | 'clockwise' | 'counterclockwise';

                                                                                                                                                                  type Boundary

                                                                                                                                                                  type Boundary = 'scrollParent' | 'viewport' | 'window';

                                                                                                                                                                    type ModifierFn

                                                                                                                                                                    type ModifierFn = (data: Data, options: Object) => Data;

                                                                                                                                                                      type Placement

                                                                                                                                                                      type Placement =
                                                                                                                                                                      | 'auto-start'
                                                                                                                                                                      | 'auto'
                                                                                                                                                                      | 'auto-end'
                                                                                                                                                                      | 'top-start'
                                                                                                                                                                      | 'top'
                                                                                                                                                                      | 'top-end'
                                                                                                                                                                      | 'right-start'
                                                                                                                                                                      | 'right'
                                                                                                                                                                      | 'right-end'
                                                                                                                                                                      | 'bottom-end'
                                                                                                                                                                      | 'bottom'
                                                                                                                                                                      | 'bottom-start'
                                                                                                                                                                      | 'left-end'
                                                                                                                                                                      | 'left'
                                                                                                                                                                      | 'left-start';

                                                                                                                                                                        type Position

                                                                                                                                                                        type Position = 'top' | 'right' | 'bottom' | 'left';

                                                                                                                                                                          Package Files (1)

                                                                                                                                                                          Dependencies (0)

                                                                                                                                                                          No dependencies.

                                                                                                                                                                          Dev Dependencies (7)

                                                                                                                                                                          Peer Dependencies (0)

                                                                                                                                                                          No peer dependencies.

                                                                                                                                                                          Badge

                                                                                                                                                                          To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                          You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/popper.js.

                                                                                                                                                                          • Markdown
                                                                                                                                                                            [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/popper.js)
                                                                                                                                                                          • HTML
                                                                                                                                                                            <a href="https://www.jsdocs.io/package/popper.js"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>