@jetbrains/ring-ui 5.1.23 → 5.1.24

package/dist/place-under-ng/place-under-ng.js

@@ -0,0 +1,157 @@
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.promise.js';
+import 'core-js/modules/es.array.map.js';
+import angular from 'angular';
+import debounce from 'just-debounce-it';
+import createResizeDetector from 'element-resize-detector';
+import { getDocumentScrollTop } from '../global/dom.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.object.assign.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
+import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.split.js';
+import 'core-js/modules/es.object.entries.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.set.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+
+var resizeDetector = createResizeDetector();
+var angularModule = angular.module('Ring.place-under', []);
+angularModule.directive('rgPlaceUnder', // eslint-disable-next-line angular/di-unused
+["$window", "getClosestElementWithCommonParent", "rgPlaceUnderHelper", function rgPlaceUnderDirective($window, getClosestElementWithCommonParent, rgPlaceUnderHelper) {
+  return {
+    restrict: 'A',
+    link: function link(scope, iElement, iAttrs) {
+      var element = iElement[0];
+      var synchronizer = rgPlaceUnderHelper.createPositionSynchronizer(element, iAttrs, scope);
+      function startSyncing(placeUnderSelector) {
+        if (placeUnderSelector) {
+          scope.$evalAsync(function () {
+            var syncWith = getClosestElementWithCommonParent(element, placeUnderSelector);
+            if (syncWith) {
+              synchronizer.syncPositionWith(syncWith);
+            } else {
+              throw new Error('rgPlaceUnder cannot find element to sync with.');
+            }
+          });
+        }
+      }
+      iAttrs.$observe('rgPlaceUnder', startSyncing);
+    }
+  };
+}]);
+angularModule.factory('getClosestElementWithCommonParent', function getClosestElementWithCommonParentFactory() {
+  return function getClosestElementWithCommonParent(currentElement, selector) {
+    var parent = currentElement.parentNode;
+    if (parent) {
+      return parent.querySelector(selector) || getClosestElementWithCommonParent(parent, selector);
+    } else {
+      return null;
+    }
+  };
+});
+angularModule.factory('rgPlaceUnderHelper', ["$window", function ($window) {
+  var DEBOUNCE_INTERVAL = 10;
+  var AFTER_SCROLL_RECHECK_INTERVAL = 50;
+  var HEIGHT_CHECK_INTERVAL = 50;
+  return {
+    DEBOUNCE_INTERVAL,
+    AFTER_SCROLL_RECHECK_INTERVAL,
+    HEIGHT_CHECK_INTERVAL,
+    createPositionSynchronizer: function createPositionSynchronizer(element, iAttrs, scope) {
+      var topOffset = parseInt(iAttrs.placeTopOffset, 10) || 0;
+      var syncHeight = iAttrs.syncHeight;
+      var syncBottom = [];
+      var removeScrollListener = [];
+      if (iAttrs.syncBottom) {
+        syncBottom = iAttrs.syncBottom.split(',');
+      }
+      function waitForNonZeroHeight(elementToCheck) {
+        return new Promise(function (resolve) {
+          function checkElementHeight() {
+            if (elementToCheck.offsetHeight === 0) {
+              $window.setTimeout(checkElementHeight, HEIGHT_CHECK_INTERVAL);
+            } else {
+              resolve();
+            }
+          }
+          checkElementHeight();
+        });
+      }
+      function onScroll(syncElement) {
+        var documentScrollTop = getDocumentScrollTop();
+        var documentOffsetHeight = $window.document.documentElement && $window.document.documentElement.offsetHeight || $window.document.body.offsetHeight;
+        var syncedElementHeight = syncElement.offsetHeight;
+        var syncedElementOffsetTop = syncElement.getBoundingClientRect().top + documentScrollTop;
+        var bottom = syncedElementOffsetTop + syncedElementHeight;
+        var margin = Math.max(bottom - documentScrollTop, syncedElementHeight);
+        element.style.marginTop = "".concat(margin + topOffset, "px");
+        if (syncHeight) {
+          /**
+           * Decrease height by margin value to make scroll work properly
+           */
+          var bottomOffset = 0;
+          if (syncBottom.length) {
+            for (var i = 0; i < syncBottom.length; i++) {
+              var syncBottomParams = syncBottom[i].split(';');
+              var elem = $window.document.querySelector(syncBottomParams[0]);
+              var extraMargin = syncBottomParams[1] ? parseInt(syncBottomParams[1], 10) : 0;
+              if (elem) {
+                var boundingRect = elem.getBoundingClientRect();
+                if (boundingRect.top === 0) {
+                  continue;
+                }
+                var marginTop = parseInt($window.getComputedStyle(elem).getPropertyValue('margin-top'), 10);
+                bottomOffset = documentOffsetHeight - boundingRect.top + marginTop + extraMargin;
+                if (bottomOffset < 0) {
+                  bottomOffset = 0;
+                }
+                break;
+              }
+            }
+          }
+          element.style.height = "calc(100% - ".concat(parseInt(element.style.marginTop, 10) + bottomOffset, "px)");
+        }
+      }
+      function removeScrollListeners() {
+        removeScrollListener.map(function (cb) {
+          return cb();
+        });
+        removeScrollListener = [];
+      }
+      function syncPositionWith(syncElement) {
+        var _this = this;
+        removeScrollListeners();
+        var afterScrollFinishRecheck = debounce(function () {
+          return _this.onScroll(syncElement);
+        }, AFTER_SCROLL_RECHECK_INTERVAL);
+        var sidebarScrollListener = debounce(function () {
+          _this.onScroll(syncElement);
+          afterScrollFinishRecheck();
+        }, DEBOUNCE_INTERVAL);
+        this.waitForNonZeroHeight(syncElement).then(sidebarScrollListener);
+        $window.addEventListener('scroll', sidebarScrollListener);
+        removeScrollListener.push(function () {
+          $window.removeEventListener('scroll', sidebarScrollListener);
+        });
+        removeScrollListener.push(scope.$watch('show', sidebarScrollListener));
+        removeScrollListener.push(scope.$on('rgPlaceUnder:sync', sidebarScrollListener));
+        var elementToHeightListening = iAttrs.listenToHeightChange ? $window.document.querySelector(iAttrs.listenToHeightChange) : $window.document.body;
+        resizeDetector.listenTo(elementToHeightListening, sidebarScrollListener);
+        removeScrollListener.push(function () {
+          return resizeDetector.removeAllListeners(elementToHeightListening);
+        });
+      }
+      scope.$on('$destroy', removeScrollListeners);
+      return {
+        waitForNonZeroHeight,
+        onScroll,
+        syncPositionWith
+      };
+    }
+  };
+}]);
+var PlaceUnder = angularModule.name;
+
+export { PlaceUnder as default };

