amis-playground/dist/assets/Carousel-a2d001c7.js

amis-playground 是一个amis在线代码编辑器可实时预览运行效果

import{dG as I,dH as H,dI as P,a as Z,R as s,Y,aw as ve,r as fe,j as K,k as Q,I as F,e as v,ai as ge,dJ as ye,dK as $,Q as O,U as we,f as d,p as m,q as o,s as Ee,h as Se,D as U,d as Ce,a4 as xe,cR as Te,H as Me}from"./index-7c288cb3.js";var A,Ne=(A={},A[I]="in",A[H]="in",A[P]="out",A),Ae={component:function(h){var n,e,r=h.data||{},t=h.thumbMode,a=h.classnames;return s.createElement(s.Fragment,null,r.hasOwnProperty("image")?s.createElement(Te,{src:r.image,title:r.title,href:r.href,blank:r.blank,htmlTarget:r.htmlTarget,caption:r.description,thumbMode:(e=(n=r.thumbMode)!==null&&n!==void 0?n:t)!==null&&e!==void 0?e:"contain",imageMode:"original",className:a("Carousel-image")}):r.hasOwnProperty("html")?s.createElement(Me,{html:r.html,filterHtml:h.env.filterHtml}):r.hasOwnProperty("item")?s.createElement("span",null,r.item):s.createElement("p",null))}},z=20,be=function(h){Z(n,h);function n(){var e=h!==null&&h.apply(this,arguments)||this;return e.wrapperRef=s.createRef(),e.state={current:0,options:e.props.options||Y(e.props)||[],nextAnimation:"",mouseStartLocation:null},e.loading=!1,e}return n.prototype.componentDidMount=function(){this.prepareAutoSlide()},n.prototype.componentDidUpdate=function(e){var r=this.props,t=r.options||Y(r)||[],a=e.options||Y(e)||[];ve(a,t)&&this.setState({options:t})},n.prototype.componentWillUnmount=function(){this.clearAutoTimeout()},n.prototype.doAction=function(e,r,t,a){var i=e==null?void 0:e.actionType;~["next","prev"].indexOf(i)?this.autoSlide(i):i==="goto-image"&&this.changeSlide((a==null?void 0:a.activeIndex)-1)},n.prototype.prepareAutoSlide=function(){if(!(this.state.options.length<2)&&(this.clearAutoTimeout(),this.props.auto)){var e=this.props.interval;this.intervalTimeout=setTimeout(this.autoSlide,typeof e=="string"?fe(e,this.props.data)||5e3:e)}},n.prototype.autoSlide=function(e){this.clearAutoTimeout();var r=this.props.animation,t=this.state.nextAnimation;switch(e){case"prev":r==="slide"?t="slideRight":t="",this.transitFramesTowards("right",t);break;case"next":default:t="",this.transitFramesTowards("left",t);break}this.durationTimeout=setTimeout(this.prepareAutoSlide,this.props.duration)},n.prototype.transitFramesTowards=function(e,r){return K(this,void 0,void 0,function(){var t,a,i,l,u,p;return Q(this,function(f){switch(f.label){case 0:if(t=this.state.current,a=t,this.props.loop===!1&&(t===0&&e==="right"||t===this.state.options.length-1&&e==="left"))return[2];switch(e){case"left":t=this.getFrameId("next");break;case"right":t=this.getFrameId("prev");break}return i=this.props,l=i.dispatchEvent,u=i.data,[4,l("change",U(u,{activeIndex:t+1,prevIndex:a}))];case 1:return p=f.sent(),p!=null&&p.prevented?[2]:(this.setState({current:t,nextAnimation:r}),[2])}})})},n.prototype.getFrameId=function(e){var r=this.state,t=r.options,a=r.current,i=t.length;switch(e){case"prev":return(a-1+i)%i;case"next":return(a+1)%i;default:return a}},n.prototype.next=function(){var e=this.props.multiple;this.loading&&e&&e.count>1||this.autoSlide("next")},n.prototype.prev=function(){var e=this.props.multiple;this.loading&&e&&e.count>1||this.autoSlide("prev")},n.prototype.clearAutoTimeout=function(){clearTimeout(this.intervalTimeout),clearTimeout(this.durationTimeout)},n.prototype.changeSlide=function(e){return K(this,void 0,void 0,function(){var r,t,a,i,l,u;return Q(this,function(p){switch(p.label){case 0:return r=this.state.current,t=this.props,a=t.dispatchEvent,i=t.data,l=t.multiple,this.loading&&l&&l.count>1?[2]:[4,a("change",U(i,{activeIndex:e,prevIndex:r}))];case 1:return u=p.sent(),u!=null&&u.prevented?[2]:(this.setState({current:e}),[2])}})})},n.prototype.renderDots=function(){var e=this,r=this.props.classnames,t=this.state,a=t.current,i=t.options;return s.createElement("div",{className:r("Carousel-dotsControl"),onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},Array.from({length:i.length}).map(function(l,u){return s.createElement("span",{key:u,onClick:function(){return e.changeSlide(u)},className:r("Carousel-dot",a===u?"is-active":"")})}))},n.prototype.renderArrows=function(){var e=this.props.classnames;return s.createElement("div",{className:e("Carousel-arrowsControl"),onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},s.createElement("div",{className:e("Carousel-leftArrow"),onClick:this.prev},s.createElement(F,{icon:"left-arrow",className:"icon"})),s.createElement("div",{className:e("Carousel-rightArrow"),onClick:this.next},s.createElement(F,{icon:"right-arrow",className:"icon"})))},n.prototype.handleMouseEnter=function(){var e=this.props.multiple;e&&e.count>1||this.clearAutoTimeout()},n.prototype.handleMouseLeave=function(){var e=this.props.multiple;e&&e.count>1||this.prepareAutoSlide()},n.prototype.getNewOptions=function(e,r){r===void 0&&(r=1);var t=e;if(Array.isArray(e)&&e.length){t=new Array(e.length);for(var a=0;a<e.length;a++){t[a]=new Array(r);for(var i=0;i<r;i++)t[a][i]=e[(a+i)%e.length]}}return t},n.prototype.getEventScreenXY=function(e){var r,t,a,i,l,u,p,f;return e.screenX!==void 0?(p=e.screenX,f=e.screenY):!((r=e.touches)===null||r===void 0)&&r.length?(p=(t=e.touches[0])===null||t===void 0?void 0:t.screenX,f=(a=e.touches[0])===null||a===void 0?void 0:a.screenY):!((i=e.changedTouches)===null||i===void 0)&&i.length&&(p=(l=e.changedTouches[0])===null||l===void 0?void 0:l.screenX,f=(u=e.changedTouches[0])===null||u===void 0?void 0:u.screenY),{screenX:p,screenY:f}},n.prototype.addMouseDownListener=function(e){var r=this.props.direction,t=this.getEventScreenXY(e),a=t.screenX,i=t.screenY,l=r==="vertical"?i:a;l!==void 0&&this.setState({mouseStartLocation:l})},n.prototype.addMouseUpListener=function(e){var r=this.getEventScreenXY(e),t=r.screenX,a=r.screenY,i=this.props.direction,l=i==="vertical"?a:t;this.state.mouseStartLocation!==null&&l!==void 0&&(l-this.state.mouseStartLocation>z?this.autoSlide("prev"):this.state.mouseStartLocation-l>z&&this.autoSlide(),this.setState({mouseStartLocation:null}))},n.prototype.render=function(){var e,r=this,t=this.props,a=t.render,i=t.className,l=t.style,u=t.classnames,p=t.itemSchema,f=t.animation,b=t.width,_=t.height,G=t.controls,ee=t.controlsTheme,te=t.placeholder,re=t.data,ne=t.name,C=t.duration,x=t.multiple,ae=t.alwaysShowArrow,g=t.icons,T=t.id,j=t.wrapperCustomStyle,oe=t.env,L=t.themeCss,R=this.state,E=R.options,V=R.current,ie=R.nextAnimation,X=null,M=l?v({},l):{};b&&(isNaN(Number(b))?M.width=b:M.width=b+"px"),_&&(isNaN(Number(_))?M.height=_:M.height=_+"px");var W=ge([G.indexOf("dots")>-1,G.indexOf("arrows")>-1],2),se=W[0],B=W[1],k=ie||f;if(Array.isArray(E)&&E.length){var c=1;x&&typeof x.count=="number"&&x.count>=2&&(c=Math.floor(x.count)<E.length?Math.floor(x.count):E.length);var le=this.getNewOptions(E,c),ue=c>1&&typeof C=="number"?"".concat(C,"ms"):C||"500ms",pe=c>1&&typeof C=="number"?C:500;X=s.createElement("div",{ref:this.wrapperRef,className:u("Carousel-container"),onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave},E.map(function(ce,D){return s.createElement(ye,{mountOnEnter:!0,unmountOnExit:!0,in:D===V,timeout:pe,key:D},function(w){var S;w===I&&r.wrapperRef.current&&r.wrapperRef.current.childNodes.forEach(function(y){return y.offsetHeight}),c>1&&((w===I||w===P)&&!r.loading?r.loading=!0:(w===H||w===$)&&r.loading&&(r.loading=!1));var de=(S={},S[I]=0,S[H]=0,S[P]=k==="slideRight"?100/c:-100/c,S[$]=k==="slideRight"?-100/c:100/c,S),he=c>1?v({transitionTimingFunction:"linear",transitionDuration:ue},f==="slide"?{transform:"translateX(".concat(de[w],"%)")}:{}):{},q=function(y){var N,J=y.itemSchema,me=Ce(y,["itemSchema"]);return a("".concat(V,"/body"),J||p?J||p:Ae,{thumbMode:r.props.thumbMode,data:U(re,xe(y)?me:(N={item:y},N[ne]=y,N))})};return s.createElement("div",{className:u("Carousel-item",k,Ne[w]),style:he},c===1?q(ce):null,c>1?le[D].map(function(y,N){return s.createElement("div",{key:N,style:{width:100/c+"%",height:"100%",float:"left"}},q(y))}):null)})}))}return s.createElement("div",{className:u("Carousel Carousel--".concat(ee),(e={},e["Carousel-arrow--always"]=!!ae,e),i,O(v(v({},this.props),{name:"baseControlClassName",id:T,themeCss:L})),O(v(v({},this.props),{name:"wrapperCustomStyle",id:T,themeCss:j})),{"Carousel-vertical":this.props.direction==="vertical"}),onMouseDown:this.props.mouseEvent?this.addMouseDownListener:void 0,onMouseUp:this.props.mouseEvent?this.addMouseUpListener:void 0,onMouseLeave:this.props.mouseEvent?this.addMouseUpListener:void 0,onTouchStart:this.props.mouseEvent?this.addMouseDownListener:void 0,onTouchEnd:this.props.mouseEvent?this.addMouseUpListener:void 0,style:M},X||te,se?this.renderDots():null,B?s.createElement("div",{className:u("Carousel-leftArrow",O(v(v({},this.props),{name:"galleryControlClassName",id:T,themeCss:L}))),onClick:this.prev},g&&g.prev?s.isValidElement(g.prev)?g.prev:a("arrow-prev",g.prev):s.createElement(F,{icon:"left-arrow",className:"icon",iconContent:"ImageGallery-prevBtn"})):null,B?s.createElement("div",{className:u("Carousel-rightArrow",O(v(v({},this.props),{name:"galleryControlClassName",id:T,themeCss:L}))),onClick:this.next},g&&g.next?s.isValidElement(g.next)?g.next:a("arrow-next",g.next):s.createElement(F,{icon:"right-arrow",className:"icon",iconContent:"ImageGallery-nextBtn"})):null,s.createElement(we,v({},this.props,{config:{wrapperCustomStyle:j,id:T,themeCss:L,classNames:[{key:"baseControlClassName"},{key:"galleryControlClassName",weights:{default:{suf:" svg",important:!0}}}]},env:oe})))},n.defaultProps={auto:!0,interval:5e3,duration:500,controlsTheme:"light",animation:"fade",controls:["dots","arrows"],placeholder:"-",multiple:{count:1},alwaysShowArrow:!1},d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"prepareAutoSlide",null),d([m,o("design:type",Function),o("design:paramtypes",[String]),o("design:returntype",void 0)],n.prototype,"autoSlide",null),d([m,o("design:type",Function),o("design:paramtypes",[String,String]),o("design:returntype",Promise)],n.prototype,"transitFramesTowards",null),d([m,o("design:type",Function),o("design:paramtypes",[String]),o("design:returntype",void 0)],n.prototype,"getFrameId",null),d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"next",null),d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"prev",null),d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"clearAutoTimeout",null),d([m,o("design:type",Function),o("design:paramtypes",[Number]),o("design:returntype",Promise)],n.prototype,"changeSlide",null),d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"handleMouseEnter",null),d([m,o("design:type",Function),o("design:paramtypes",[]),o("design:returntype",void 0)],n.prototype,"handleMouseLeave",null),d([m,o("design:type",Function),o("design:paramtypes",[Object]),o("design:returntype",void 0)],n.prototype,"addMouseDownListener",null),d([m,o("design:type",Function),o("design:paramtypes",[Object]),o("design:returntype",void 0)],n.prototype,"addMouseUpListener",null),n}(s.Component),Le=function(h){Z(n,h);function n(e,r){var t=h.call(this,e)||this,a=r;return a.registerComponent(t),t}return n.prototype.componentWillUnmount=function(){var e;(e=h.prototype.componentWillUnmount)===null||e===void 0||e.call(this);var r=this.context;r.unRegisterComponent(this)},n.contextType=Ee,n=d([Se({type:"carousel"}),o("design:paramtypes",[Object,Object])],n),n}(be);export{be as Carousel,Le as CarouselRenderer};