const e=require("../../_util/type.js"),t=require("../../vc-util/Dom/class.js");let n=require("vue");var r=e=>e?{left:e.offsetLeft,right:e.parentElement.clientWidth-e.clientWidth-e.offsetLeft,width:e.clientWidth}:null,i=e=>e===void 0?void 0:`${e}px`,a=(0,n.defineComponent)({props:{value:e.anyType(),getValueIndex:e.anyType(),prefixCls:e.anyType(),motionName:e.anyType(),onMotionStart:e.anyType(),onMotionEnd:e.anyType(),direction:e.anyType(),containerRef:e.anyType()},emits:[`motionStart`,`motionEnd`],setup(e,{emit:a}){let o=(0,n.ref)(),s=t=>{let n=e.getValueIndex(t),r=e.containerRef.value?.querySelectorAll(`.${e.prefixCls}-item`)[n];return r?.offsetParent&&r},c=(0,n.ref)(null),l=(0,n.ref)(null);(0,n.watch)(()=>e.value,(e,t)=>{let n=s(t),i=s(e),o=r(n),u=r(i);c.value=o,l.value=u,a(n&&i?`motionStart`:`motionEnd`)},{flush:`post`});let u=(0,n.computed)(()=>e.direction===`rtl`?i(-c.value?.right):i(c.value?.left)),d=(0,n.computed)(()=>e.direction===`rtl`?i(-l.value?.right):i(l.value?.left)),f,p=e=>{clearTimeout(f),(0,n.nextTick)(()=>{e&&(e.style.transform=`translateX(var(--thumb-start-left))`,e.style.width=`var(--thumb-start-width)`)})},m=n=>{f=setTimeout(()=>{n&&(t.addClass(n,`${e.motionName}-appear-active`),n.style.transform=`translateX(var(--thumb-active-left))`,n.style.width=`var(--thumb-active-width)`)})},h=n=>{c.value=null,l.value=null,n&&(n.style.transform=null,n.style.width=null,t.removeClass(n,`${e.motionName}-appear-active`)),a(`motionEnd`)},g=(0,n.computed)(()=>({"--thumb-start-left":u.value,"--thumb-start-width":i(c.value?.width),"--thumb-active-left":d.value,"--thumb-active-width":i(l.value?.width)}));return(0,n.onBeforeUnmount)(()=>{clearTimeout(f)}),()=>{let t={ref:o,style:g.value,class:[`${e.prefixCls}-thumb`]};return(0,n.createVNode)(n.Transition,{appear:!0,onBeforeEnter:p,onEnter:m,onAfterEnter:h},{default:()=>[!c.value||!l.value?null:(0,n.createVNode)(`div`,t,null)]})}}});exports.default=a;