@rsuite/document-nav - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

lib/Nav.js

@@ -188,3 +188,4 @@ 'use strict';
           _props3$scrollBar = _props3.scrollBar,
-          scrollBar = _props3$scrollBar === undefined ? 'left' : _props3$scrollBar;
+          scrollBar = _props3$scrollBar === undefined ? 'left' : _props3$scrollBar,
+          rtl = _props3.rtl;
       var activeAnchor = this.state.activeAnchor;
@@ -199,3 +200,4 @@
           scrollBar: scrollBar,
-          key: i + 1 + ' ' + item.props.anchor
+          key: i + 1 + ' ' + item.props.anchor,
+          rtl: rtl
         });
@@ -218,3 +220,4 @@ });
           maxLevel = _props4.maxLevel,
-          fixed = _props4.fixed;
+          fixed = _props4.fixed,
+          rtl = _props4.rtl;
 
@@ -229,3 +232,3 @@ if (!children) {
         });
-        var _navItems = (0, _createNavItems2.default)(list, 0);
+        var _navItems = (0, _createNavItems2.default)(list, 0, undefined, rtl);
         this.setState({
@@ -318,3 +321,4 @@ navItems: _navItems
   showOrderNumber: true,
-  once: true
+  once: true,
+  rtl: false
 };
@@ -321,0 +325,0 @@ Component.Item = _NavItem2.default;

lib/NavItem.js

@@ -25,2 +25,4 @@ 'use strict';
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -55,3 +57,4 @@
           level = _props.level,
-          subItems = _props.subItems;
+          subItems = _props.subItems,
+          rtl = _props.rtl;
 
@@ -67,3 +70,3 @@ if (children) {
       }
-      return (0, _createNavItems2.default)(subItems, level, index);
+      return (0, _createNavItems2.default)(subItems, level, index, rtl);
     }
@@ -79,3 +82,4 @@ }, {
           index = _props2.index,
-          level = _props2.level;
+          level = _props2.level,
+          rtl = _props2.rtl;
       var _props3 = this.props,
@@ -96,5 +100,3 @@ _props3$scrollBar = _props3.scrollBar,
             className: 'nav-link ' + (active ? 'active' : '') + ' scroll-bar-' + scrollBar,
-            style: {
-              paddingLeft: (level - 1) * 20 + BASE_PADDING_LEFT + 'px'
-            }
+            style: _defineProperty({}, rtl ? 'paddingRight' : 'paddingLeft', (level - 1) * 20 + BASE_PADDING_LEFT + 'px')
           },
@@ -101,0 +103,0 @@ showOrderNumber ? index + ' ' + title : title

lib/utils/createNavItems.js

@@ -21,3 +21,3 @@ 'use strict';
 
-var createNavItems = function createNavItems(list, parentLevel, parentIndex) {
+var createNavItems = function createNavItems(list, parentLevel, parentIndex, rtl) {
   var navItems = [];
@@ -31,3 +31,4 @@
       level: parentLevel + 1,
-      index: parentIndex ? parentIndex + '.1' : '1'
+      index: parentIndex ? parentIndex + '.1' : '1',
+      rtl: true
     });
@@ -62,3 +63,4 @@ }
         index: key,
-        key: key + ' ' + _item.anchor
+        key: key + ' ' + _item.anchor,
+        rtl: true
       }));
@@ -75,3 +77,4 @@ i = nextIndex;
         index: _key,
-        key: _key + ' ' + _item.anchor
+        key: _key + ' ' + _item.anchor,
+        rtl: true
       }));
@@ -78,0 +81,0 @@ break;