package/dist/popup/popup.consts.d.ts

@@ -0,0 +1,37 @@
+export declare enum Directions {
+    BOTTOM_RIGHT = "BOTTOM_RIGHT",
+    BOTTOM_LEFT = "BOTTOM_LEFT",
+    BOTTOM_CENTER = "BOTTOM_CENTER",
+    TOP_LEFT = "TOP_LEFT",
+    TOP_RIGHT = "TOP_RIGHT",
+    TOP_CENTER = "TOP_CENTER",
+    RIGHT_TOP = "RIGHT_TOP",
+    RIGHT_BOTTOM = "RIGHT_BOTTOM",
+    RIGHT_CENTER = "RIGHT_CENTER",
+    LEFT_TOP = "LEFT_TOP",
+    LEFT_BOTTOM = "LEFT_BOTTOM",
+    LEFT_CENTER = "LEFT_CENTER"
+}
+/**
+ * When positioning a popup, directions will be tried in the listed order.
+ * @type {Array.<string>}
+ */
+export declare const DEFAULT_DIRECTIONS: Directions[];
+/**
+ * @enum {number}
+ */
+export declare enum Dimension {
+    MARGIN = 16,
+    BORDER_WIDTH = 1
+}
+export declare enum MinWidth {
+    TARGET = -1
+}
+export declare enum MaxHeight {
+    SCREEN = -1
+}
+export declare enum Display {
+    HIDDEN = 0,
+    SHOWING = 1,
+    SHOWN = 2
+}

