@carbon/utilities
Version:
Utilities and helpers to drive consistency across software products using the Carbon Design System
2 lines (1 loc) • 3.06 kB
JavaScript
;var g=Object.defineProperty;var J=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.prototype.hasOwnProperty;var U=(r,l)=>{for(var o in l)g(r,o,{get:l[o],enumerable:!0})},X=(r,l,o,s)=>{if(l&&typeof l=="object"||typeof l=="function")for(let i of K(l))!Q.call(r,i)&&i!==o&&g(r,i,{get:()=>l[i],enumerable:!(s=J(l,i))||s.enumerable});return r};var Y=r=>X(g({},"__esModule",{value:!0}),r);var ee={};U(ee,{initCarousel:()=>Z});module.exports=Y(ee);var h=require("./swipeEvents");const Z=(r,l)=>{const o="carousel";let s=[0],i=[0];const c={},E=10,{onViewChangeStart:M,onViewChangeEnd:v,excludeSwipeSupport:L}=l||{},C=(e,t)=>{c[e]=t},k=(e,t)=>{if(e.querySelector(`.${t}`))return;const n=document.createElement("div");for(n.classList.add(`${t}`);e.firstChild;)n.appendChild(e.firstChild);e.appendChild(n)},$=()=>s.map(e=>({id:e,elem:c[e]})),y=()=>{const e=Object.keys(c).length,t=c[e-1],n=$();return{currentIndex:s[0],lastIndex:parseInt(t?.dataset.index||s[0].toString(),10),totalViews:e,historyStack:n}},H=()=>{i=[...s];const e=y();M?.(e)},_=e=>{if(!e)return;const t=e.dataset.index;if(t&&s[0]===parseInt(t,10)){const n=y();v?.(n)}},V=e=>{const n=Object.keys(c).length-1;return Math.max(0,Math.min(e,n))},T=e=>{const t=V(e);s[0]!==t&&(H(),s=[t,...s],m(!1))},w=e=>{_(e)},R=(e,t,n,a,u)=>{e.classList.add(`${o}__view`),e.classList.toggle(`${o}__view-in-stack`,t&&!n),e.classList.toggle(`${o}__view-active`,t&&n),u&&!a&&e.classList.add(`${o}__view-recycle-in`),!u&&a&&e.classList.add(`${o}__view-recycle-out`)},A=e=>{e.classList.remove(`${o}__view-recycle-in`,`${o}__view-recycle-out`)},b=e=>e*parseFloat(getComputedStyle(document.documentElement).fontSize),I=e=>{const t=b(E);if(r.clientHeight<t){e<t&&(e=t);const a=r.querySelector(`.${o}__itemsWrapper`);a&&(a.style.blockSize=`${e}px`)}},m=e=>{let t=0;Array.from(x).forEach((n,a)=>{const u=s.findIndex(d=>d===a),S=i.filter(d=>d===a).length,F=i.length>s.length&&i[0]===a&&S>0,N=i.length<s.length&&s[0]===a&&S>0,P=u>-1,B=a===s[0];if(R(n,P,B,F,N),e){C(a,n),setTimeout(()=>{(!t||n.offsetHeight<t&&t>b(E))&&(t=n.offsetHeight),n.style.position="absolute",I(t)});const d=G=>{A(n),G.target===c[s[0]]&&w(n)};n._carouselListener=d,n.addEventListener("animationend",d),n.addEventListener("transitionend",d),n.setAttribute("data-index",a.toString())}}),e&&_(Array.from(x)[0])},f=()=>{const e=s[0]+1;T(e)},p=()=>{s.length-1>=1&&(H(),s=s.slice(1),m(!1))},W=e=>{T(e)},q=()=>({index:s[0],item:c[s[0]]}),z=()=>{s=[0],m(!1)},j=()=>{Object.values(c).forEach(e=>{e&&e._carouselListener&&(e.removeEventListener("animationend",e._carouselListener),e.removeEventListener("transitionend",e._carouselListener))}),L||(0,h.registerSwipeEvents)(r,f,p,!0)},D=e=>{const t=e.querySelector("slot");return t?t.assignedElements({flatten:!0}):Array.from(e.children)};k(r,`${o}__itemsWrapper`);const O=r.querySelector(`.${o}__itemsWrapper`),x=D(O);return r.classList.add(`${o}__view-stack`),m(!0),L||(0,h.registerSwipeEvents)(r,f,p,!1),{next:f,prev:p,reset:z,goToIndex:W,getActiveItem:q,destroyEvents:j,allViews:c}};