package.json

 {
   "name": "@rsuite/document-nav",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Document navigation is automatically generated based on the HTML title (h1-h6) tag",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -36,3 +36,3 @@ # Document Nav
 ```less
-@import "@rsuite/document-nav/lib/less/index.less";
+@import '@rsuite/document-nav/lib/less/index.less';
 @doc-nav-active-color: #34c3ff;
@@ -119,12 +119,13 @@ ```
 
-| Name            | Type `(Default)`               | Description                                                                                                            |
-| --------------- | ------------------------------ | ---------------------------------------------------------------------------------------------------------------------- |
-| fixed           | boolean `(true)`               | 是否固定在屏幕的某一个位置？仅当为 `true` 时，`offset` 属性才会生效，为 `false` 时，导航菜单跟随文档流 |
-| offset          | object `({left: 'auto', top: 60})` | 定位，属性为 `top`, `right`, `bottom`, `left`                                                                          |
-| width           | number `(250)`                 | 导航部分的宽。当 `fixed` 为 `true` 时，默认为 `250`， 为 `false` 时默认为 `100%`                                       |
-| scrollBar       | string `('right')`             | 导航栏边上的滚动条位置，`left` 或 `right`                                                                              |
-| minLevel        | number `(2)`                   | 最小导航级别，默认为 `2` 即 `h2`                                                                                       |
-| maxLevel        | number `(4)`                   | 最大导航级别，默认为 `4` 即 `h4`                                                                                       |
-| showOrderNumber | boolean `(true)`               | 是否显示标题前的序号                                                                                                   |
-| once            | boolean `(true)`               | 只解析一次文档？设为`true`则只会解析一次，文档发生变化时不会重新解析，性能较好。                                       |
+| Name            | Type `(Default)`                   | Description                                                                                            |
+| --------------- | ---------------------------------- | ------------------------------------------------------------------------------------------------------ |
+| fixed           | boolean `(true)`                   | 是否固定在屏幕的某一个位置？仅当为 `true` 时，`offset` 属性才会生效，为 `false` 时，导航菜单跟随文档流 |
+| offset          | object `({left: 'auto', top: 60})` | 定位，属性为 `top`, `right`, `bottom`, `left`                                                          |
+| width           | number `(250)`                     | 导航部分的宽。当 `fixed` 为 `true` 时，默认为 `250`， 为 `false` 时默认为 `100%`                       |
+| scrollBar       | string `('right')`                 | 导航栏边上的滚动条位置，`left` 或 `right`                                                              |
+| minLevel        | number `(2)`                       | 最小导航级别，默认为 `2` 即 `h2`                                                                       |
+| maxLevel        | number `(4)`                       | 最大导航级别，默认为 `4` 即 `h4`                                                                       |
+| showOrderNumber | boolean `(true)`                   | 是否显示标题前的序号                                                                                   |
+| once            | boolean `(true)`                   | 只解析一次文档？设为`true`则只会解析一次，文档发生变化时不会重新解析，性能较好。                       |
+| rtl             | boolean `(false)`                  | 文档从右侧开始阅读                                                                                     |
 
@@ -131,0 +132,0 @@ ### `<Nav.Item>`

src/Nav.js

@@ -28,3 +28,4 @@ // @flow
   activeAnchor: string,
-  showOrderNumber: boolean
+  showOrderNumber: boolean,
+  rtl:boolean
 };
@@ -56,3 +57,4 @@
     showOrderNumber: true,
-    once: true
+    once: true,
+    rtl: false
   };
@@ -165,3 +167,3 @@
     let anchors = [];
-    const { children, scrollBar = 'left' } = this.props;
+    const { children, scrollBar = 'left', rtl } = this.props;
     const { activeAnchor } = this.state;
@@ -175,3 +177,4 @@ const navItems = React.Children.map(children, (item, i) => {
         scrollBar,
-        key: `${i + 1} ${item.props.anchor}`
+        key: `${i + 1} ${item.props.anchor}`,
+        rtl
       });
@@ -189,3 +192,3 @@ });
     const anchors: Array<string> = [];
-    const { children, minLevel, maxLevel, fixed } = this.props;
+    const { children, minLevel, maxLevel, fixed, rtl } = this.props;
     if (!children) {
@@ -197,3 +200,3 @@ this.traverseTitle(content, titleList, anchors);
       const list = titleList.filter(item => item.level >= minLevel && item.level <= maxLevel);
-      const navItems = createNavItems(list, 0);
+      const navItems = createNavItems(list, 0, undefined, rtl);
       this.setState({
@@ -200,0 +203,0 @@ navItems

src/NavItem.js

@@ -36,3 +36,3 @@ // @flow
   renderSubNavItems() {
-    const { children, index, level, subItems } = this.props;
+    const { children, index, level, subItems, rtl } = this.props;
     if (children) {
@@ -47,6 +47,6 @@ return React.Children.map(children, (item, i) =>
     }
-    return createNavItems(subItems, level, index);
+    return createNavItems(subItems, level, index, rtl);
   }
   render() {
-    const { title, anchor, subItems, children, index, level } = this.props;
+    const { title, anchor, subItems, children, index, level, rtl } = this.props;
     const { scrollBar = 'right', activeAnchor, showOrderNumber } = this.props;
@@ -60,3 +60,3 @@ const active = anchor === activeAnchor;
           style={{
-            paddingLeft: `${(level - 1) * 20 + BASE_PADDING_LEFT}px`
+            [rtl ? 'paddingRight' : 'paddingLeft']: `${(level - 1) * 20 + BASE_PADDING_LEFT}px`
           }}
@@ -75,3 +75,5 @@ >
 export default props => (
-  <NavItemContext.Consumer>{context => <NavItem {...props} {...context} />}</NavItemContext.Consumer>
+  <NavItemContext.Consumer>
+    {context => <NavItem {...props} {...context} />}
+  </NavItemContext.Consumer>
 );

src/utils/createNavItems.js

@@ -14,3 +14,3 @@ // @flow
 
-const createNavItems = (list: List, parentLevel: number, parentIndex?: string | number) => {
+const createNavItems = (list: List, parentLevel: number, parentIndex?: string | number, rtl) => {
   const navItems = [];
@@ -26,2 +26,3 @@
         index={parentIndex ? `${parentIndex}.1` : '1'}
+        rtl
       />
@@ -59,2 +60,3 @@ );
           key={`${key} ${item.anchor}`}
+          rtl
         />
@@ -74,2 +76,3 @@ );
           key={`${key} ${item.anchor}`}
+          rtl
         />
@@ -76,0 +79,0 @@ );

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

52855

increased by1.31%

Lines of code

1159

increased by1.4%

Number of lines in readme file

141

increased by0.71%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes