react-nested-file-tree - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

package.json

 {
   "name": "react-nested-file-tree",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "React component for file directory",
@@ -63,2 +63,3 @@ "repository": {
     "sinon": "^1.17.6",
+    "snazzy": "^5.0.0",
     "style-loader": "^0.13.1",
@@ -69,3 +70,11 @@ "stylus": "^0.54.5",
     "webpack-dev-server": "^1.16.2"
+  },
+  "standard": {
+    "ignore": [
+      "/dist/",
+      "/lib/",
+      "karma.conf.js"
+    ],
+    "parser": "babel-eslint"
   }
 }

README.md

@@ -113,3 +113,3 @@ # react-nested-file-tree
 
-See [`example` folder](/example) for more examples, and online [demo]().
+See [`example` folder](/example) for more examples, and online [demo](https://woodpig07.github.io/react-nested-file-tree/).
 
@@ -168,3 +168,3 @@ ## API
 
-All folders are expended by default. If given `expended={false}`, then all folders would be collapsed until user click on it to expend.
+All folders are collapsed by default. If given `expended={true}`(`true` can be omitted), then all folders would be expended until user click on it to collapse.
 
@@ -180,5 +180,5 @@ #### fileClickHandler
 
-A callback function for folder name click event handler, the folder name string will be passed in:
+A callback function for folder name click event handler, the folder name string, current folder path, and folder Object will be passed in as parameters:
 ```
-function (name) {}
+function (name, currentPath, folderObj) {}
 ``` 
@@ -206,7 +206,7 @@
 ```javascript
-function CustomFolder (props) {
+function CustomFolder ({ name, currentPath, folderObj, onclick }) {
   return (
-    <a onClick={props.onclick}>
+    <a onClick={onclick}>
       <span className='icon'>other stuff</span>
-      {props.name}
+      {name}
     </a>
@@ -213,0 +213,0 @@ )

src/FileView.js

@@ -1,2 +0,2 @@
-import React, { Component } from 'react'
+import React from 'react'
 
@@ -24,4 +24,4 @@ const FileView = (props) => {
       {
-        fileTemplate && fileTemplate({ name: file.name })
-        || <a>|__{file.name}</a>
+        fileTemplate && fileTemplate({ name: file.name }) ||
+        <a>|__{file.name}</a>
       }
@@ -28,0 +28,0 @@ </li>

src/FolderView.js

@@ -5,3 +5,3 @@ import React, { Component } from 'react'
 class FolderView extends Component {
-  constructor(props) {
+  constructor (props) {
     super(props)
@@ -15,5 +15,8 @@ this.state = {
     const { open } = this.state
+    const { name, parentPath, folderObj } = this.props
+    const currentPath = parentPath + '/' + name
+
     this.setState({ open: !open }, () => {
       let fn = this.props.folderClickHandler
-      fn && fn(this.props.name)
+      fn && fn(name, currentPath, folderObj)
     })
@@ -25,2 +28,3 @@ }
       name,
+      parentPath,
       folderObj,
@@ -53,7 +57,13 @@ maxFolderLevel,
       <li key={`folder-${name}`} className={open ? `open ${cns}` : cns}>
-        { 
-          folderTemplate && folderTemplate({ name, onclick: this.toggleFolder.bind(this) })
-          || <a onClick={::this.toggleFolder}>/{name}</a>
+        {
+          folderTemplate &&
+          folderTemplate({
+            name,
+            folderObj,
+            currentPath: parentPath + '/' + name,
+            onclick: this.toggleFolder.bind(this)
+          }) ||
+          <a onClick={::this.toggleFolder}>/{name}</a>
         }
-        
+
         <ul style={styl} data-level={level}>
@@ -84,2 +94,3 @@ {
                     name={prop}
+                    parentPath={parentPath + '/' + name}
                     folderObj={folderObj[prop]}
@@ -86,0 +97,0 @@ {...passedFolderProps} />

src/index.js

 import NestedFileTreeView from './NestedFileTreeView'
 require('./default.styl')
 
-export default NestedFileTreeView
+export default NestedFileTreeView

src/NestedFileTreeView.js

@@ -9,2 +9,3 @@ import React, { PropTypes } from 'react'
     expended,
+    className,
     fileClickHandler,
@@ -29,3 +30,3 @@ folderClickHandler,
   return (
-    <ul data-level="0">
+    <ul data-level='0' className={className}>
       {
@@ -53,2 +54,3 @@ directory && directory['_contents'].map(file => {
               name={prop}
+              parentPath=''
               folderClickHandler={folderClickHandler}
@@ -68,2 +70,3 @@ folderTemplate={folderTemplate}
   expended: PropTypes.bool,
+  className: PropTypes.string,
   fileClickHandler: PropTypes.func,
@@ -70,0 +73,0 @@ folderClickHandler: PropTypes.func,

webpack.production.config.js

@@ -18,4 +18,4 @@ var path = require('path')
     new webpack.DefinePlugin({
-      "process.env": {
-        NODE_ENV: JSON.stringify("production")
+      'process.env': {
+        NODE_ENV: JSON.stringify('production')
       }
@@ -27,6 +27,6 @@ }),
     react: {
-      root: "React",
-      commonjs: "react",
-      commonjs2: "react",
-      amd: "react"
+      root: 'React',
+      commonjs: 'react',
+      commonjs2: 'react',
+      amd: 'react'
     }
@@ -33,0 +33,0 @@ },

No alert changes

Improved metrics

Total package byte prevSize

58051

increased by1.24%

Lines of code

476

increased by3.03%

Worsened metrics

Dev dependency count

34

increased by3.03%

Number of package files

16

decreased by-5.88%

No dependency changes