devextreme/animation/position.d.ts

HTML5 JavaScript Component Suite for Responsive Web Development

/**
* DevExtreme (animation/position.d.ts)
* Version: 23.2.6
* Build date: Wed May 01 2024
*
* Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
import {
    UserDefinedElement,
} from '../core/element';

import {
    HorizontalAlignment,
    PositionAlignment,
    VerticalAlignment,
} from '../common';

export type CollisionResolution = 'fit' | 'flip' | 'flipfit' | 'none';
export type CollisionResolutionCombination = 'fit' | 'fit flip' | 'fit flipfit' | 'fit none' | 'flip' | 'flip fit' | 'flip none' | 'flipfit' | 'flipfit fit' | 'flipfit none' | 'none' | 'none fit' | 'none flip' | 'none flipfit';

/**
 * Configures the position of an overlay element.
 */
export interface PositionConfig {
    /**
     * Specifies the target element's side or corner where the overlay element should be positioned.
     */
    at?: PositionAlignment | {
      /**
       * Specifies a position in the horizontal direction (for left, right, or center alignment).
       */
      x?: HorizontalAlignment;
      /**
       * Specifies a position in the vertical direction (for top, bottom, or center alignment).
       */
      y?: VerticalAlignment;
    };
    /**
     * A boundary element in which the overlay element must be positioned.
     */
    boundary?: string | UserDefinedElement | Window;
    /**
     * Specifies the offset of boundaries from the boundary element.
     */
    boundaryOffset?: string | {
      /**
       * Specifies a horizontal offset.
       */
      x?: number;
      /**
       * Specifies a vertical offset.
       */
      y?: number;
    };
    /**
     * Specifies how to resolve collisions - when the overlay element exceeds the boundary element.
     */
    collision?: CollisionResolutionCombination | {
      /**
       * Specifies how to resolve horizontal collisions.
       */
      x?: CollisionResolution;
      /**
       * Specifies how to resolve vertical collisions.
       */
      y?: CollisionResolution;
    };
    /**
     * Specifies the overlay element's side or corner to align with a target element.
     */
    my?: PositionAlignment | {
      /**
       * Specifies a position in the horizontal direction (for left, right, or center alignment).
       */
      x?: HorizontalAlignment;
      /**
       * Specifies a position in the vertical direction (for top, bottom, or center alignment).
       */
      y?: VerticalAlignment;
    };
    /**
     * The target element relative to which the overlay element should be positioned.
     */
    of?: string | UserDefinedElement | Window;
    /**
     * Specifies the overlay element's offset from a specified position.
     */
    offset?: string | {
      /**
       * Specifies a horizontal offset.
       */
      x?: number;
      /**
       * Specifies a vertical offset.
       */
      y?: number;
    };
}

/**
 * @deprecated Use the PositionConfig type instead
 */
export interface positionConfig extends PositionConfig { }