package/dist/popup/popup.consts.js

@@ -0,0 +1,44 @@
+var Directions;
+(function (Directions) {
+  Directions["BOTTOM_RIGHT"] = "BOTTOM_RIGHT";
+  Directions["BOTTOM_LEFT"] = "BOTTOM_LEFT";
+  Directions["BOTTOM_CENTER"] = "BOTTOM_CENTER";
+  Directions["TOP_LEFT"] = "TOP_LEFT";
+  Directions["TOP_RIGHT"] = "TOP_RIGHT";
+  Directions["TOP_CENTER"] = "TOP_CENTER";
+  Directions["RIGHT_TOP"] = "RIGHT_TOP";
+  Directions["RIGHT_BOTTOM"] = "RIGHT_BOTTOM";
+  Directions["RIGHT_CENTER"] = "RIGHT_CENTER";
+  Directions["LEFT_TOP"] = "LEFT_TOP";
+  Directions["LEFT_BOTTOM"] = "LEFT_BOTTOM";
+  Directions["LEFT_CENTER"] = "LEFT_CENTER";
+})(Directions || (Directions = {}));
+/**
+ * When positioning a popup, directions will be tried in the listed order.
+ * @type {Array.<string>}
+ */
+var DEFAULT_DIRECTIONS = [Directions.BOTTOM_RIGHT, Directions.BOTTOM_LEFT, Directions.TOP_LEFT, Directions.TOP_RIGHT, Directions.RIGHT_TOP, Directions.RIGHT_BOTTOM, Directions.LEFT_TOP, Directions.LEFT_BOTTOM];
+/**
+ * @enum {number}
+ */
+var Dimension;
+(function (Dimension) {
+  Dimension[Dimension["MARGIN"] = 16] = "MARGIN";
+  Dimension[Dimension["BORDER_WIDTH"] = 1] = "BORDER_WIDTH";
+})(Dimension || (Dimension = {}));
+var MinWidth;
+(function (MinWidth) {
+  MinWidth[MinWidth["TARGET"] = -1] = "TARGET";
+})(MinWidth || (MinWidth = {}));
+var MaxHeight;
+(function (MaxHeight) {
+  MaxHeight[MaxHeight["SCREEN"] = -1] = "SCREEN";
+})(MaxHeight || (MaxHeight = {}));
+var Display;
+(function (Display) {
+  Display[Display["HIDDEN"] = 0] = "HIDDEN";
+  Display[Display["SHOWING"] = 1] = "SHOWING";
+  Display[Display["SHOWN"] = 2] = "SHOWN";
+})(Display || (Display = {}));
+
+export { DEFAULT_DIRECTIONS, Dimension, Directions, Display, MaxHeight, MinWidth };

package/dist/popup/popup.d.ts

