react-tiny-accordion/dist/index.js

Tiny, super simple accordion for React

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):e.ReactTinyAccordion=t(e.React)}(this,function(u){"use strict";function o(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function s(e){return(s=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function c(e,t){return(c=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function a(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(e):t}u=u&&u.hasOwnProperty("default")?u.default:u;var e=function(e){function r(e){var t;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,r);var n=(t=a(this,s(r).call(this,e))).props,i=n.children,o=n.selectedIndex;return t.index=void 0!==e.selectedIndex?e.selectedIndex:-1,t.nodes=[],t.state={heights:u.Children.map(i,function(e,t){return t===o?"auto":0})},t}var t,n,i;return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&c(e,t)}(r,u.Component),t=r,(n=[{key:"componentWillReceiveProps",value:function(e){var t=e.selectedIndex;void 0!==t&&this.index!==t&&this.toggle(t)}},{key:"componentWillUnmount",value:function(){clearTimeout(this.timeout)}},{key:"close",value:function(e){var t=this;setTimeout(function(){return t.setHeight(e,0)},50)}},{key:"setHeight",value:function(e,t,n){var i=this.state.heights.slice();i[e]=t,this.setState({heights:i},n)}},{key:"open",value:function(e){var t=this;clearTimeout(this.timeout),this.setHeight(e,this.nodes[e].children[1].children[0].offsetHeight,function(){t.timeout=setTimeout(function(){return t.setHeight(e,"auto")},t.props.transitionDuration)})}},{key:"setFixedHeightOnCurrentlyOpenedItem",value:function(){var t=this;return new Promise(function(e){-1<t.index?t.setHeight(t.index,t.nodes[t.index].children[1].children[0].offsetHeight,e):e()})}},{key:"toggle",value:function(e,t){var n=this,i=this.props,o=i.onChange,r=i.changeOnClick;clearTimeout(this.timeout),t&&(o&&o(e,this.index!==e,this.index!==e?e:-1),!r)||this.setFixedHeightOnCurrentlyOpenedItem().then(function(){-1<n.index&&n.close(n.index),-1<e&&e!==n.index?(n.index=e,n.open(e)):n.index=-1})}},{key:"render",value:function(){var n=this,e=this.props,i=e.transitionDuration,o=e.transitionTimingFunction,t=e.className,r=e.openClassName,s=u.Children.toArray(this.props.children).filter(function(e){return e}).map(function(e,t){return u.createElement("div",{key:t,ref:function(e){n.nodes[t]=e},className:n.index===t?r:""},u.createElement("div",{onClick:function(){return n.toggle(t,!0)}},e.props["data-header"]),u.createElement("div",{style:{overflow:"hidden",transition:"height ".concat(i,"ms ").concat(o),height:n.state.heights[t]}},e))});return u.createElement("div",{className:t},s)}}])&&o(t.prototype,n),i&&o(t,i),r}();return e.defaultProps={transitionDuration:500,transitionTimingFunction:"ease",openClassName:"open",changeOnClick:!0},e});