vue-devui 1.0.0-beta.16 → 1.0.0-beta.19

package/carousel/index.umd.js

@@ -1 +1 @@
-var F=Object.defineProperty;var R=Object.getOwnPropertySymbols;var _=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var $=(n,e,s)=>e in n?F(n,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):n[e]=s,k=(n,e)=>{for(var s in e||(e={}))_.call(e,s)&&$(n,s,e[s]);if(R)for(var s of R(e))q.call(e,s)&&$(n,s,e[s]);return n};(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const s={arrowTrigger:{type:String,default:"hover"},autoplay:{type:Boolean,default:!1},autoplaySpeed:{type:Number,default:3e3},height:{type:String,default:"100%"},showDots:{type:Boolean,default:!0},dotTrigger:{type:String,default:"click"},dotPosition:{type:String,default:"bottom"},activeIndex:{type:Number,default:0},activeIndexChange:{type:Function}};var P=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(t){return k({},t)},render(){const{name:t,size:d,color:i,classPrefix:g}=this;return/^((https?):)?\/\//.test(t)?e.createVNode("img",{src:t,alt:t.split("/")[t.split("/").length-1],style:{width:d,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${g} ${g}-${t}`,style:{fontSize:d,color:i}},null)}}),O="",w=e.defineComponent({name:"DCarousel",props:s,emits:["update:activeIndex"],setup(t,{emit:d}){const{arrowTrigger:i,autoplay:g,autoplaySpeed:T,dotTrigger:b,activeIndex:V,activeIndexChange:S}=t,I=500,o=e.ref(0),y=e.ref(!1),u=e.ref(0),f=e.ref(null),r=e.ref(null),c=e.ref(null);e.watch(()=>i,()=>{y.value=i==="always"},{immediate:!0}),e.watch(()=>V,()=>{u.value=V},{immediate:!0});const m=a=>{r.value&&(r.value.style.left=`${-a*100}%`)},N=a=>{setTimeout(()=>{r.value&&(r.value.style.transition=""),a.style.transform="",m(u.value)},I)},v=(a,l)=>{if(f.value){const h=f.value.getBoundingClientRect();a.style.transform=`translateX(${(l?-o.value:o.value)*h.width}px)`}},p=a=>{if(a===u.value||!f.value||!r.value)return;r.value.style.transition=`left ${I}ms ease`;let l=u.value;if(a<0&&u.value===0){l=o.value-1;const h=r.value.children[l];v(h,!0),m(-1),N(h)}else if(a>=o.value&&u.value===o.value-1){l=0;const h=r.value.children[l];v(h,!1),m(o.value),N(h)}else l=a<0?0:a>o.value-1?o.value-1:a,m(l);u.value=l,d("update:activeIndex",l),S==null||S(l),M()},E=()=>{p(u.value-1)},x=()=>{p(u.value+1)},j=a=>{i==="hover"&&(y.value=a==="enter")},B=(a,l)=>{l===b&&p(a)},D=()=>{c.value&&(clearTimeout(c.value),c.value=null)},M=()=>{D(),g&&T&&(c.value=setTimeout(()=>{x()},T))},z=a=>{o.value=a,M()};return e.onMounted(()=>{r.value&&(r.value.style.transition=`left ${I}ms ease`,r.value.style.left="0%"),M()}),e.onBeforeUnmount(()=>{D()}),{wrapperRef:f,containerRef:r,showArrow:y,currentIndex:u,itemCount:o,changeItemCount:z,goto:p,prev:E,next:x,arrowMouseEvent:j,switchStep:B}},render(){var m,N;const{showArrow:t,currentIndex:d,itemCount:i,arrowTrigger:g,height:T,showDots:b,dotPosition:V,prev:S,next:I,arrowMouseEvent:o,switchStep:y,changeItemCount:u,$slots:f}=this,r=(N=(m=f.default)==null?void 0:m.call(f))!=null?N:[];let c=r;return c.length===1&&c[0].type===e.Fragment&&(c=(c[0].children||[]).filter(v=>(v==null?void 0:v.type)!==e.Comment)),c.length!==i&&u(c.length),e.createVNode("div",{class:"devui-carousel-container",style:{height:T},onMouseenter:()=>o("enter"),onMouseleave:()=>o("leave")},[g!=="never"&&t?e.createVNode("div",{class:"devui-carousel-arrow"},[e.createVNode("button",{class:"arrow-left",onClick:()=>S()},[e.createVNode(P,{name:"arrow-left"},null)]),e.createVNode("button",{class:"arrow-right",onClick:()=>I()},[e.createVNode(P,{name:"arrow-right"},null)])]):null,e.createVNode("div",{class:"devui-carousel-item-wrapper",ref:"wrapperRef"},[e.createVNode("div",{class:"devui-carousel-item-container",style:{width:`${i*100}%`},ref:"containerRef"},[r])]),i>0&&b?e.createVNode("ul",{class:["devui-carousel-dots",V]},[c.map((v,p)=>e.createVNode("li",{class:{"dot-item":!0,active:d===p},onClick:()=>y(p,"click"),onMouseenter:()=>y(p,"hover")},null))]):null])}}),C=e.defineComponent({name:"DCarouselItem",render(){var i;const{$slots:t}=this,d=(i=t.default)==null?void 0:i.call(t);return e.createVNode("div",{class:"d-carousel-item "},[d])}});w.install=function(t){t.component(w.name,w)},C.install=function(t){t.component(C.name,C)};var A={title:"Carousel \u8D70\u9A6C\u706F",category:"\u6570\u636E\u5C55\u793A",status:"80%",install(t){t.use(w),t.use(C)}};n.Carousel=w,n.CarouselItem=C,n.default=A,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
+(function(c,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis!="undefined"?globalThis:c||self,e(c.index={},c.Vue))})(this,function(c,e){"use strict";const R={arrowTrigger:{type:String,default:"hover"},autoplay:{type:Boolean,default:!1},autoplaySpeed:{type:Number,default:3e3},height:{type:String,default:"100%"},showDots:{type:Boolean,default:!0},dotTrigger:{type:String,default:"click"},dotPosition:{type:String,default:"bottom"},activeIndex:{type:Number,default:0},activeIndexChange:{type:Function}},D={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var b=e.defineComponent({name:"DIcon",props:D,setup(a){const{name:i,size:n,color:C,classPrefix:p}=e.toRefs(a);return()=>/^((https?):)?\/\//.test(i.value)?e.createVNode("img",{src:i.value,alt:i.value.split("/")[i.value.split("/").length-1],style:{width:n.value,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${p.value} ${p.value}-${i.value}`,style:{fontSize:n.value,color:C.value}},null)}}),B="",y=e.defineComponent({name:"DCarousel",props:R,emits:["update:activeIndex"],setup(a,{emit:i}){const{arrowTrigger:n,autoplay:C,autoplaySpeed:p,dotTrigger:V,activeIndex:T,activeIndexChange:S}=a,I=500,o=e.ref(0),g=e.ref(!1),s=e.ref(0),d=e.ref(null),l=e.ref(null),u=e.ref(null);e.watch(()=>n,()=>{g.value=n==="always"},{immediate:!0}),e.watch(()=>T,()=>{s.value=T},{immediate:!0});const v=t=>{l.value&&(l.value.style.left=`${-t*100}%`)},N=t=>{setTimeout(()=>{l.value&&(l.value.style.transition=""),t.style.transform="",v(s.value)},I)},m=(t,r)=>{if(d.value){const h=d.value.getBoundingClientRect();t.style.transform=`translateX(${(r?-o.value:o.value)*h.width}px)`}},f=t=>{if(t===s.value||!d.value||!l.value)return;l.value.style.transition=`left ${I}ms ease`;let r=s.value;if(t<0&&s.value===0){r=o.value-1;const h=l.value.children[r];m(h,!0),v(-1),N(h)}else if(t>=o.value&&s.value===o.value-1){r=0;const h=l.value.children[r];m(h,!1),v(o.value),N(h)}else r=t<0?0:t>o.value-1?o.value-1:t,v(r);s.value=r,i("update:activeIndex",r),S==null||S(r),P()},k=()=>{f(s.value-1)},M=()=>{f(s.value+1)},A=t=>{n==="hover"&&(g.value=t==="enter")},E=(t,r)=>{r===V&&f(t)},x=()=>{u.value&&(clearTimeout(u.value),u.value=null)},P=()=>{x(),C&&p&&(u.value=setTimeout(()=>{M()},p))},j=t=>{o.value=t,P()};return e.onMounted(()=>{l.value&&(l.value.style.transition=`left ${I}ms ease`,l.value.style.left="0%"),P()}),e.onBeforeUnmount(()=>{x()}),{wrapperRef:d,containerRef:l,showArrow:g,currentIndex:s,itemCount:o,changeItemCount:j,goto:f,prev:k,next:M,arrowMouseEvent:A,switchStep:E}},render(){var v,N;const{showArrow:a,currentIndex:i,itemCount:n,arrowTrigger:C,height:p,showDots:V,dotPosition:T,prev:S,next:I,arrowMouseEvent:o,switchStep:g,changeItemCount:s,$slots:d}=this,l=(N=(v=d.default)==null?void 0:v.call(d))!=null?N:[];let u=l;return u.length===1&&u[0].type===e.Fragment&&(u=(u[0].children||[]).filter(m=>(m==null?void 0:m.type)!==e.Comment)),u.length!==n&&s(u.length),e.createVNode("div",{class:"devui-carousel-container",style:{height:p},onMouseenter:()=>o("enter"),onMouseleave:()=>o("leave")},[C!=="never"&&a?e.createVNode("div",{class:"devui-carousel-arrow"},[e.createVNode("button",{class:"arrow-left",onClick:()=>S()},[e.createVNode(b,{name:"arrow-left"},null)]),e.createVNode("button",{class:"arrow-right",onClick:()=>I()},[e.createVNode(b,{name:"arrow-right"},null)])]):null,e.createVNode("div",{class:"devui-carousel-item-wrapper",ref:"wrapperRef"},[e.createVNode("div",{class:"devui-carousel-item-container",style:{width:`${n*100}%`},ref:"containerRef"},[l])]),n>0&&V?e.createVNode("ul",{class:["devui-carousel-dots",T]},[u.map((m,f)=>e.createVNode("li",{class:{"dot-item":!0,active:i===f},onClick:()=>g(f,"click"),onMouseenter:()=>g(f,"hover")},null))]):null])}}),w=e.defineComponent({name:"DCarouselItem",render(){var n;const{$slots:a}=this,i=(n=a.default)==null?void 0:n.call(a);return e.createVNode("div",{class:"d-carousel-item "},[i])}});y.install=function(a){a.component(y.name,y)},w.install=function(a){a.component(w.name,w)};var $={title:"Carousel \u8D70\u9A6C\u706F",category:"\u6570\u636E\u5C55\u793A",status:"80%",install(a){a.use(y),a.use(w)}};c.Carousel=y,c.CarouselItem=w,c.default=$,Object.defineProperty(c,"__esModule",{value:!0}),c[Symbol.toStringTag]="Module"});