@skbkontur/react-ui 5.6.1-85c65.0 → 5.6.1

package/cjs/internal/Popup/PopupHelper.js

@@ -1,6 +1,6 @@
-"use strict";exports.__esModule = true;exports.PopupHelper = void 0;var _getDOMRect = require("../../lib/dom/getDOMRect");
+"use strict";exports.__esModule = true;exports.PopupHelper = void 0;var _globalObject = require("@skbkontur/global-object");
 
-var _globalObject = require("../../lib/globalObject");
+var _getDOMRect = require("../../lib/dom/getDOMRect");
 
 
 
@@ -31,14 +31,13 @@ function getPositionObject(position) {
 }
 
 function getElementAbsoluteRect(element) {
-  var globalObject = (0, _globalObject.getOwnerGlobalObject)(element);
   var rect = _getElementRelativeRect(element);
-  return convertRectToAbsolute(rect, globalObject);
+  return convertRectToAbsolute(rect);
 }
 
-function isAbsoluteRectFullyVisible(coordinates, popupRect, globalObject) {
-  var windowRelativeRect = _getWindowRelativeRect(globalObject);
-  var windowAbsoluteRect = convertRectToAbsolute(windowRelativeRect, globalObject);
+function isAbsoluteRectFullyVisible(coordinates, popupRect) {
+  var windowRelativeRect = _getWindowRelativeRect();
+  var windowAbsoluteRect = convertRectToAbsolute(windowRelativeRect);
   var absoluteRect = {
     top: coordinates.top,
     left: coordinates.left,
@@ -50,16 +49,16 @@ function isAbsoluteRectFullyVisible(coordinates, popupRect, globalObject) {
 }
 
 // Can become fully visible by scrolling into viewport
-function canBecomeFullyVisible(positionName, coordinates, globalObject) {
+function canBecomeFullyVisible(positionName, coordinates) {
   var position = getPositionObject(positionName);
 
   if (position.direction === 'top') {
-    var availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect(globalObject), globalObject);
+    var availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect());
     return coordinates.top + availableScrollDistances.top >= 0;
   }
 
   if (position.direction === 'left') {
-    var _availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect(globalObject), globalObject);
+    var _availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect());
     return coordinates.left + _availableScrollDistances.left >= 0;
   }
 
@@ -78,17 +77,17 @@ function _getElementRelativeRect(element) {
   };
 }
 