@@ -0,0 +1,147 @@
+/**
+ * @name Popup
+ */
+import React, { PureComponent, ReactNode, CSSProperties, SyntheticEvent } from 'react';
+import { Listeners } from '../global/dom';
+import { PositionStyles } from './position';
+import { Dimension, Directions, Display, MaxHeight, MinWidth } from './popup.consts';
+import { PopupTargetContext, PopupTarget } from './popup.target';
+export { PopupTargetContext, PopupTarget };
+export declare const getPopupContainer: (target: string | Element) => Element | null;
+export interface BasePopupProps {
+    hidden: boolean;
+    onOutsideClick: (e: PointerEvent) => void;
+    onEscPress: (e: KeyboardEvent) => void;
+    onCloseAttempt: (e?: Event | SyntheticEvent, isEsc?: boolean | undefined) => void;
+    dontCloseOnAnchorClick: boolean;
+    shortcuts: boolean;
+    keepMounted: boolean;
+    directions: readonly Directions[];
+    autoPositioning: boolean;
+    autoPositioningOnScroll: boolean;
+    autoCorrectTopOverflow: boolean;
+    left: number;
+    top: number;
+    sidePadding: number;
+    attached: boolean;
+    trapFocus: boolean;
+    autoFocusFirst: boolean;
+    offset: number;
+    legacy: boolean;
+    withTail?: boolean;
+    tailOffset?: number;
+    anchorElement?: HTMLElement | null | undefined;
+    target?: string | Element | null | undefined;
+    className?: string | null | undefined;
+    style?: CSSProperties | undefined;
+    'data-test'?: string | null | undefined;
+    client?: boolean | null | undefined;
+    maxHeight?: number | 'screen' | null | undefined;
+    minWidth?: number | 'target' | null | undefined;
+    onMouseDown?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
+    onMouseUp?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
+    onMouseOver?: ((e: React.SyntheticEvent<HTMLElement>) => void) | undefined;
+    onMouseOut?: ((e: React.SyntheticEvent<HTMLElement>) => void) | undefined;
+    onContextMenu?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
+    onDirectionChange?: ((direction: Directions) => void) | null | undefined;
+    onShow?: (() => void) | null | undefined;
+    children?: ReactNode;
+}
+export interface PopupProps extends BasePopupProps {
+    children: ReactNode;
+}
+interface PopupState {
+    display: Display;
+    client?: boolean;
+    direction?: Directions;
+}
+/**
+ * @constructor
+ * @name Popup
+ * @extends {ReactComponent}
+ */
+export default class Popup<P extends BasePopupProps = PopupProps> extends PureComponent<P, PopupState> {
+    static defaultProps: {
+        shortcuts: boolean;
+        hidden: boolean;
+        onOutsideClick(): void;
+        onEscPress(): void;
+        onCloseAttempt(): void;
+        dontCloseOnAnchorClick: boolean;
+        keepMounted: boolean;
+        directions: Directions[];
+        autoPositioning: boolean;
+        autoPositioningOnScroll: boolean;
+        autoCorrectTopOverflow: boolean;
+        left: number;
+        top: number;
+        offset: number;
+        sidePadding: number;
+        attached: boolean;
+        trapFocus: boolean;
+        autoFocusFirst: boolean;
+        legacy: boolean;
+    };
+    state: PopupState;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: BasePopupProps, prevState: PopupState): void;
+    componentWillUnmount(): void;
+    popup?: HTMLElement | null;
+    node?: HTMLElement | null;
+    parent?: HTMLElement | null;
+    container?: HTMLElement | null;
+    ringPopupTarget?: string | Element;
+    shouldUseShortcuts(): boolean;
+    listeners: Listeners;
+    redrawScheduler: (cb: () => void) => void;
+    uid: string;
+    calculateDisplay: (prevState: PopupState) => {
+        display: Display;
+        client?: boolean | undefined;
+        direction?: Directions | undefined;
+    };
+    static PopupProps: {
+        Directions: typeof Directions;
+        Dimension: typeof Dimension;
+        MinWidth: typeof MinWidth;
+        MaxHeight: typeof MaxHeight;
+    };
+    portalRef: (el: HTMLElement | null) => void;
+    popupRef: (el: HTMLElement | null) => void;
+    containerRef: (el: HTMLElement | null) => void;
+    getContainer(): "" | Element | null | undefined;
+    position(): {
+        styles: PositionStyles;
+        direction: Directions | null;
+    };
+    private _updateDirection;
+    private _updatePosition;
+    private _redraw;
+    private _getAnchor;
+    private _listenersEnabled?;
+    /**
+     * @param {boolean} enable
+     * @private
+     */
+    private _setListenersEnabled;
+    /**
+     * Returns visibility state
+     * @return {boolean}
+     */
+    isVisible(): boolean;
+    _onCloseAttempt(evt?: Event | SyntheticEvent, isEsc?: boolean): void;
+    private _onEscPress;
+    /**
+     * @param {jQuery.Event} evt
+     * @private
+     */
+    private _onDocumentClick;
+    getInternalContent(): React.JSX.Element | P["children"] | undefined;
+    shortcutsScope: string;
+    shortcutsMap: {
+        esc: (evt: KeyboardEvent) => void;
+    };
+    render(): React.JSX.Element;
+}
+export type PopupAttrs = JSX.LibraryManagedAttributes<typeof Popup, PopupProps>;
+export type BasePopupAttrs = JSX.LibraryManagedAttributes<typeof Popup, BasePopupProps>;