uxcore-collapse - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

HISTORY.md

@@ -5,2 +5,5 @@ # History
 
+## 1.1.0
+`UPGRADE` remove rc-collapse dep
+
 ## 1.0.1
@@ -7,0 +10,0 @@ `UPGRADE` upgrade to rc-collapse@1.4.3

package.json

 {
   "name": "uxcore-collapse",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "uxcore-collapse component for uxcore.",
@@ -38,4 +38,3 @@ "repository": "https://github.com/uxcore/uxcore-collapse.git",
     "classnames": "^2.1.2",
-    "object-assign": "^2.0.0",
-    "rc-collapse": "^1.4.0"
+    "object-assign": "^4.0.0"
   },
@@ -42,0 +41,0 @@ "contributors": [],

src/Collapse.js

@@ -1,31 +0,127 @@
-/**
- * Collapse Component for uxcore
- * @author vicent.bian
- *
- * Copyright 2014-2015, Uxcore Team, Alinw.
- * All rights reserved.
- */
-import React from 'react';
-import RcCollapse from 'rc-collapse';
-const prefixCls = 'kuma-collapse';
+import React, { PropTypes, createClass, Children } from 'react';
+import CollapsePanel from './Panel';
 
-class Collapse extends React.Component {
+const Collapse = createClass({
+  statics: {
+    Panel: CollapsePanel,
+  },
 
-    constructor(props) {
-        super(props);
+  propTypes: {
+    prefixCls: PropTypes.string,
+    activeKey: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.arrayOf(PropTypes.string),
+    ]),
+    defaultActiveKey: PropTypes.oneOfType([
+      PropTypes.string,
+      PropTypes.arrayOf(PropTypes.string),
+    ]),
+    onChange: PropTypes.func,
+    accordion: PropTypes.bool,
+  },
+
+  getDefaultProps() {
+    return {
+      prefixCls: 'kuma-collapse',
+      onChange: () => {
+      },
+      accordion: false,
+    };
+  },
+
+  getInitialState() {
+    const { activeKey, accordion } = this.props;
+    let { defaultActiveKey } = this.props;
+    // If is not accordion mode, then, defaultActiveKey should be an array
+    if (!accordion) {
+      defaultActiveKey = defaultActiveKey || [];
     }
 
-    render() {
-        return <RcCollapse {...this.props} />;
+    return {
+      activeKey: activeKey || defaultActiveKey,
+    };
+  },
+
+  componentWillReceiveProps(nextProps) {
+    if ('activeKey' in nextProps) {
+      this.setState({
+        activeKey: nextProps.activeKey,
+      });
     }
-}
+  },
 
-Collapse.defaultProps = {
-    prefixCls: prefixCls
-};
+  handleClickItem(key) {
+    return () => {
+      const activeKey = this._getActivityKey();
+      if (this.props.accordion) {
+        this.setState({
+          activeKey: key === activeKey ? null : key,
+        });
+      } else {
+        const index = activeKey.indexOf(key);
+        const isActive = index > -1;
+        if (isActive) {
+          // remove active state
+          activeKey.splice(index, 1);
+        } else {
+          activeKey.push(key);
+        }
 
-Collapse.Panel = RcCollapse.Panel;
+        this.setState({activeKey: activeKey});
+      }
+      this.props.onChange(key);
+    };
+  },
 
-Collapse.displayName = "Collapse";
+  _getActivityKey() {
+    let activeKey = this.state.activeKey;
+    const { accordion } = this.props;
+    if (accordion && Array.isArray(activeKey)) {
+      activeKey = activeKey[0];
+    }
 
-export default Collapse;
+    if (!accordion && !Array.isArray(activeKey)) {
+      activeKey = activeKey ? [activeKey] : [];
+    }
+    return activeKey;
+  },
+
+  getItems() {
+    const activeKey = this._getActivityKey();
+    const { prefixCls, accordion } = this.props;
+
+    return Children.map(this.props.children, (child, index) => {
+      // If there is no key provide, use the panel order as default key
+      const key = child.key || index;
+      const header = child.props.header;
+      let isActive = false;
+      if (accordion) {
+        isActive = activeKey === key;
+      } else {
+        isActive = activeKey.indexOf(key) > -1;
+      }
+
+      const props = {
+        key,
+        header,
+        isActive,
+        prefixCls,
+        children: child.props.children,
+        onItemClick: this.handleClickItem(key).bind(this),
+      };
+
+      return <CollapsePanel {...props} />;
+    });
+  },
+
+  render() {
+    const prefixCls = this.props.prefixCls;
+    return (
+      <div className={prefixCls}>
+        {this.getItems()}
+      </div>
+    );
+  },
+});
+
+export default Collapse;

No alert changes

Improved metrics

Total package byte prevSize

21832

increased by20.99%

Dependency count

2

decreased by-33.33%

Number of package files

19

increased by5.56%

Lines of code

428

increased by46.08%

Dependency changes

• - Removedrc-collapse@^1.4.0

• - Removedadd-dom-event-listener@1.1.0(transitive)

• - Removedbabel-runtime@6.26.0(transitive)

• - Removedcomponent-classes@1.2.6(transitive)

• - Removedcomponent-indexof@0.0.3(transitive)

• - Removedcore-js@2.6.12(transitive)

• - Removedcss-animation@1.6.1(transitive)

• - Removedjs-tokens@4.0.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedobject-assign@2.1.1(transitive)

• - Removedperformance-now@2.1.0(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedraf@3.4.1(transitive)

• - Removedrc-animate@2.11.1(transitive)

• - Removedrc-collapse@1.11.8(transitive)

• - Removedrc-util@4.21.1(transitive)

• - Removedreact-is@16.13.1(transitive)

• - Removedreact-lifecycles-compat@3.0.4(transitive)

• - Removedregenerator-runtime@0.11.1(transitive)

• - Removedshallowequal@1.1.0(transitive)

• Updatedobject-assign@^4.0.0