rc-mentions - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

es/KeywordTrigger.d.ts

 import * as React from 'react';
 import { OptionProps } from './Option';
-import { Placement } from './Mentions';
+import { Placement, Direction } from './Mentions';
 interface KeywordTriggerProps {
@@ -9,2 +9,3 @@ loading?: boolean;
     placement?: Placement;
+    direction?: Direction;
     visible?: boolean;
@@ -18,4 +19,5 @@ transitionName?: string;
     getDropdownElement: () => JSX.Element;
+    getDropDownPlacement: () => string;
     render(): JSX.Element;
 }
 export default KeywordTrigger;

es/KeywordTrigger.js

@@ -31,2 +31,10 @@ function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
   },
+  bottomLeft: {
+    points: ['tr', 'bl'],
+    offset: [0, 4],
+    overflow: {
+      adjustX: 0,
+      adjustY: 1
+    }
+  },
   topRight: {
@@ -39,2 +47,10 @@ points: ['bl', 'tr'],
     }
+  },
+  topLeft: {
+    points: ['br', 'tl'],
+    offset: [0, -4],
+    overflow: {
+      adjustX: 0,
+      adjustY: 1
+    }
   }
@@ -67,2 +83,17 @@ };
 
+    _this.getDropDownPlacement = function () {
+      var _this$props = _this.props,
+          placement = _this$props.placement,
+          direction = _this$props.direction;
+      var popupPlacement = 'topRight';
+
+      if (direction === 'rtl') {
+        popupPlacement = placement === 'top' ? 'topLeft' : 'bottomLeft';
+      } else {
+        popupPlacement = placement === 'top' ? 'topRight' : 'bottomRight';
+      }
+
+      return popupPlacement;
+    };
+
     return _this;
@@ -74,8 +105,7 @@ }
     value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          visible = _this$props.visible,
-          placement = _this$props.placement,
-          transitionName = _this$props.transitionName,
-          getPopupContainer = _this$props.getPopupContainer;
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          visible = _this$props2.visible,
+          transitionName = _this$props2.transitionName,
+          getPopupContainer = _this$props2.getPopupContainer;
       var popupElement = this.getDropdownElement();
@@ -86,3 +116,3 @@ return React.createElement(Trigger, {
         popup: popupElement,
-        popupPlacement: placement === 'top' ? 'topRight' : 'bottomRight',
+        popupPlacement: this.getDropDownPlacement(),
         popupTransitionName: transitionName,
@@ -89,0 +119,0 @@ builtinPlacements: BUILT_IN_PLACEMENTS,

es/Mentions.d.ts

@@ -6,2 +6,3 @@ import * as React from 'react';
 export declare type Placement = 'top' | 'bottom';
+export declare type Direction = 'ltr' | 'rtl';
 export interface MentionsProps extends BaseTextareaAttrs {
@@ -16,2 +17,3 @@ autoFocus?: boolean;
     placement?: Placement;
+    direction?: Direction;
     prefix?: string | string[];
@@ -18,0 +20,0 @@ prefixCls?: string;

es/Mentions.js

@@ -339,2 +339,3 @@ function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
           placement = _this$props4.placement,
+          direction = _this$props4.direction,
           transitionName = _this$props4.transitionName,
@@ -346,3 +347,3 @@ className = _this$props4.className,
           getPopupContainer = _this$props4.getPopupContainer,
-          restProps = _objectWithoutProperties(_this$props4, ["prefixCls", "placement", "transitionName", "className", "style", "autoFocus", "notFoundContent", "getPopupContainer"]);
+          restProps = _objectWithoutProperties(_this$props4, ["prefixCls", "placement", "direction", "transitionName", "className", "style", "autoFocus", "notFoundContent", "getPopupContainer"]);
 
@@ -380,2 +381,3 @@ var inputProps = omit(restProps, 'value', 'defaultValue', 'prefix', 'split', 'children', 'validateSearch', 'filterOption', 'onSelect', 'onSearch');
         placement: placement,
+        direction: direction,
         options: options,
@@ -382,0 +384,0 @@ visible: true,

lib/KeywordTrigger.d.ts

 import * as React from 'react';
 import { OptionProps } from './Option';
-import { Placement } from './Mentions';
+import { Placement, Direction } from './Mentions';
 interface KeywordTriggerProps {
@@ -9,2 +9,3 @@ loading?: boolean;
     placement?: Placement;
+    direction?: Direction;
     visible?: boolean;
@@ -18,4 +19,5 @@ transitionName?: string;
     getDropdownElement: () => JSX.Element;
+    getDropDownPlacement: () => string;
     render(): JSX.Element;
 }
 export default KeywordTrigger;

lib/KeywordTrigger.js

@@ -45,2 +45,10 @@ "use strict";
   },
+  bottomLeft: {
+    points: ['tr', 'bl'],
+    offset: [0, 4],
+    overflow: {
+      adjustX: 0,
+      adjustY: 1
+    }
+  },
   topRight: {
@@ -53,2 +61,10 @@ points: ['bl', 'tr'],
     }
+  },
+  topLeft: {
+    points: ['br', 'tl'],
+    offset: [0, -4],
+    overflow: {
+      adjustX: 0,
+      adjustY: 1
+    }
   }
@@ -81,2 +97,17 @@ };
 
