react-flickity-component
Version:
react flickity component
3 lines (2 loc) • 2.21 kB
JavaScript
(function(t,l){typeof exports=="object"&&typeof module<"u"?module.exports=l(require("react"),require("react-dom"),require("imagesloaded")):typeof define=="function"&&define.amd?define(["react","react-dom","imagesloaded"],l):(t=typeof globalThis<"u"?globalThis:t||self,t.ReactFlickityComponent=l(t.React,t.ReactDOM,t.imagesloaded))})(this,function(t,l,d){"use strict";const f=!!(typeof window<"u"&&window.document&&window.document.createElement),o=class o extends t.Component{constructor(e){super(e),this.carousel=null,this.flkty=null,this.state={flickityReady:!1,flickityCreated:!1,cellCount:0}}static getDerivedStateFromProps(e,i){const s=t.Children.count(e.children);return s!==i.cellCount?{flickityReady:!1,cellCount:s}:null}componentDidUpdate(e,i){if(!this.flkty)return;const{children:s,options:{draggable:a,initialIndex:n}={},reloadOnUpdate:u,disableImagesLoaded:h}=this.props,{flickityReady:y}=this.state;if(u||!i.flickityReady&&y){const p=this.flkty.isActive;this.flkty.deactivate(),this.flkty.selectedIndex=Number(n)||0,this.flkty.options.draggable=a===void 0?s?t.Children.count(s)>1:!1:a,p&&this.flkty.activate(),!h&&this.carousel&&d(this.carousel,()=>{var c;(c=this.flkty)==null||c.reloadCells()})}else this.flkty.reloadCells()}async componentDidMount(){if(!f||!this.carousel)return;const e=(await import("flickity")).default,{flickityRef:i,options:s={}}=this.props;this.flkty=new e(this.carousel,s),i&&i(this.flkty),this.props.static?this.setReady():this.setState({flickityCreated:!0})}setReady(){if(this.state.flickityReady)return;const e=()=>this.setState({flickityReady:!0});this.props.disableImagesLoaded?e():this.carousel&&d(this.carousel,e)}renderPortal(){if(!this.carousel)return null;const e=this.carousel.querySelector(".flickity-slider");if(e){const i=l.createPortal(this.props.children,e);return setTimeout(()=>this.setReady(),0),i}}render(){const{elementType:e="div",className:i="",static:s,children:a}=this.props;return t.createElement(e,{className:i,ref:n=>{this.carousel=n}},s?a:this.renderPortal())}};o.defaultProps={className:"",disableImagesLoaded:!1,elementType:"div",options:{},reloadOnUpdate:!1,static:!1};let r=o;return r});
//# sourceMappingURL=react-flickity-component.umd.js.map