-function _getWindowRelativeRect(globalObject) {
+function _getWindowRelativeRect() {
   return {
     top: 0,
     left: 0,
-    width: _getViewProperty(function (x) {return x.clientWidth;}, globalObject) || globalObject.innerWidth || 0,
-    height: _getViewProperty(function (x) {return x.clientHeight;}, globalObject) || globalObject.innerHeight || 0
+    width: _getViewProperty(function (x) {return x.clientWidth;}) || _globalObject.globalObject.innerWidth || 0,
+    height: _getViewProperty(function (x) {return x.clientHeight;}) || _globalObject.globalObject.innerHeight || 0
   };
 }
 
-function convertRectToAbsolute(rect, globalObject) {
-  var offset = _getAbsoluteOffset(globalObject);
+function convertRectToAbsolute(rect) {
+  var offset = _getAbsoluteOffset();
 
   return {
     top: rect.top + offset.top,
@@ -98,12 +97,12 @@ function convertRectToAbsolute(rect, globalObject) {
   };
 }
 
-function _getAbsoluteOffset(globalObject) {
-  var scrollTop = globalObject.pageYOffset || _getViewProperty(function (x) {return x.scrollTop;}, globalObject);
-  var scrollLeft = globalObject.pageXOffset || _getViewProperty(function (x) {return x.scrollLeft;}, globalObject);
+function _getAbsoluteOffset() {
+  var scrollTop = _globalObject.globalObject.pageYOffset || _getViewProperty(function (x) {return x.scrollTop;});
+  var scrollLeft = _globalObject.globalObject.pageXOffset || _getViewProperty(function (x) {return x.scrollLeft;});
 
-  var clientTop = _getViewProperty(function (x) {return x.clientTop;}, globalObject);
-  var clientLeft = _getViewProperty(function (x) {return x.clientLeft;}, globalObject);
+  var clientTop = _getViewProperty(function (x) {return x.clientTop;});
+  var clientLeft = _getViewProperty(function (x) {return x.clientLeft;});
 
   var top = scrollTop - clientTop;
   var left = scrollLeft - clientLeft;
@@ -123,8 +122,8 @@ function _rectContainsRect(outerRect, innerRect) {
 
 }
 
-function _getViewProperty(getProperty, globalObject) {var _globalObject$documen, _globalObject$documen2;
-  var views = [(_globalObject$documen = globalObject.document) == null ? void 0 : _globalObject$documen.documentElement, (_globalObject$documen2 = globalObject.document) == null ? void 0 : _globalObject$documen2.body];
+function _getViewProperty(getProperty) {var _globalObject$documen, _globalObject$documen2;
+  var views = [(_globalObject$documen = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen.documentElement, (_globalObject$documen2 = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen2.body];
   return views.map(function (x) {return x && getProperty(x);}).find(Boolean) || 0;
 }
 

package/cjs/internal/Popup/PopupHelper.js.map

@@ -1 +1 @@
-{"version":3,"names":["_getDOMRect","require","_globalObject","getPositionObject","position","x","split","direction","align","getElementAbsoluteRect","element","globalObject","getOwnerGlobalObject","rect","_getElementRelativeRect","convertRectToAbsolute","isAbsoluteRectFullyVisible","coordinates","popupRect","windowRelativeRect","_getWindowRelativeRect","windowAbsoluteRect","absoluteRect","top","left","height","width","_rectContainsRect","canBecomeFullyVisible","positionName","availableScrollDistances","getDOMRect","right","bottom","_getViewProperty","clientWidth","innerWidth","clientHeight","innerHeight","offset","_getAbsoluteOffset","scrollTop","pageYOffset","scrollLeft","pageXOffset","clientTop","clientLeft","outerRect","innerRect","getProperty","_globalObject$documen","_globalObject$documen2","views","document","documentElement","body","map","find","Boolean","PopupHelper","exports","isFullyVisible"],"sources":["PopupHelper.tsx"],"sourcesContent":["import { getDOMRect } from '../../lib/dom/getDOMRect';\nimport type { GlobalObject } from '../../lib/globalObject';\nimport { getOwnerGlobalObject } from '../../lib/globalObject';\n\nimport type { PopupPositionsType } from './Popup';\n\nexport interface Rect {\n  top: number;\n  left: number;\n  width: number;\n  height: number;\n}\n\nexport interface Offset {\n  top: number;\n  left: number;\n}\n\nexport interface PositionObject {\n  direction: string;\n  align: string;\n}\n\nfunction getPositionObject(position: string): PositionObject {\n  const x = position.split(' ');\n\n  return {\n    direction: x[0],\n    align: x[1],\n  };\n}\n\nfunction getElementAbsoluteRect(element: Element): Rect {\n  const globalObject = getOwnerGlobalObject(element);\n  const rect = _getElementRelativeRect(element);\n  return convertRectToAbsolute(rect, globalObject);\n}\n\nfunction isAbsoluteRectFullyVisible(coordinates: Offset, popupRect: Rect, globalObject: GlobalObject): boolean {\n  const windowRelativeRect = _getWindowRelativeRect(globalObject);\n  const windowAbsoluteRect = convertRectToAbsolute(windowRelativeRect, globalObject);\n  const absoluteRect = {\n    top: coordinates.top,\n    left: coordinates.left,\n    height: popupRect.height,\n    width: popupRect.width,\n  };\n\n  return _rectContainsRect(windowAbsoluteRect, absoluteRect);\n}\n\n// Can become fully visible by scrolling into viewport\nfunction canBecomeFullyVisible(positionName: PopupPositionsType, coordinates: Offset, globalObject: GlobalObject) {\n  const position = getPositionObject(positionName);\n\n  if (position.direction === 'top') {\n    const availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect(globalObject), globalObject);\n    return coordinates.top + availableScrollDistances.top >= 0;\n  }\n\n  if (position.direction === 'left') {\n    const availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect(globalObject), globalObject);\n    return coordinates.left + availableScrollDistances.left >= 0;\n  }\n\n  // NOTE: for bottom/right cases browser will always expand document size\n  return true;\n}\n\nfunction _getElementRelativeRect(element: Element) {\n  const rect = getDOMRect(element);\n\n  return {\n    top: rect.top,\n    left: rect.left,\n    width: rect.right - rect.left,\n    height: rect.bottom - rect.top,\n  };\n}\n\nfunction _getWindowRelativeRect(globalObject: GlobalObject): Rect {\n  return {\n    top: 0,\n    left: 0,\n    width: _getViewProperty((x) => x.clientWidth, globalObject) || globalObject.innerWidth || 0,\n    height: _getViewProperty((x) => x.clientHeight, globalObject) || globalObject.innerHeight || 0,\n  };\n}\n\nfunction convertRectToAbsolute(rect: Rect, globalObject: GlobalObject): Rect {\n  const offset = _getAbsoluteOffset(globalObject);\n\n  return {\n    top: rect.top + offset.top,\n    left: rect.left + offset.left,\n    width: rect.width,\n    height: rect.height,\n  };\n}\n\nfunction _getAbsoluteOffset(globalObject: GlobalObject): Offset {\n  const scrollTop = globalObject.pageYOffset || _getViewProperty((x) => x.scrollTop, globalObject);\n  const scrollLeft = globalObject.pageXOffset || _getViewProperty((x) => x.scrollLeft, globalObject);\n\n  const clientTop = _getViewProperty((x) => x.clientTop, globalObject);\n  const clientLeft = _getViewProperty((x) => x.clientLeft, globalObject);\n\n  const top = scrollTop - clientTop;\n  const left = scrollLeft - clientLeft;\n\n  return {\n    top,\n    left,\n  };\n}\n\nfunction _rectContainsRect(outerRect: Rect, innerRect: Rect): boolean {\n  return (\n    innerRect.top > outerRect.top &&\n    innerRect.top + innerRect.height < outerRect.top + outerRect.height &&\n    innerRect.left > outerRect.left &&\n    innerRect.left + innerRect.width < outerRect.left + outerRect.width\n  );\n}\n\nfunction _getViewProperty(getProperty: (e: Element) => number, globalObject: GlobalObject): number {\n  const views = [globalObject.document?.documentElement, globalObject.document?.body];\n  return views.map((x) => x && getProperty(x)).find(Boolean) || 0;\n}\n\nexport const PopupHelper = {\n  getPositionObject,\n  getElementAbsoluteRect,\n  isFullyVisible: isAbsoluteRectFullyVisible,\n  canBecomeFullyVisible,\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_globalObject","require","_getDOMRect","getPositionObject","position","x","split","direction","align","getElementAbsoluteRect","element","rect","_getElementRelativeRect","convertRectToAbsolute","isAbsoluteRectFullyVisible","coordinates","popupRect","windowRelativeRect","_getWindowRelativeRect","windowAbsoluteRect","absoluteRect","top","left","height","width","_rectContainsRect","canBecomeFullyVisible","positionName","availableScrollDistances","getDOMRect","right","bottom","_getViewProperty","clientWidth","globalObject","innerWidth","clientHeight","innerHeight","offset","_getAbsoluteOffset","scrollTop","pageYOffset","scrollLeft","pageXOffset","clientTop","clientLeft","outerRect","innerRect","getProperty","_globalObject$documen","_globalObject$documen2","views","document","documentElement","body","map","find","Boolean","PopupHelper","exports","isFullyVisible"],"sources":["PopupHelper.tsx"],"sourcesContent":["import { globalObject } from '@skbkontur/global-object';\n\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport type { PopupPositionsType } from './Popup';\n\nexport interface Rect {\n  top: number;\n  left: number;\n  width: number;\n  height: number;\n}\n\nexport interface Offset {\n  top: number;\n  left: number;\n}\n\nexport interface PositionObject {\n  direction: string;\n  align: string;\n}\n\nfunction getPositionObject(position: string): PositionObject {\n  const x = position.split(' ');\n\n  return {\n    direction: x[0],\n    align: x[1],\n  };\n}\n\nfunction getElementAbsoluteRect(element: Element): Rect {\n  const rect = _getElementRelativeRect(element);\n  return convertRectToAbsolute(rect);\n}\n\nfunction isAbsoluteRectFullyVisible(coordinates: Offset, popupRect: Rect): boolean {\n  const windowRelativeRect = _getWindowRelativeRect();\n  const windowAbsoluteRect = convertRectToAbsolute(windowRelativeRect);\n  const absoluteRect = {\n    top: coordinates.top,\n    left: coordinates.left,\n    height: popupRect.height,\n    width: popupRect.width,\n  };\n\n  return _rectContainsRect(windowAbsoluteRect, absoluteRect);\n}\n\n// Can become fully visible by scrolling into viewport\nfunction canBecomeFullyVisible(positionName: PopupPositionsType, coordinates: Offset) {\n  const position = getPositionObject(positionName);\n\n  if (position.direction === 'top') {\n    const availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect());\n    return coordinates.top + availableScrollDistances.top >= 0;\n  }\n\n  if (position.direction === 'left') {\n    const availableScrollDistances = convertRectToAbsolute(_getWindowRelativeRect());\n    return coordinates.left + availableScrollDistances.left >= 0;\n  }\n\n  // NOTE: for bottom/right cases browser will always expand document size\n  return true;\n}\n\nfunction _getElementRelativeRect(element: Element) {\n  const rect = getDOMRect(element);\n\n  return {\n    top: rect.top,\n    left: rect.left,\n    width: rect.right - rect.left,\n    height: rect.bottom - rect.top,\n  };\n}\n\nfunction _getWindowRelativeRect(): Rect {\n  return {\n    top: 0,\n    left: 0,\n    width: _getViewProperty((x) => x.clientWidth) || globalObject.innerWidth || 0,\n    height: _getViewProperty((x) => x.clientHeight) || globalObject.innerHeight || 0,\n  };\n}\n\nfunction convertRectToAbsolute(rect: Rect): Rect {\n  const offset = _getAbsoluteOffset();\n\n  return {\n    top: rect.top + offset.top,\n    left: rect.left + offset.left,\n    width: rect.width,\n    height: rect.height,\n  };\n}\n\nfunction _getAbsoluteOffset(): Offset {\n  const scrollTop = globalObject.pageYOffset || _getViewProperty((x) => x.scrollTop);\n  const scrollLeft = globalObject.pageXOffset || _getViewProperty((x) => x.scrollLeft);\n\n  const clientTop = _getViewProperty((x) => x.clientTop);\n  const clientLeft = _getViewProperty((x) => x.clientLeft);\n\n  const top = scrollTop - clientTop;\n  const left = scrollLeft - clientLeft;\n\n  return {\n    top,\n    left,\n  };\n}\n\nfunction _rectContainsRect(outerRect: Rect, innerRect: Rect): boolean {\n  return (\n    innerRect.top > outerRect.top &&\n    innerRect.top + innerRect.height < outerRect.top + outerRect.height &&\n    innerRect.left > outerRect.left &&\n    innerRect.left + innerRect.width < outerRect.left + outerRect.width\n  );\n}\n\nfunction _getViewProperty(getProperty: (e: Element) => number): number {\n  const views = [globalObject.document?.documentElement, globalObject.document?.body];\n  return views.map((x) => x && getProperty(x)).find(Boolean) || 0;\n}\n\nexport const PopupHelper = {\n  getPositionObject,\n  getElementAbsoluteRect,\n  isFullyVisible: isAbsoluteRectFullyVisible,\n  canBecomeFullyVisible,\n};\n"],"mappings":"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","ignoreList":[]}

package/cjs/internal/Popup/PopupPin.d.ts

@@ -1,13 +1,29 @@
 import React from 'react';
 import type { Nullable } from '../../typings/utility-types';
-interface PopupPinProps {
-    /** Цвет фона пина */
+interface Props {
+    /**
+     * Цвет фон пина
+     */
     backgroundColor: string;
-    /** Смещение пина от края попапа. Край задаётся в пропе position вторым словом */
+    /**
+     * Цвет границы пина
+     */
+    borderColor: string;
+    /**
+     * Ширина границы пина
+     */
+    borderWidth: number;
+    /**
+     * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
+     */
     offset: number;
-    /** Ссылка на попап */
-    popupElement?: Nullable<Element>;
-    /** Позиция попапа, по которой будет вычислено положение пина */
+    /**
+     * Ссылка на попап
+     */
+    popupElement: Nullable<Element>;
+    /**
+     * Позиция попапа, по которой будет вычислено положение пина
+     */
     popupPosition: string;
     /**
      * Сторона пина без учёта границы.
@@ -16,19 +32,16 @@ interface PopupPinProps {
      */
     size: number;
 }
-export declare class PopupPin extends React.Component<PopupPinProps> {
+export declare class PopupPin extends React.Component<Props> {
     static __KONTUR_REACT_UI__: string;
     static displayName: string;
-    private positionObject;
-    private styles;
-    private emotion;
-    private cx;
     render(): React.JSX.Element | null;
     private getPopupOppositeDirection;
-    private getPinInlineStyle;
-    private getPinCoordinates;
+    private getWrapperStyle;
+    private getOuterStyle;
+    private getInnerStyle;
+    private getPinOptions;
     private getPinTopCoordinate;
     private getPinLeftCoordinate;
-    private getPinDirectionalStyle;
 }
 export {};

package/cjs/internal/Popup/PopupPin.js

@@ -1,58 +1,20 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.PopupPin = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _warning = _interopRequireDefault(require("warning"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.PopupPin = void 0;var _extends6 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 
 
-var _renderEnvironment = require("../../lib/renderEnvironment");
-
 
 var _PopupHelper = require("./PopupHelper");
 var _PopupPin2 = require("./PopupPin.styles");
-var _Popup = require("./Popup");var _class, _PopupPin;var
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-PopupPin = exports.PopupPin = (0, _renderEnvironment.withRenderEnvironment)(_class = (_PopupPin = /*#__PURE__*/function (_React$Component) {function PopupPin() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+var _Popup = require("./Popup");
 
+var borderStyles = {
+  position: 'absolute',
+  borderStyle: 'solid',
+  borderTopColor: 'transparent',
+  borderBottomColor: 'transparent',
+  borderLeftColor: 'transparent',
+  borderRightColor: 'transparent'
+};var
 
 
 
@@ -87,138 +49,212 @@ PopupPin = exports.PopupPin = (0, _renderEnvironment.withRenderEnvironment)(_cla
 
 
 
+PopupPin = exports.PopupPin = /*#__PURE__*/function (_React$Component) {function PopupPin() {return _React$Component.apply(this, arguments) || this;}(0, _inheritsLoose2.default)(PopupPin, _React$Component);var _proto = PopupPin.prototype;_proto.
 
 
 
+  render = function render() {
+    if (!this.props.popupElement) {
+      return null;
+    }
 
-    getPinInlineStyle = function (left, top) {var _defaultPinInlineStyl, _ref;
-      var direction = _this.getPopupOppositeDirection();
-      if (!direction) {
-        return;
-      }
+    var options = this.getPinOptions(
+      _PopupHelper.PopupHelper.getElementAbsoluteRect(this.props.popupElement),
+      _PopupHelper.PopupHelper.getPositionObject(this.props.popupPosition),
+      this.props.size,
+      this.props.offset,
+      this.props.borderWidth
+    );
 
-      // Добавляем запас в 1px, чтобы пофиксить случайные отделения пинов
-      var correctedLeft = left - 1;
-      var correctedTop = top - 1;
-      var correctedSize = _this.props.size + 1;
+    var styleOuter = this.getOuterStyle(
+      options.activeBorder,
+      options.outerSize,
+      this.props.borderColor
+    );
 
-      var defaultPinInlineStyle = (_defaultPinInlineStyl = {}, _defaultPinInlineStyl[
-      direction] = -_this.props.size + 'px', _defaultPinInlineStyl.
-      left = correctedLeft + 'px', _defaultPinInlineStyl.
-      width = correctedSize * 2 + 'px', _defaultPinInlineStyl.
-      height = correctedSize + 'px', _defaultPinInlineStyl.
-      backgroundColor = _this.props.backgroundColor, _defaultPinInlineStyl);
+    var styleInner = this.getInnerStyle(
+      options.activeBorder,
+      this.props.size,
+      this.props.backgroundColor
+    );
 
+    var styleWrapper = this.getWrapperStyle(options.outerLeft, options.outerTop, options.outerSize);
 
-      switch (direction) {
-        case 'top':
-        case 'bottom':
-          return defaultPinInlineStyle;
-        case 'left':
-        case 'right':
-          return _ref = {}, _ref[
-          direction] = -_this.props.size + 'px', _ref.
-          top = correctedTop + 'px', _ref.
-          height = correctedSize * 2 + 'px', _ref.
-          width = correctedSize + 'px', _ref.
-          backgroundColor = _this.props.backgroundColor, _ref;
+    return /*#__PURE__*/(
+      _react.default.createElement("div", { "data-tid": _Popup.PopupDataTids.popupPin, className: _PopupPin2.styles.wrapper(), style: styleWrapper }, /*#__PURE__*/
+      _react.default.createElement("div", { style: styleOuter }, /*#__PURE__*/
+      _react.default.createElement("div", { style: styleInner })
+      )
+      ));
 
-        default:
-          (0, _warning.default)(
-            false, "Can't get inline style: invalid direction '" +
-            direction + "'. Must be one of - 'top', 'right', 'bottom', 'left'."
-          );
-          return defaultPinInlineStyle;
-      }
-    };_this.
+  };_proto.
 
-    getPinCoordinates = function (popupElement) {
-      var popupRect = _PopupHelper.PopupHelper.getElementAbsoluteRect(popupElement);
-      var _this$positionObject = _this.positionObject,direction = _this$positionObject.direction,align = _this$positionObject.align;
+  getPopupOppositeDirection = function getPopupOppositeDirection() {
+    var popupDirection = _PopupHelper.PopupHelper.getPositionObject(this.props.popupPosition).direction;
+    switch (popupDirection) {
+      case 'top':
+        return 'bottom';
+      case 'bottom':
+        return 'top';
+      case 'left':
+        return 'right';
+      case 'right':
+        return 'left';
+      default:
+        throw new TypeError('Unknown direction ' + popupDirection);
+    }
+  };_proto.
 
-      var defaultPinCoordinates = {
-        top: popupRect.height,
-        left: _this.getPinLeftCoordinate(popupRect, align)
-      };
+  getWrapperStyle = function getWrapperStyle(left, top, borderWidth) {var _ref, _ref2;
+    var direction = this.getPopupOppositeDirection();
+    switch (direction) {
+      case 'top':
+      case 'bottom':
+        return _ref = {}, _ref[
+        direction] = -borderWidth + 'px', _ref.
+        left = left + 'px', _ref.
+        width = borderWidth * 2 + 'px', _ref.
+        height = borderWidth + 'px', _ref;
 
-      switch (direction) {
-        case 'top':
-          return defaultPinCoordinates;
-        case 'bottom':
-          return {
-            top: -2 * _this.props.size,
-            left: _this.getPinLeftCoordinate(popupRect, align)
-          };
-        case 'left':
-          return {
-            top: _this.getPinTopCoordinate(popupRect, align),
-            left: popupRect.width
-          };
-        case 'right':
-          return {
-            top: _this.getPinTopCoordinate(popupRect, align),
-            left: -2 * _this.props.size
-          };
-        default:
-          (0, _warning.default)(
-            false, "Can't get coordinates: invalid direction '" +
-            direction + "'. Must be one of - 'top', 'right', 'bottom', 'left'."
-          );
-          return defaultPinCoordinates;
-      }
-    };_this.
-
-    getPinTopCoordinate = function (popupRect, align) {
-      var defaultTopCoordinate = _this.props.offset;
-      switch (align) {
-        case 'top':
-          return defaultTopCoordinate;
-        case 'middle':
-          return popupRect.height / 2 - _this.props.size;
-        case 'bottom':
-          return popupRect.height - _this.props.offset - 2 * _this.props.size;
-        default:
-          (0, _warning.default)(
-            false, "Can't get top coordinate: invalid align '" +
-            align + "'. Must be one of - 'top', 'middle', 'bottom'."
-          );
-          return defaultTopCoordinate;
-      }
-    };_this.
-
-    getPinLeftCoordinate = function (popupRect, align) {
-      var defaultLetfCoordinate = popupRect.width / 2 - _this.props.size;
-      switch (align) {
-        case 'left':
-          return _this.props.offset;
-        case 'center':
-          return defaultLetfCoordinate;
-        case 'right':
-          return popupRect.width - _this.props.offset - 2 * _this.props.size;
-        default:
-          (0, _warning.default)(
-            false, "Can't get left coordinate: invalid align '" +
-            align + "'. Must be one of - 'left', 'center', 'right'."
-          );
-          return defaultLetfCoordinate;
-      }
-    };_this.
-
-    getPinDirectionalStyle = function () {
-      switch (_this.positionObject.direction) {
-        case 'top':
-          return _this.styles.pinTop();
-        case 'bottom':
-          return _this.styles.pinBottom();
-        case 'left':
-          return _this.styles.pinLeft();
-        case 'right':
-          return _this.styles.pinRight();
-        default:
-          (0, _warning.default)(
-            false, "Can't get directional style: invalid direction '" +
-            _this.positionObject.direction + "'. Must be one of - 'top', 'right', 'bottom', 'left'."
-          );
-          return _this.styles.pinTop();
-      }
-    };return _this;}(0, _inheritsLoose2.default)(PopupPin, _React$Component);var _proto = PopupPin.prototype;_proto.render = function render() {this.styles = (0, _PopupPin2.getStyles)(this.emotion);if (!this.props.popupElement) {return null;}this.positionObject = _PopupHelper.PopupHelper.getPositionObject(this.props.popupPosition);var coords = this.getPinCoordinates(this.props.popupElement);if (!coords || !coords.left || !coords.top) {return null;}var inlineStyle = this.getPinInlineStyle(coords.left, coords.top);var directionalStyle = this.getPinDirectionalStyle();if (!inlineStyle || !directionalStyle) {return null;}return /*#__PURE__*/_react.default.createElement("div", { "data-tid": _Popup.PopupDataTids.popupPin, className: this.cx(this.styles.pin(), directionalStyle), style: inlineStyle });};_proto.getPopupOppositeDirection = function getPopupOppositeDirection() {var popupDirection = _PopupHelper.PopupHelper.getPositionObject(this.props.popupPosition).direction;switch (popupDirection) {case 'top':return 'bottom';case 'bottom':return 'top';case 'left':return 'right';case 'right':return 'left';default:(0, _warning.default)(false, "Can't get opposite direction: invalid direction " + popupDirection + ". Must be one of - 'top', 'bottom', 'left', 'right'.");return 'bottom';}};return PopupPin;}(_react.default.Component), _PopupPin.__KONTUR_REACT_UI__ = 'PopupPin', _PopupPin.displayName = 'PopupPin', _PopupPin)) || _class;
+      case 'left':
+      case 'right':
+        return _ref2 = {}, _ref2[
+        direction] = -borderWidth + 'px', _ref2.
+        top = top + 'px', _ref2.
+        height = borderWidth * 2 + 'px', _ref2.
+        width = borderWidth + 'px', _ref2;
+
+      default:
+        throw new TypeError('Unknown direction ' + direction);
+    }
+  };_proto.
+
+  getOuterStyle = function getOuterStyle(activeBorder, borderWitdth, borderColor) {var _extends2, _extends3;
+    var direction = this.getPopupOppositeDirection();
+    switch (direction) {
+      case 'top':
+      case 'bottom':
+        return (0, _extends6.default)({},
+        borderStyles, (_extends2 = {}, _extends2[
+        direction] = -borderWitdth + 'px', _extends2.
+        left = '0px', _extends2.
+        borderWidth = borderWitdth + 'px', _extends2[
+        'border' + activeBorder + 'Color'] = borderColor, _extends2));
+
+      case 'left':
+      case 'right':
+        return (0, _extends6.default)({},
+        borderStyles, (_extends3 = {}, _extends3[
+        direction] = -borderWitdth + 'px', _extends3.
+        top = '0px', _extends3.
+        borderWidth = borderWitdth + 'px', _extends3[
+        'border' + activeBorder + 'Color'] = borderColor, _extends3));
+
+      default:
+        throw new TypeError('Unknown direction ' + direction);
+    }
+  };_proto.
+
+  getInnerStyle = function getInnerStyle(activeBorder, borderWitdth, borderColor) {var _extends4, _extends5;
+    var direction = this.getPopupOppositeDirection();
+    switch (direction) {
+      case 'top':
+      case 'bottom':
+        return (0, _extends6.default)({},
+        borderStyles, (_extends4 = {}, _extends4[
+        direction] = -borderWitdth + 2 + 'px', _extends4.
+        left = -borderWitdth + 'px', _extends4.
+        borderWidth = borderWitdth + 'px', _extends4[
+        'border' + activeBorder + 'Color'] = borderColor, _extends4));
+
+      case 'left':
+      case 'right':
+        return (0, _extends6.default)({},
+        borderStyles, (_extends5 = {}, _extends5[
+        direction] = -borderWitdth + 2 + 'px', _extends5.
+        top = -borderWitdth + 'px', _extends5.
+        borderWidth = borderWitdth + 'px', _extends5[
+        'border' + activeBorder + 'Color'] = borderColor, _extends5));
+
+      default:
+        throw new TypeError('Unknown direction ' + direction);
+    }
+  };_proto.
+
+  getPinOptions = function getPinOptions(
+  popupRect,
+  popupPosition,
+  pinSize,
+  pinOffset,
+  borderWidth)
+  {
+    var bordersDelta = 2 * borderWidth;
+    var outerSize = pinSize + bordersDelta;
+
+    switch (popupPosition.direction) {
+      case 'top':
+        return {
+          outerTop: popupRect.height,
+          outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,
+          innerTop: -outerSize,
+          innerLeft: -outerSize + bordersDelta,
+          activeBorder: 'Top',
+          outerSize: outerSize
+        };
+      case 'bottom':
+        return {
+          outerTop: -2 * outerSize,
+          outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,
+          innerTop: -outerSize + 2 * bordersDelta,
+          innerLeft: -outerSize + bordersDelta,
+          activeBorder: 'Bottom',
+          outerSize: outerSize
+        };
+      case 'left':
+        return {
+          outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,
+          outerLeft: popupRect.width,
+          innerTop: -outerSize + bordersDelta,
+          innerLeft: -outerSize,
+          activeBorder: 'Left',
+          outerSize: outerSize
+        };
+      case 'right':
+        return {
+          outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,
+          outerLeft: -2 * outerSize,
+          innerTop: -outerSize + bordersDelta,
+          innerLeft: -outerSize + 2 * bordersDelta,
+          activeBorder: 'Right',
+          outerSize: outerSize
+        };
+      default:
+        throw new Error('Direction must be one of top, right, bottom, left');
+    }
+  };_proto.
+
+  getPinTopCoordinate = function getPinTopCoordinate(popupRect, align, pinHeight, pinOffset) {
+    switch (align) {
+      case 'top':
+        return pinOffset;
+      case 'middle':
+        return popupRect.height / 2 - pinHeight;
+      case 'bottom':
+        return popupRect.height - pinOffset - 2 * pinHeight;
+      default:
+        throw new Error("Unexpected align '" + align + "'");
+    }
+  };_proto.
+
+  getPinLeftCoordinate = function getPinLeftCoordinate(popupRect, align, pinHeight, pinOffset) {
+    switch (align) {
+      case 'left':
+        return pinOffset;
+      case 'center':
+        return popupRect.width / 2 - pinHeight;
+      case 'right':
+        return popupRect.width - pinOffset - 2 * pinHeight;
+      default:
+        throw new Error("Unexpected align '" + align + "'");
+    }
+  };return PopupPin;}(_react.default.Component);PopupPin.__KONTUR_REACT_UI__ = 'PopupPin';PopupPin.displayName = 'PopupPin';