react-accordion-with-header/umd/react-accordion-with-header.min.js

React accordion component with flexbox header

/*!
 * react-accordion-with-header v0.1.3 - https://react-accordion-with-header.now.sh/
 * MIT Licensed
 */
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.ReactAccordionWithHeader=t(require("react")):e.ReactAccordionWithHeader=t(e.React)}("undefined"!=typeof self?self:this,function(e){return function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=2)}([function(t,n){t.exports=e},function(e,t,n){var r;!function(){"use strict";var n={}.hasOwnProperty;function o(){for(var e=[],t=0;t<arguments.length;t++){var r=arguments[t];if(r){var a=typeof r;if("string"===a||"number"===a)e.push(r);else if(Array.isArray(r)&&r.length){var i=o.apply(null,r);i&&e.push(i)}else if("object"===a)for(var c in r)n.call(r,c)&&r[c]&&e.push(c)}}return e.join(" ")}void 0!==e&&e.exports?(o.default=o,e.exports=o):void 0===(r=function(){return o}.apply(t,[]))||(e.exports=r)}()},function(e,t,n){e.exports=n(3)},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4),o=n(5),a=n(7),i=n(8);n.d(t,"AccordionWithHeader",function(){return r.a}),n.d(t,"AccordionHeader",function(){return o.a}),n.d(t,"AccordionPanel",function(){return a.a}),n.d(t,"AccordionNode",function(){return i.a})},function(e,t,n){"use strict";n.d(t,"a",function(){return s});var r=n(0),o=n.n(r),a=n(1),i=n.n(a),c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e};function p(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}var s=function(e){function t(){var n,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);for(var o=arguments.length,a=Array(o),i=0;i<o;i++)a[i]=arguments[i];return n=r=p(this,e.call.apply(e,[this].concat(a))),r.state=c({panels:[],active:[]},r.props),r.onClickHeader=function(e){var t=void 0;r.state.active.includes(e)?t=r.state.active.filter(function(t){return t!==e}):((t=r.props.multipleOkay?r.state.active:[]).push(r.state.panels[e]),t.sort()),r.setState(function(e){return{active:t,multipleOkay:e.multipleOkay!==r.props.multipleOkay?r.props.multipleOkay:e.multipleOkay}},function(){if(r.props.actionCallback){var e,n=r.state.panels.map(function(e){return{panel:e,open:t.includes(e)}});(e=r.props).actionCallback.apply(e,[n].concat(r.state))}})},r.checkExpanded=function(e,t){return Array.isArray(t)?t.some(function(t){return t===e}):e===t},p(r,n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),t.prototype.componentDidMount=function(){var e=void 0,t=this.props,n=t.children,o=t.active,a=t.firstOpen;if(!n)throw new Error("AccordionWithHeader must have children!");if(e=r.Children.map(n,function(e){return+e.key}),this.setState({panels:e}),a&&this.setState({active:[0]}),void 0!==o){!function(){if("number"==typeof o||!Array.isArray(o))throw new Error("this.props.active must be an array");o.forEach(function(t){if(!e.includes(t))throw new Error("Items in this.props.active array are not included in panel array!\n                Check that one or more array indexes are properly passed in.")})}(),this.setState(function(e){return{active:Array.from(new Set([].concat(e.active,o)))}})}},t.prototype.componentDidUpdate=function(e){if(e.children.length!=this.props.children.length){var t=this.props.children,n=r.Children.map(t,function(e){return+e.key});this.setState({panels:n})}},t.prototype.render=function(){var e=this,t=this.props,n=t.className,a=t.style,p=t.children,s=t.active,l=!s?this.state.active:s;return o.a.createElement("div",{className:i()(n),style:c({},a)},r.Children.map(p,function(t,n){return Object(r.cloneElement)(t,{indexKey:n,key:n,onClickHeader:function(){return e.onClickHeader(n)},isExpanded:e.checkExpanded(n,l)})}))},t}(r.Component);s.defaultProps={className:"react-accordion-with-header",multipleOkay:!1,firstOpen:!1,style:{boxShadow:"0 0 0 1px rgba(63,63,68,.05), 0 1px 3px 0 rgba(63,63,68,.15)",borderRadius:3}}},function(e,t,n){"use strict";n.d(t,"a",function(){return l});var r=n(0),o=n.n(r),a=n(1),i=n.n(a),c=n(6),p=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e};function s(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}var l=function(e){function t(){var n,r;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);for(var a=arguments.length,i=Array(a),c=0;c<a;c++)i[c]=arguments[c];return n=r=s(this,e.call.apply(e,[this].concat(i))),r.renderChildren=function(){if(!r.props.template&&!r.props.children&&!r.props.title)throw new Error("AccordionHeader must have a title or template or at least one child!");return r.props.title?o.a.createElement("div",null,o.a.createElement("h1",null,r.props.title)):r.props.template?r.props.template:r.props.children},s(r,n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),t.prototype.render=function(){var e,t=this.props,n=t.style,r=t.titleColor,a=t.verticalAlignment,s=t.horizontalAlignment,l=t.className,u=t.isExpanded,f=t.onClickHeader,d=((e={cursor:"pointer",color:r||"black",display:"-webkit-flex"}).display="flex",e.flexDirection="row",e.alignItems=Object(c.b)(a),e.justifyContent=Object(c.a)(s),e);return o.a.createElement("div",{className:i()(l,{"header-is-expanded":u}),onClick:f,style:p({},n,d)},this.renderChildren())},t}(r.PureComponent);l.defaultProps={horizontalAlignment:"centerSpaceAround",verticalAlignment:"center",titleColor:"black",style:{padding:10,boxShadow:"0 0 0 1px rgba(63,63,68,.05), 1px 1px 3px 0 rgba(63,63,68,.15)",borderRadius:3}}},function(e,t,n){"use strict";n.d(t,"a",function(){return r}),n.d(t,"b",function(){return o});var r=function(e){var t={left:"flex-start",right:"flex-end",center:"center",centerSpaceAround:"space-around",spaceAround:"space-around",centerSpaceBetween:"space-between",spaceBetween:"space-between",spaceEvenly:"space-evenly",stretch:"stretch",default:"flex-start"};return t[e]||t.default},o=function(e){var t={bottom:"flex-end",top:"flex-start",center:"center",default:"center"};return t[e]||t.default}},function(e,t,n){"use strict";n.d(t,"a",function(){return u});var r=n(0),o=n.n(r),a=n(1),i=n.n(a),c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e};function p(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}var s={speed:250},l={overflow:"hidden",padding:0},u=function(e){function t(){var n,a;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);for(var i=arguments.length,c=Array(i),s=0;s<i;s++)c[s]=arguments[s];return n=a=p(this,e.call.apply(e,[this].concat(c))),a.state={panelHeight:0},a.preloadImages=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],t=0,n=function(n){++t===e.length&&a.calcHeight()};e.forEach(function(e){var t=new Image;t.src=e.src,t.onload=t.onerror=n})},a.calcHeight=function(){if(a.componentRef){var e=a.componentRef.current.clientHeight;a.setState({panelHeight:e})}else{var t=r.Children.map(a.props.children,function(e,t){return a.refs["item-"+e.props.key]}).reduce(function(e,t){return e+t.clientHeight},a.state.panelHeight);a.setState({panelHeight:t})}},a.renderChildren=function(){if(!a.props.template&&!a.props.children)throw new Error("AccordionPanel must have at least one child!");var e=function(e){return r.Children.map(e,function(e,t){var n=o.a.forwardRef(function(t,n){return a.componentRef=n,o.a.createElement("div",{ref:n},e)}),r=o.a.createRef();return o.a.createElement(n,{ref:r})})};return a.props.template?(console.warn("The template prop will be deprecated in the future. \n          Prefer passing in your component directly as children: https://reactjs.org/docs/composition-vs-inheritance.html"),e(Object(r.cloneElement)(a.props.template))):"function"==typeof a.props.children.type?e(a.props.children):r.Children.map(a.props.children,function(e){return Object(r.cloneElement)(e,{ref:"item-"+e.props.key})})},p(a,n)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),t.prototype.componentDidMount=function(){var e=this.accordionPanelRef;if(e){var t=e.querySelectorAll("img");t.length>0?this.preloadImages(t):this.calcHeight()}},t.prototype.render=function(){var e=this,t=this.props,n=t.className,r=t.isExpanded,a=t.style,p={transition:"all "+(t.speed||s.speed)+"ms ease-in-out",maxHeight:r?this.state.panelHeight:0,opacity:r?1:0};return o.a.createElement("div",{ref:function(t){return e.accordionPanelRef=t},className:i()(n,{"is-expanded":r}),style:c({},a,l,p)},this.renderChildren())},t}(r.PureComponent);u.defaultProps=s},function(e,t,n){"use strict";n.d(t,"a",function(){return p});var r=n(0),o=n.n(r),a=n(1),i=n.n(a),c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e};var p=function(e){function t(){return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t),function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,e.apply(this,arguments))}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),t.prototype.render=function(){var e=this.props,t=e.indexKey,n=e.className,a=e.style,p=e.children,s=e.isExpanded,l=e.onClickHeader;return p?o.a.createElement("div",{className:i()(n),style:c({},a)},r.Children.map(p,function(e){return Object(r.cloneElement)(e,c({indexKey:t,isExpanded:s,onClickHeader:l},e.props))})):(console.warn("AccordionNode component has no inner items!"),null)},t}(r.PureComponent)}]).default});
//# sourceMappingURL=react-accordion-with-header.min.js.map