New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
react-simple-collapsible-element
Advanced tools
react-simple-collapsible-element - npm Package Compare versions
Comparing version 2.0.7 to 2.0.8
@@ -1,43 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| var _react = require('react'); | ||
| var _react2 = _interopRequireDefault(_react); | ||
| var _propTypes = require('prop-types'); | ||
| var _propTypes2 = _interopRequireDefault(_propTypes); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| var CollapseContainer = function CollapseContainer(_ref) { | ||
| var children = _ref.children, | ||
| currentActiveIndex = _ref.currentActiveIndex, | ||
| _onCollapse = _ref.onCollapse; | ||
| return _react2.default.Children.toArray(children).map(function (child, index) { | ||
| return _react2.default.cloneElement(child, { | ||
| currentActiveIndex: currentActiveIndex, | ||
| onCollapse: function onCollapse(index) { | ||
| return _onCollapse(index); | ||
| } | ||
| }); | ||
| }); | ||
| }; | ||
| CollapseContainer.propTypes = { | ||
| children: _propTypes2.default.oneOfType([_propTypes2.default.element, _propTypes2.default.array]).isRequired, | ||
| currentActiveIndex: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.array]), | ||
| onCollapse: _propTypes2.default.func | ||
| }; | ||
| CollapseContainer.defaultProps = { | ||
| currentActiveIndex: undefined, | ||
| onCollapse: function onCollapse() {} | ||
| }; | ||
| exports.default = CollapseContainer; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _react=require('react'),_react2=_interopRequireDefault(_react),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var CollapseContainer=function(a){var b=a.children,c=a.currentActiveIndex,d=a.onCollapse;return _react2.default.Children.toArray(b).map(function(a){return _react2.default.cloneElement(a,{currentActiveIndex:c,onCollapse:function b(a){return d(a)}})})};CollapseContainer.propTypes={children:_propTypes2.default.oneOfType([_propTypes2.default.element,_propTypes2.default.array]).isRequired,currentActiveIndex:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number,_propTypes2.default.array]),onCollapse:_propTypes2.default.func},CollapseContainer.defaultProps={currentActiveIndex:void 0,onCollapse:function a(){}},exports.default=CollapseContainer; |
@@ -1,125 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| var _react = require('react'); | ||
| var _react2 = _interopRequireDefault(_react); | ||
| var _propTypes = require('prop-types'); | ||
| var _propTypes2 = _interopRequireDefault(_propTypes); | ||
| var _Content = require('./Content'); | ||
| var _Content2 = _interopRequireDefault(_Content); | ||
| var _Title = require('./Title'); | ||
| var _Title2 = _interopRequireDefault(_Title); | ||
| var _util = require('./util'); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function renderNestedElements(items, index, currentActiveIndex, onCollapse) { | ||
| var keepOpen = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false; | ||
| var customTransition = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : ''; | ||
| if (!Array.isArray(items)) { | ||
| throw new Error('nested elements must be an array'); | ||
| } | ||
| return items.map(function (item, nestedindex) { | ||
| var titleStyle = item.titleStyle || {}; | ||
| var contentStyle = item.contentStyle || {}; | ||
| if (Array.isArray(item.content)) { | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| { key: nestedindex }, | ||
| _react2.default.createElement(_Title2.default, { | ||
| onCollapse: onCollapse, | ||
| titleStyle: titleStyle, | ||
| index: index + '-' + nestedindex, | ||
| text: item.title, | ||
| active: (0, _util.checkIfActive)(currentActiveIndex, index, keepOpen), | ||
| activeTitleStyle: item.activeTitleStyle, | ||
| customTransition: customTransition, | ||
| isNested: true | ||
| }), | ||
| renderNestedElements(item.content, index + '-' + nestedindex, currentActiveIndex, onCollapse, keepOpen, customTransition) | ||
| ); | ||
| } | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| { key: nestedindex }, | ||
| _react2.default.createElement(_Title2.default, { | ||
| titleStyle: titleStyle, | ||
| onCollapse: onCollapse, | ||
| index: index + '-' + nestedindex, | ||
| text: item.title, | ||
| active: (0, _util.checkIfActive)(currentActiveIndex, index, keepOpen), | ||
| activeTitleStyle: item.activeTitleStyle, | ||
| customTransition: customTransition, | ||
| isNested: true | ||
| }), | ||
| _react2.default.createElement(_Content2.default, { | ||
| contentStyle: contentStyle, | ||
| index: index + '-' + nestedindex, | ||
| active: (0, _util.checkIfActive)(currentActiveIndex, index + '-' + nestedindex, keepOpen), | ||
| text: item.content, | ||
| activeContentStyle: item.activeContentStyle, | ||
| customTransition: customTransition | ||
| }) | ||
| ); | ||
| }); | ||
| } | ||
| var CollapsePane = function CollapsePane(_ref) { | ||
| var index = _ref.index, | ||
| items = _ref.items, | ||
| currentActiveIndex = _ref.currentActiveIndex, | ||
| onCollapse = _ref.onCollapse, | ||
| keepOpen = _ref.keepOpen, | ||
| customTransition = _ref.customTransition; | ||
| var titleStyle = items.titleStyle || {}; | ||
| var contentStyle = items.contentStyle || {}; | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| null, | ||
| _react2.default.createElement(_Title2.default, { | ||
| titleStyle: titleStyle, | ||
| index: index, | ||
| onCollapse: onCollapse, | ||
| text: items.title, | ||
| customTransition: customTransition | ||
| }), | ||
| !Array.isArray(items.content) ? _react2.default.createElement(_Content2.default, { | ||
| active: (0, _util.checkIfActive)(currentActiveIndex, index, keepOpen), | ||
| text: items.content, | ||
| contentStyle: contentStyle, | ||
| activeContentStyle: items.activeContentStyle, | ||
| customTransition: customTransition | ||
| }) : renderNestedElements(items.content, index, currentActiveIndex, onCollapse, keepOpen, customTransition) | ||
| ); | ||
| }; | ||
| CollapsePane.propTypes = { | ||
| index: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]).isRequired, | ||
| items: _propTypes2.default.object.isRequired, | ||
| currentActiveIndex: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.array]), | ||
| keepOpen: _propTypes2.default.bool, | ||
| customTransition: _propTypes2.default.string, | ||
| onCollapse: _propTypes2.default.func | ||
| }; | ||
| CollapsePane.defaultProps = { | ||
| currentActiveIndex: undefined, | ||
| keepOpen: false, | ||
| customTransition: '', | ||
| onCollapse: function onCollapse() {} | ||
| }; | ||
| exports.default = CollapsePane; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _react=require('react'),_react2=_interopRequireDefault(_react),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes),_Content=require('./Content'),_Content2=_interopRequireDefault(_Content),_Title=require('./Title'),_Title2=_interopRequireDefault(_Title),_util=require('./util');function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function renderNestedElements(a,b,c,d){var e=!!(4<arguments.length&&arguments[4]!==void 0)&&arguments[4],f=5<arguments.length&&arguments[5]!==void 0?arguments[5]:'';if(!Array.isArray(a))throw new Error('nested elements must be an array');return a.map(function(a,g){var h=a.titleStyle||{},i=a.contentStyle||{};return Array.isArray(a.content)?_react2.default.createElement('div',{key:g},_react2.default.createElement(_Title2.default,{onCollapse:d,titleStyle:h,index:b+'-'+g,text:a.title,active:(0,_util.checkIfActive)(c,b,e),activeTitleStyle:a.activeTitleStyle,customTransition:f,isNested:!0}),renderNestedElements(a.content,b+'-'+g,c,d,e,f)):_react2.default.createElement('div',{key:g},_react2.default.createElement(_Title2.default,{titleStyle:h,onCollapse:d,index:b+'-'+g,text:a.title,active:(0,_util.checkIfActive)(c,b,e),activeTitleStyle:a.activeTitleStyle,customTransition:f,isNested:!0}),_react2.default.createElement(_Content2.default,{contentStyle:i,index:b+'-'+g,active:(0,_util.checkIfActive)(c,b+'-'+g,e),text:a.content,activeContentStyle:a.activeContentStyle,customTransition:f}))})}var CollapsePane=function(a){var b=a.index,c=a.items,d=a.currentActiveIndex,e=a.onCollapse,f=a.keepOpen,g=a.customTransition,h=c.titleStyle||{},i=c.contentStyle||{};return _react2.default.createElement('div',null,_react2.default.createElement(_Title2.default,{titleStyle:h,index:b,onCollapse:e,text:c.title,customTransition:g}),Array.isArray(c.content)?renderNestedElements(c.content,b,d,e,f,g):_react2.default.createElement(_Content2.default,{active:(0,_util.checkIfActive)(d,b,f),text:c.content,contentStyle:i,activeContentStyle:c.activeContentStyle,customTransition:g}))};CollapsePane.propTypes={index:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number]).isRequired,items:_propTypes2.default.shape({title:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.element]),content:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.element,_propTypes2.default.array])}).isRequired,currentActiveIndex:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number,_propTypes2.default.array]),keepOpen:_propTypes2.default.bool,customTransition:_propTypes2.default.string,onCollapse:_propTypes2.default.func},CollapsePane.defaultProps={currentActiveIndex:void 0,keepOpen:!1,customTransition:'',onCollapse:function a(){}},exports.default=CollapsePane; |
@@ -1,140 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| var _react = require('react'); | ||
| var _react2 = _interopRequireDefault(_react); | ||
| var _propTypes = require('prop-types'); | ||
| var _propTypes2 = _interopRequireDefault(_propTypes); | ||
| var _CollapseContainer = require('./CollapseContainer'); | ||
| var _CollapseContainer2 = _interopRequireDefault(_CollapseContainer); | ||
| var _CollapsePane = require('./CollapsePane'); | ||
| var _CollapsePane2 = _interopRequireDefault(_CollapsePane); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } | ||
| var Collapsible = function (_Component) { | ||
| _inherits(Collapsible, _Component); | ||
| function Collapsible(_ref) { | ||
| var keepOpen = _ref.keepOpen; | ||
| _classCallCheck(this, Collapsible); | ||
| var _this = _possibleConstructorReturn(this, (Collapsible.__proto__ || Object.getPrototypeOf(Collapsible)).call(this)); | ||
| _this.state = { currentActiveIndex: keepOpen ? [] : '' }; | ||
| _this.onCollapse = _this.onCollapse.bind(_this); | ||
| return _this; | ||
| } | ||
| _createClass(Collapsible, [{ | ||
| key: 'keepOpenCollapse', | ||
| value: function keepOpenCollapse(index) { | ||
| var currentActiveIndex = this.state.currentActiveIndex; | ||
| if (currentActiveIndex.indexOf(index.toString()) < 0) { | ||
| this.setState({ | ||
| currentActiveIndex: [index.toString()].concat(_toConsumableArray(currentActiveIndex)) | ||
| }); | ||
| } else { | ||
| this.setState({ | ||
| currentActiveIndex: currentActiveIndex.filter(function (activeIndex) { | ||
| return activeIndex.indexOf(index.toString()) < 0; | ||
| }) | ||
| }); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'defaultCollapse', | ||
| value: function defaultCollapse(index) { | ||
| var currentActiveIndex = this.state.currentActiveIndex; | ||
| if (currentActiveIndex.toString() === index.toString() && index.length > 1) { | ||
| this.setState({ | ||
| currentActiveIndex: index.slice(0, index.length - 2) | ||
| }); | ||
| } else if (currentActiveIndex.toString() !== index.toString()) { | ||
| this.setState({ currentActiveIndex: index }); | ||
| } else { | ||
| this.setState({ currentActiveIndex: '' }); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'onCollapse', | ||
| value: function onCollapse(index) { | ||
| var keepOpen = this.props.keepOpen; | ||
| if (keepOpen) { | ||
| this.keepOpenCollapse(index); | ||
| } else { | ||
| this.defaultCollapse(index); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'render', | ||
| value: function render() { | ||
| var _this2 = this; | ||
| var _props = this.props, | ||
| data = _props.data, | ||
| keepOpen = _props.keepOpen, | ||
| customTransition = _props.customTransition; | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| null, | ||
| _react2.default.createElement( | ||
| _CollapseContainer2.default, | ||
| { | ||
| currentActiveIndex: this.state.currentActiveIndex, | ||
| onCollapse: function onCollapse(index) { | ||
| return _this2.onCollapse(index); | ||
| } | ||
| }, | ||
| data.map(function (item, index) { | ||
| return _react2.default.createElement(_CollapsePane2.default, { | ||
| key: index, | ||
| items: item, | ||
| index: index, | ||
| keepOpen: keepOpen, | ||
| customTransition: customTransition | ||
| }); | ||
| }) | ||
| ) | ||
| ); | ||
| } | ||
| }]); | ||
| return Collapsible; | ||
| }(_react.Component); | ||
| Collapsible.propTypes = { | ||
| data: _propTypes2.default.array.isRequired, | ||
| keepOpen: _propTypes2.default.bool, | ||
| customTransition: _propTypes2.default.string | ||
| }; | ||
| Collapsible.defaultProps = { | ||
| keepOpen: false, | ||
| customTransition: undefined | ||
| }; | ||
| exports.default = Collapsible; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _createClass=function(){function a(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,'value'in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),_react=require('react'),_react2=_interopRequireDefault(_react),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes),_CollapseContainer=require('./CollapseContainer'),_CollapseContainer2=_interopRequireDefault(_CollapseContainer),_CollapsePane=require('./CollapsePane'),_CollapsePane2=_interopRequireDefault(_CollapsePane);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _toConsumableArray(a){if(Array.isArray(a)){for(var b=0,c=Array(a.length);b<a.length;b++)c[b]=a[b];return c}return Array.from(a)}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError('Cannot call a class as a function')}function _possibleConstructorReturn(a,b){if(!a)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return b&&('object'==typeof b||'function'==typeof b)?b:a}function _inherits(a,b){if('function'!=typeof b&&null!==b)throw new TypeError('Super expression must either be null or a function, not '+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}var Collapsible=function(a){function b(a){var c=a.keepOpen;_classCallCheck(this,b);var d=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return d.state={currentActiveIndex:c?[]:''},d.onCollapse=d.onCollapse.bind(d),d}return _inherits(b,a),_createClass(b,[{key:'onCollapse',value:function c(a){var b=this.props.keepOpen;b?this.keepOpenCollapse(a):this.defaultCollapse(a)}},{key:'keepOpenCollapse',value:function c(a){var b=this.state.currentActiveIndex;0>b.indexOf(a.toString())?this.setState({currentActiveIndex:[a.toString()].concat(_toConsumableArray(b))}):this.setState({currentActiveIndex:b.filter(function(b){return 0>b.indexOf(a.toString())})})}},{key:'defaultCollapse',value:function c(a){var b=this.state.currentActiveIndex;b.toString()===a.toString()&&1<a.length?this.setState({currentActiveIndex:a.slice(0,a.length-2)}):b.toString()===a.toString()?this.setState({currentActiveIndex:''}):this.setState({currentActiveIndex:a})}},{key:'render',value:function f(){var a=this,b=this.props,c=b.data,d=b.keepOpen,e=b.customTransition;return _react2.default.createElement('div',null,_react2.default.createElement(_CollapseContainer2.default,{currentActiveIndex:this.state.currentActiveIndex,onCollapse:function c(b){return a.onCollapse(b)}},c.map(function(a,b){return _react2.default.createElement(_CollapsePane2.default,{key:'collapse-pane-'+b,items:a,index:b,keepOpen:d,customTransition:e})})))}}]),b}(_react.Component);Collapsible.propTypes={data:_propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,keepOpen:_propTypes2.default.bool,customTransition:_propTypes2.default.string},Collapsible.defaultProps={keepOpen:!1,customTransition:void 0},exports.default=Collapsible; |
@@ -1,98 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| var _react = require('react'); | ||
| var _react2 = _interopRequireDefault(_react); | ||
| var _propTypes = require('prop-types'); | ||
| var _propTypes2 = _interopRequireDefault(_propTypes); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } | ||
| var Content = function (_React$PureComponent) { | ||
| _inherits(Content, _React$PureComponent); | ||
| function Content() { | ||
| _classCallCheck(this, Content); | ||
| var _this = _possibleConstructorReturn(this, (Content.__proto__ || Object.getPrototypeOf(Content)).call(this)); | ||
| _this.contentRef = _react2.default.createRef(); | ||
| _this.state = { height: 0 }; | ||
| return _this; | ||
| } | ||
| _createClass(Content, [{ | ||
| key: 'componentDidMount', | ||
| value: function componentDidMount() { | ||
| this.setState({ height: this.contentRef.current.scrollHeight }); | ||
| } | ||
| }, { | ||
| key: 'componentDidUpdate', | ||
| value: function componentDidUpdate() { | ||
| var height = this.state.height; | ||
| if (this.contentRef.current.scrollHeight !== height) { | ||
| this.setState({ height: this.contentRef.current.scrollHeight }); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'render', | ||
| value: function render() { | ||
| var _props = this.props, | ||
| text = _props.text, | ||
| active = _props.active, | ||
| contentStyle = _props.contentStyle, | ||
| activeContentStyle = _props.activeContentStyle, | ||
| customTransition = _props.customTransition; | ||
| var classNames = typeof contentStyle === 'string' ? contentStyle : ''; | ||
| var style = classNames ? {} : contentStyle; | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| { | ||
| style: _extends({ | ||
| height: active ? this.state.height : 0, | ||
| transition: customTransition || 'height .3s ease-out', | ||
| overflow: 'hidden' | ||
| }, style), | ||
| ref: this.contentRef, | ||
| className: active && activeContentStyle ? classNames + ' ' + activeContentStyle : classNames | ||
| }, | ||
| text | ||
| ); | ||
| } | ||
| }]); | ||
| return Content; | ||
| }(_react2.default.PureComponent); | ||
| Content.propTypes = { | ||
| text: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.element]).isRequired, | ||
| active: _propTypes2.default.bool, | ||
| contentStyle: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.object]), | ||
| activeContentStyle: _propTypes2.default.string, | ||
| customTransition: _propTypes2.default.string | ||
| }; | ||
| Content.defaultProps = { | ||
| active: false, | ||
| contentStyle: undefined, | ||
| activeContentStyle: undefined, | ||
| customTransition: '' | ||
| }; | ||
| exports.default = Content; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _extends=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_createClass=function(){function a(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,'value'in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),_react=require('react'),_react2=_interopRequireDefault(_react),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError('Cannot call a class as a function')}function _possibleConstructorReturn(a,b){if(!a)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return b&&('object'==typeof b||'function'==typeof b)?b:a}function _inherits(a,b){if('function'!=typeof b&&null!==b)throw new TypeError('Super expression must either be null or a function, not '+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}/* eslint-disable react/no-did-mount-set-state *//* eslint-disable react/no-did-update-set-state */var Content=function(a){function b(){_classCallCheck(this,b);var a=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return a.contentRef=_react2.default.createRef(),a.state={height:0},a}return _inherits(b,a),_createClass(b,[{key:'componentDidMount',value:function a(){this.setState({height:this.contentRef.current.scrollHeight})}},{key:'componentDidUpdate',value:function b(){var a=this.state.height;this.contentRef.current.scrollHeight!==a&&this.setState({height:this.contentRef.current.scrollHeight})}},{key:'render',value:function i(){var a=this.props,b=a.text,c=a.active,d=a.contentStyle,e=a.activeContentStyle,f=a.customTransition,g='string'==typeof d?d:'',h=g?{}:d;return _react2.default.createElement('div',{style:_extends({height:c?this.state.height:0,transition:f||'height .3s ease-out',overflow:'hidden'},h),ref:this.contentRef,className:c&&e?g+' '+e:g},b)}}]),b}(_react2.default.PureComponent);Content.propTypes={text:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number,_propTypes2.default.element]).isRequired,active:_propTypes2.default.bool,contentStyle:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.object]),activeContentStyle:_propTypes2.default.string,customTransition:_propTypes2.default.string},Content.defaultProps={active:!1,contentStyle:void 0,activeContentStyle:void 0,customTransition:''},exports.default=Content; |
@@ -1,112 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| var _react = require('react'); | ||
| var _react2 = _interopRequireDefault(_react); | ||
| var _propTypes = require('prop-types'); | ||
| var _propTypes2 = _interopRequireDefault(_propTypes); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } | ||
| var Title = function (_React$PureComponent) { | ||
| _inherits(Title, _React$PureComponent); | ||
| function Title() { | ||
| _classCallCheck(this, Title); | ||
| var _this = _possibleConstructorReturn(this, (Title.__proto__ || Object.getPrototypeOf(Title)).call(this)); | ||
| _this.titleRef = _react2.default.createRef(); | ||
| _this.state = { height: 0 }; | ||
| return _this; | ||
| } | ||
| _createClass(Title, [{ | ||
| key: 'componentDidMount', | ||
| value: function componentDidMount() { | ||
| this.setState({ height: this.titleRef.current.scrollHeight }); | ||
| } | ||
| }, { | ||
| key: 'componentDidUpdate', | ||
| value: function componentDidUpdate() { | ||
| var height = this.state.height; | ||
| if (this.titleRef.current.scrollHeight !== height) { | ||
| this.setState({ height: this.titleRef.current.scrollHeight }); | ||
| } | ||
| } | ||
| }, { | ||
| key: 'render', | ||
| value: function render() { | ||
| var _props = this.props, | ||
| index = _props.index, | ||
| text = _props.text, | ||
| onCollapse = _props.onCollapse, | ||
| isNested = _props.isNested, | ||
| active = _props.active, | ||
| titleStyle = _props.titleStyle, | ||
| activeTitleStyle = _props.activeTitleStyle, | ||
| customTransition = _props.customTransition; | ||
| var classNames = typeof titleStyle === 'string' ? titleStyle : ''; | ||
| var style = classNames ? {} : titleStyle; | ||
| return _react2.default.createElement( | ||
| 'div', | ||
| { | ||
| role: 'presentation', | ||
| onKeyPress: function onKeyPress() { | ||
| return onCollapse(index); | ||
| }, | ||
| onClick: function onClick() { | ||
| return onCollapse(index); | ||
| }, | ||
| style: _extends({ | ||
| height: isNested && !active ? 0 : this.state.height, | ||
| transition: customTransition || 'height .3s ease-out', | ||
| overflow: 'hidden' | ||
| }, style), | ||
| ref: this.titleRef, | ||
| className: !(isNested && !active) && activeTitleStyle ? classNames + ' ' + activeTitleStyle : classNames | ||
| }, | ||
| text | ||
| ); | ||
| } | ||
| }]); | ||
| return Title; | ||
| }(_react2.default.PureComponent); | ||
| Title.propTypes = { | ||
| text: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number, _propTypes2.default.element]).isRequired, | ||
| onCollapse: _propTypes2.default.func.isRequired, | ||
| isNested: _propTypes2.default.bool, | ||
| index: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]).isRequired, | ||
| active: _propTypes2.default.bool, | ||
| titleStyle: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.object]), | ||
| activeTitleStyle: _propTypes2.default.string, | ||
| customTransition: _propTypes2.default.string | ||
| }; | ||
| Title.defaultProps = { | ||
| active: false, | ||
| isNested: false, | ||
| titleStyle: undefined, | ||
| activeTitleStyle: undefined, | ||
| customTransition: '' | ||
| }; | ||
| exports.default = Title; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});var _extends=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_createClass=function(){function a(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,'value'in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}return function(b,c,d){return c&&a(b.prototype,c),d&&a(b,d),b}}(),_react=require('react'),_react2=_interopRequireDefault(_react),_propTypes=require('prop-types'),_propTypes2=_interopRequireDefault(_propTypes);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError('Cannot call a class as a function')}function _possibleConstructorReturn(a,b){if(!a)throw new ReferenceError('this hasn\'t been initialised - super() hasn\'t been called');return b&&('object'==typeof b||'function'==typeof b)?b:a}function _inherits(a,b){if('function'!=typeof b&&null!==b)throw new TypeError('Super expression must either be null or a function, not '+typeof b);a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,enumerable:!1,writable:!0,configurable:!0}}),b&&(Object.setPrototypeOf?Object.setPrototypeOf(a,b):a.__proto__=b)}/* eslint-disable react/no-did-mount-set-state *//* eslint-disable react/no-did-update-set-state */var Title=function(a){function b(){_classCallCheck(this,b);var a=_possibleConstructorReturn(this,(b.__proto__||Object.getPrototypeOf(b)).call(this));return a.titleRef=_react2.default.createRef(),a.state={height:0},a}return _inherits(b,a),_createClass(b,[{key:'componentDidMount',value:function a(){this.setState({height:this.titleRef.current.scrollHeight})}},{key:'componentDidUpdate',value:function b(){var a=this.state.height;this.titleRef.current.scrollHeight!==a&&this.setState({height:this.titleRef.current.scrollHeight})}},{key:'render',value:function l(){var a=this.props,b=a.index,c=a.text,d=a.onCollapse,e=a.isNested,f=a.active,g=a.titleStyle,h=a.activeTitleStyle,i=a.customTransition,j='string'==typeof g?g:'',k=j?{}:g;return _react2.default.createElement('div',{role:'presentation',onKeyPress:function a(){return d(b)},onClick:function a(){return d(b)},style:_extends({height:e&&!f?0:this.state.height,transition:i||'height .3s ease-out',overflow:'hidden'},k),ref:this.titleRef,className:(!e||f)&&h?j+' '+h:j},c)}}]),b}(_react2.default.PureComponent);Title.propTypes={text:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number,_propTypes2.default.element]).isRequired,onCollapse:_propTypes2.default.func.isRequired,isNested:_propTypes2.default.bool,index:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.number]).isRequired,active:_propTypes2.default.bool,titleStyle:_propTypes2.default.oneOfType([_propTypes2.default.string,_propTypes2.default.object]),activeTitleStyle:_propTypes2.default.string,customTransition:_propTypes2.default.string},Title.defaultProps={active:!1,isNested:!1,titleStyle:void 0,activeTitleStyle:void 0,customTransition:''},exports.default=Title; |
@@ -1,43 +0,1 @@ | ||
| 'use strict'; | ||
| Object.defineProperty(exports, "__esModule", { | ||
| value: true | ||
| }); | ||
| function getLevel(index) { | ||
| return index.split('-').length; | ||
| } | ||
| function checkKeepOpen(activeIndex, selectedIndex) { | ||
| if (activeIndex.indexOf(selectedIndex) > -1) { | ||
| return true; | ||
| } | ||
| return false; | ||
| } | ||
| function checkDefault(currentActiveIndex, selectedIndex) { | ||
| var selectedLevel = getLevel(selectedIndex); | ||
| if (currentActiveIndex === selectedIndex) { | ||
| return true; | ||
| } else if (selectedLevel === 1 && currentActiveIndex.slice(0, 1) === selectedIndex) { | ||
| return true; | ||
| } else if (selectedLevel !== 1 && currentActiveIndex.slice(0, selectedLevel + 1) === selectedIndex) { | ||
| return true; | ||
| } else { | ||
| return false; | ||
| } | ||
| } | ||
| function checkIfActive(activeIndex, index) { | ||
| var keepOpen = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; | ||
| var currentActiveIndex = activeIndex.toString(); | ||
| var selectedIndex = index.toString(); | ||
| if (keepOpen) { | ||
| return checkKeepOpen(activeIndex, selectedIndex); | ||
| } else { | ||
| return checkDefault(currentActiveIndex, selectedIndex); | ||
| } | ||
| } | ||
| exports.getLevel = getLevel; | ||
| exports.checkIfActive = checkIfActive; | ||
| 'use strict';Object.defineProperty(exports,'__esModule',{value:!0});function getLevel(a){return a.split('-').length}function checkKeepOpen(a,b){return!!(-1<a.indexOf(b))}function checkDefault(a,b){var c=getLevel(b);if(a===b)return!0;return!(1!==c||a.slice(0,1)!==b)||!(1===c||a.slice(0,c+1)!==b)}function checkIfActive(a,b){var c=!!(2<arguments.length&&arguments[2]!==void 0)&&arguments[2],d=a.toString(),e=b.toString();return c?checkKeepOpen(a,e):checkDefault(d,e)}exports.getLevel=getLevel,exports.checkIfActive=checkIfActive; |
| { | ||
| "name": "react-simple-collapsible-element", | ||
| "version": "2.0.7", | ||
| "version": "2.0.8", | ||
| "description": "simple react collapsible supports nested elements", | ||
@@ -12,5 +12,9 @@ "main": "index.js", | ||
| "test": "jest", | ||
| "lint": "eslint ./ --fix --ext .jsx --ext .js", | ||
| "test:watch": "jest --watch", | ||
| "test:coverage": "jest --coverage", | ||
| "build": "mkdir dist && babel src --out-dir dist" | ||
| "clean": "rimraf dist", | ||
| "makeFolder": "mkdir dist", | ||
| "makeFiles": "babel src --out-dir dist", | ||
| "build": "npm run clean && npm run makeFolder && npm run makeFiles" | ||
| }, | ||
@@ -40,5 +44,7 @@ "jest": { | ||
| "babel-core": "^6.17.0", | ||
| "babel-eslint": "^8.0.1", | ||
| "babel-plugin-transform-class-properties": "^6.18.0", | ||
| "babel-plugin-transform-object-rest-spread": "^6.16.0", | ||
| "babel-preset-es2015": "^6.16.0", | ||
| "babel-preset-minify": "^0.5.0", | ||
| "babel-preset-react": "^6.16.0", | ||
@@ -48,7 +54,13 @@ "babel-preset-stage-0": "^6.16.0", | ||
| "enzyme-adapter-react-16": "^1.5.0", | ||
| "eslint": "^4.10.0", | ||
| "eslint-config-airbnb": "^16.1.0", | ||
| "eslint-plugin-import": "^2.8.0", | ||
| "eslint-plugin-jsx-a11y": "^6.0.2", | ||
| "eslint-plugin-react": "^7.4.0", | ||
| "jest": "^23.6.0", | ||
| "react": "^16.0.0", | ||
| "react-dom": "^16.0.0", | ||
| "rimraf": "^2.6.2", | ||
| "webpack": "^2.5.1" | ||
| } | ||
| } |
Sorry, the diff of this file is not supported yet
New alerts
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Trivial Package
Supply chain riskPackages less than 10 lines of code are easily copied into your own project and may not warrant the additional supply chain risk of an external dependency.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
Improved metrics
- Number of package files
- increased by20%
12
Worsened metrics
- Total package byte prevSize
- decreased by-27.62%
18617
- Dev dependency count
- increased by61.54%
21
- Lines of code
- decreased by-99.78%
1
- Number of low quality alerts
- increased by500%
6
- Number of medium supply chain risk alerts
- increased byInfinity%
2
No dependency changes