+    _this.getDropDownPlacement = function () {
+      var _this$props = _this.props,
+          placement = _this$props.placement,
+          direction = _this$props.direction;
+      var popupPlacement = 'topRight';
+
+      if (direction === 'rtl') {
+        popupPlacement = placement === 'top' ? 'topLeft' : 'bottomLeft';
+      } else {
+        popupPlacement = placement === 'top' ? 'topRight' : 'bottomRight';
+      }
+
+      return popupPlacement;
+    };
+
     return _this;
@@ -88,8 +119,7 @@ }
     value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          visible = _this$props.visible,
-          placement = _this$props.placement,
-          transitionName = _this$props.transitionName,
-          getPopupContainer = _this$props.getPopupContainer;
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          visible = _this$props2.visible,
+          transitionName = _this$props2.transitionName,
+          getPopupContainer = _this$props2.getPopupContainer;
       var popupElement = this.getDropdownElement();
@@ -100,3 +130,3 @@ return React.createElement(_rcTrigger.default, {
         popup: popupElement,
-        popupPlacement: placement === 'top' ? 'topRight' : 'bottomRight',
+        popupPlacement: this.getDropDownPlacement(),
         popupTransitionName: transitionName,
@@ -103,0 +133,0 @@ builtinPlacements: BUILT_IN_PLACEMENTS,

lib/Mentions.d.ts

@@ -6,2 +6,3 @@ import * as React from 'react';
 export declare type Placement = 'top' | 'bottom';
+export declare type Direction = 'ltr' | 'rtl';
 export interface MentionsProps extends BaseTextareaAttrs {
@@ -16,2 +17,3 @@ autoFocus?: boolean;
     placement?: Placement;
+    direction?: Direction;
     prefix?: string | string[];
@@ -18,0 +20,0 @@ prefixCls?: string;

lib/Mentions.js

@@ -357,2 +357,3 @@ "use strict";
           placement = _this$props4.placement,
+          direction = _this$props4.direction,
           transitionName = _this$props4.transitionName,
@@ -364,3 +365,3 @@ className = _this$props4.className,
           getPopupContainer = _this$props4.getPopupContainer,
-          restProps = _objectWithoutProperties(_this$props4, ["prefixCls", "placement", "transitionName", "className", "style", "autoFocus", "notFoundContent", "getPopupContainer"]);
+          restProps = _objectWithoutProperties(_this$props4, ["prefixCls", "placement", "direction", "transitionName", "className", "style", "autoFocus", "notFoundContent", "getPopupContainer"]);
 
@@ -398,2 +399,3 @@ var inputProps = (0, _util.omit)(restProps, 'value', 'defaultValue', 'prefix', 'split', 'children', 'validateSearch', 'filterOption', 'onSelect', 'onSearch');
         placement: placement,
+        direction: direction,
         options: options,
@@ -400,0 +402,0 @@ visible: true,

package.json

 {
   "name": "rc-mentions",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "React Mentions",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -73,2 +73,3 @@ # rc-mentions
 | placement | Set popup placement | 'top' \| 'bottom' | 'bottom' |
+| direction | Set popup direction | 'ltr' \| 'rtl' | 'ltr' |
 | prefix | Set trigger prefix keyword | string \| string[] | '@' |
@@ -75,0 +76,0 @@ | rows | Set row count | number | 1 |

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

83040

increased by2.25%

Lines of code

1733

increased by3.96%

Number of lines in readme file

122

increased by0.83%

No dependency changes