@zydon/common 2.1.39 → 2.1.41

package/dist/components/carousel/index.js

@@ -11,6 +11,6 @@ import he from '@mui/material/SvgIcon';
 import _e from '@mui/material/NoSsr';
 import Xe from 'embla-carousel-react';
 
-var Ge={xs:"(min-width: 0px)",sm:"(min-width: 600px)",md:"(min-width: 900px)",lg:"(min-width: 1200px)",xl:"(min-width: 1536px)"};var c={root:"mnl__carousel__root",container:"mnl__carousel__container",dots:"mnl__carousel__dots",dot:"mnl__carousel__dot",arrows:"mnl__carousel__arrows",arrowsLabel:"mnl__carousel__arrows_label",arrowPrev:"mnl__carousel__btn--prev",arrowNext:"mnl__carousel__btn--next",arrowSvg:"mnl__carousel__btn__svg",slide:"mnl__carousel__slide",slideContent:"mnl__carousel__slide__content",thumbs:"mnl__carousel__thumbs",thumb:"mnl__carousel__thumb",thumbContainer:"mnl__carousel__thumbs__container",thumbImage:"mnl__carousel__thumb__image",progress:"mnl__carousel__progress",progressBar:"mnl__carousel__progress__bar",state:{selected:"state--selected",disabled:"state--disabled"}};var pe=styled(N,{shouldForwardProp:e=>e!=="axis"&&e!=="slideSpacing"})(({axis:e,slideSpacing:o})=>({display:"block",position:"relative",...e==="x"&&{minWidth:0,paddingLeft:o},...e==="y"&&{minHeight:0,paddingTop:o}})),me=styled(N)(()=>({overflow:"hidden",position:"relative",borderRadius:"inherit"}));function w({sx:e,options:o,children:s,...r}){let i=de(o?.slidesToShow);return jsx(pe,{component:"li",axis:o?.axis??"x",slideSpacing:o?.slideSpacing,className:c.slide,sx:{flex:i,...e},...r,children:o?.parallax?jsx(me,{className:c.slideContent,children:jsx("div",{className:"slide__parallax__layer",children:s})}):s})}function de(e){return e&&typeof e=="object"?Object.keys(e).reduce((o,s)=>{let r=e[s];return o[s]=W(r),o},{}):W(e)}function W(e=1){if(typeof e=="string"){if(!(e==="auto"||e.endsWith("%")||e.endsWith("px")))throw new Error("Only accepts values: auto, px, %, or number.");return `0 0 ${e}`}if(typeof e=="number")return `0 0 ${100/e}%`;throw new Error("Invalid value type. Only accepts values: auto, px, %, or number.")}var T=styled(N,{shouldForwardProp:e=>e!=="axis"})(({axis:e})=>({margin:"auto",width:"100%",maxWidth:"100%",overflow:"hidden",position:"relative",...e==="y"&&{height:"100%"}})),I=styled(N,{shouldForwardProp:e=>e!=="axis"&&e!=="slideSpacing"})(({axis:e,slideSpacing:o})=>({display:"flex",backfaceVisibility:"hidden",...e==="x"&&{touchAction:"pan-y pinch-zoom",marginLeft:`calc(${o} * -1)`},...e==="y"&&{height:"100%",flexDirection:"column",touchAction:"pan-x pinch-zoom",marginTop:`calc(${o} * -1)`}}));function io({carousel:e,children:o,sx:s,slotProps:r}){let{mainRef:i,options:a}=e,t=a?.axis??"x",n=a?.slideSpacing??"0px",u=a?.direction??"ltr",p=Children.map(o,l=>{if(isValidElement(l)){let m=l;return jsx(w,{options:e.options,sx:r?.slide,children:l},m.key)}return null});return jsx(T,{sx:s,axis:t,ref:i,dir:u,className:c.root,children:jsx(I,{component:"ul",axis:t,slideSpacing:n,className:c.container,sx:{...e.pluginNames?.includes("autoHeight")&&{alignItems:"flex-start",transition:l=>l.transitions.create(["height"],{easing:l.transitions.easing.easeInOut,duration:l.transitions.duration.shorter})},...r?.container},children:p})})}function Co({options:e,slotProps:o,totalSlides:s,selectedIndex:r,onClickPrev:i,onClickNext:a,disablePrev:t,disableNext:n,sx:u,...p}){return jsxs(Y,{direction:"row",alignItems:"center",display:"inline-flex",className:c.arrows,sx:{gap:.5,zIndex:9,color:"action.active",...u},...p,children:[jsx(h,{variant:"prev",options:e,disabled:t,onClick:i,svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:o?.prevBtn?.sx}),jsx(h,{variant:"next",options:e,disabled:n,onClick:a,svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:o?.prevBtn?.sx})]})}function ho({options:e,slotProps:o,totalSlides:s,selectedIndex:r,onClickPrev:i$1,onClickNext:a,disablePrev:t,disableNext:n,sx:u,...p}){let l=useTheme();return jsxs(Y,{direction:"row",alignItems:"center",display:"inline-flex",className:c.arrows,sx:{p:.5,gap:.25,zIndex:9,borderRadius:1.25,color:"common.white",bgcolor:i(l.vars.palette.grey["900Channel"],.48),...u},...p,children:[jsx(h,{variant:"prev",options:e,disabled:t,onClick:i$1,sx:{p:.75,borderRadius:"inherit",...o?.prevBtn?.sx},svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize??16}),jsxs(N,{component:"span",className:c.arrowsLabel,sx:{mx:.5,typography:"subtitle2"},children:[r,"/",s]}),jsx(h,{variant:"next",options:e,disabled:n,onClick:a,sx:{p:.75,borderRadius:"inherit",...o?.nextBtn?.sx},svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize??16})]})}function So({options:e,slotProps:o,onClickPrev:s,onClickNext:r,disablePrev:i,disableNext:a$1}){let t={zIndex:9,top:"50%",borderRadius:1.5,position:"absolute",color:"common.white",bgcolor:"text.primary",transform:"translateY(-50%)","&:hover":{opacity:.8},[a.dark]:{color:"grey.800"}};return jsxs(Fragment,{children:[jsx(h,{variant:"prev",options:e,disabled:i,onClick:s,svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:{left:-16,...t,...o?.prevBtn?.sx}}),jsx(h,{variant:"next",options:e,disabled:a$1,onClick:r,svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.nextBtn?.svgSize,sx:{right:-16,...t,...o?.nextBtn?.sx}})]})}function h({sx:e,svgIcon:o,svgSize:s,options:r,variant:i,...a}){let t=i==="prev",n=i==="next",u=o||jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M15.488 4.43a.75.75 0 0 1 .081 1.058L9.988 12l5.581 6.512a.75.75 0 1 1-1.138.976l-6-7a.75.75 0 0 1 0-.976l6-7a.75.75 0 0 1 1.057-.081",clipRule:"evenodd"}),p=o||jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M8.512 4.43a.75.75 0 0 1 1.057.082l6 7a.75.75 0 0 1 0 .976l-6 7a.75.75 0 0 1-1.138-.976L14.012 12L8.431 5.488a.75.75 0 0 1 .08-1.057",clipRule:"evenodd"});return jsx(J,{className:t?c.arrowPrev:c.arrowPrev,"aria-label":t?"Prev button":"Next button",sx:{p:1,borderRadius:"50%",boxSizing:"content-box",transition:l=>l.transitions.create(["all"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),[`&.${buttonBaseClasses.disabled}`]:{opacity:.4},...e,...r?.direction==="rtl"&&{...t&&{right:-16,left:"auto"},...n&&{left:-16,right:"auto"}}},...a,children:jsx(he,{className:c.arrowSvg,sx:{width:s??20,height:s??20,...r?.axis==="y"&&{transform:" rotate(90deg)"},...r?.direction==="rtl"&&{transform:" scaleX(-1)"}},children:t?u:p})})}function To({sx:e,gap:o,slotProps:s,onClickDot:r,scrollSnaps:i$1,selectedIndex:a$1,fallbackCount:t=1,variant:n="circular",fallback:u=!1,...p}){let l=useTheme(),m={number:o??6,rounded:o??2,circular:o??2},d={circular:s?.dot?.size??18,number:s?.dot?.size??28},S=jsx(N,{sx:{height:d.circular,width:`calc(${t*d.circular+m.circular*(t-1)}px )`,...n==="number"&&{height:d.number,width:`calc(${t*d.number+m.number*(t-1)}px )`}}}),f={circular:y=>({width:d.circular,height:d.circular,"&::before":{width:8,height:8,content:'""',opacity:.24,borderRadius:"50%",bgcolor:"primary.main",transition:l.transitions.create(["opacity"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),...y&&{opacity:1}}}),rounded:y=>({width:d.circular,height:d.circular,"&::before":{width:8,height:8,content:'""',opacity:.24,borderRadius:"50%",bgcolor:"primary.main",transition:l.transitions.create(["width","opacity"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),...y&&{width:"calc(100% - 4px)",opacity:1,borderRadius:1}}}),number:y=>({width:d.number,height:d.number,borderRadius:"50%",typography:"caption",color:"text.disabled",border:`solid 1px ${i(l.vars.palette.grey["500Channel"],.16)}`,...y&&{color:"common.white",bgcolor:"text.primary",fontWeight:"fontWeightSemiBold",[a.dark]:{color:"grey.800"}}})};return jsx(_e,{fallback:u?S:null,children:jsx(N,{component:"ul",className:c.dots,sx:{zIndex:9,display:"inline-flex",...n==="circular"&&{gap:`${m.circular}px`},...n==="rounded"&&{gap:`${m.rounded}px`},...n==="number"&&{gap:`${m.number}px`},...e},...p,children:i$1.map((y,g)=>{let v=g===a$1;return jsx(N,{component:"li",sx:{display:"inline-flex"},children:jsx(J,{disableRipple:!0,"aria-label":`dot-${g}`,className:c.dot.concat(v?` ${c.state.selected}`:""),onClick:()=>r(g),sx:{...n==="circular"&&f.circular(v),...n==="rounded"&&f.rounded(v),...n==="number"&&f.number(v),[`&.${c.state.selected}`]:{...s?.dot?.selected},...s?.dot?.sx},children:n==="number"&&g+1})},g)})})})}var we=styled(N)(({theme:e})=>({height:6,maxWidth:120,width:"100%",borderRadius:6,overflow:"hidden",position:"relative",color:e.vars.palette.text.primary,backgroundColor:i(e.vars.palette.grey["500Channel"],.2)})),Pe=styled(N)(()=>({top:0,bottom:0,width:"100%",left:"-100%",position:"absolute",backgroundColor:"currentColor"}));function Uo({value:e,sx:o,...s}){return jsx(we,{sx:o,className:c.progress,...s,children:jsx(Pe,{className:c.progressBar,sx:{transform:`translate3d(${e}%, 0px, 0px)`}})})}var Ne=forwardRef(({children:e,slotProps:o,options:s,sx:r,...i},a)=>{let t=s?.axis??"x",n=s?.slideSpacing??"12px",u=Oe(t),p=Children.map(e,l=>{if(isValidElement(l)){let m=l;return jsx(w,{options:{...s,slideSpacing:n},sx:o?.slide,children:l},m.key)}return null});return jsx(T,{ref:a,slideSpacing:void 0,axis:t,className:c.thumbs,sx:{flexShrink:0,...t==="x"&&{p:.5,maxWidth:1},...t==="y"&&{p:.5,maxHeight:1},...!o?.disableMask&&u,...r},...i,children:jsx(I,{component:"ul",axis:t,slideSpacing:n,className:c.thumbContainer,sx:{...o?.container},children:p})})});Ne.displayName="CarouselThumbs";function Go({thumbType:e="image",sx:o,src:s,index:r,selected:i,...a}){return e==="image"&&s?jsx(J,{className:c.thumb,sx:{width:64,height:64,opacity:.48,flexShrink:0,cursor:"pointer",borderRadius:1.25,transition:t=>t.transitions.create(["opacity","box-shadow"],{easing:t.transitions.easing.sharp,duration:t.transitions.duration.short}),...i&&{opacity:1,boxShadow:t=>`0 0 0 2px ${t.vars.palette.primary.main}`},...o},...a,children:jsx(N,{component:"img",alt:`carousel-thumb-${r}`,src:s,className:c.thumbImage,sx:{width:1,height:1,objectFit:"cover",borderRadius:"inherit"}})}):e==="video"?jsx(J,{className:c.thumb,sx:{width:64,height:64,opacity:.48,flexShrink:0,cursor:"pointer",borderRadius:1.25,color:t=>t.vars.palette.primary.main,transition:t=>t.transitions.create(["opacity","box-shadow"],{easing:t.transitions.easing.sharp,duration:t.transitions.duration.short}),...i&&{opacity:1,boxShadow:t=>`0 0 0 2px ${t.vars.palette.primary.main}`},...o},...a,children:jsx(a$1,{icon:"PLAY_CIRCLE",width:40})}):null}function Oe(e){let o=useTheme(),s={zIndex:9,content:'""',position:"absolute"},r=`${o.vars.palette.background.paper} 20%, ${i(o.vars.palette.background.paperChannel,0)} 100%)`;return e==="y"?{"&::before, &::after":{...s,left:0,height:40,width:"100%"},"&::before":{top:-8,background:`linear-gradient(to bottom, ${r}`},"&::after":{bottom:-8,background:`linear-gradient(to top, ${r}`}}:{"&::before, &::after":{...s,top:0,width:40,height:"100%"},"&::before":{left:-8,background:`linear-gradient(to right, ${r}`},"&::after":{right:-8,background:`linear-gradient(to left, ${r}`}}}var A=e=>{let[o,s]=useState(!0),[r,i]=useState(!0),a=useCallback(()=>{e&&e.scrollPrev();},[e]),t=useCallback(()=>{e&&e.scrollNext();},[e]),n=useCallback(u=>{s(!u.canScrollPrev()),i(!u.canScrollNext());},[]);return useEffect(()=>{e&&(n(e),e.on("reInit",n),e.on("select",n));},[e,n]),{disablePrev:o,disableNext:r,onClickPrev:a,onClickNext:t}};function oe(e){let[o,s]=useState(!1),r=useCallback(a=>{let t=e?.plugins()?.autoplay;if(!t)return;(t.options.stopOnInteraction===!1?t.reset:t.stop)(),a();},[e]),i=useCallback(()=>{let a=e?.plugins()?.autoplay;if(!a)return;(a.isPlaying()?a.stop:a.play)();},[e]);return useEffect(()=>{let a=e?.plugins()?.autoplay;a&&(s(a.isPlaying()),e.on("autoplay:play",()=>s(!0)).on("autoplay:stop",()=>s(!1)).on("reInit",()=>s(!1)));},[e]),{isPlaying:o,onTogglePlay:i,onClickAutoplay:r}}function re(e){let[o,s]=useState(!1),r=useCallback(a=>{let t=e?.plugins()?.autoScroll;if(!t)return;(t.options.stopOnInteraction===!1?t.reset:t.stop)(),a();},[e]),i=useCallback(()=>{let a=e?.plugins()?.autoScroll;if(!a)return;(a.isPlaying()?a.stop:a.play)();},[e]);return useEffect(()=>{let a=e?.plugins()?.autoScroll;a&&(s(a.isPlaying()),e.on("autoScroll:play",()=>s(!0)).on("autoScroll:stop",()=>s(!1)).on("reInit",()=>s(!1)));},[e]),{isPlaying:o,onTogglePlay:i,onClickAutoplay:r}}function se(e){let[o,s]=useState(0),[r,i]=useState(0),[a,t]=useState([]),n=useCallback(l=>{e&&e.scrollTo(l);},[e]),u=useCallback(l=>{t(l.scrollSnapList());},[]),p=useCallback(l=>{i(l.selectedScrollSnap()),s(l.scrollSnapList().length);},[]);return useEffect(()=>{e&&(u(e),p(e),e.on("reInit",u),e.on("reInit",p),e.on("select",p));},[e,u,p]),{dotCount:o,scrollSnaps:a,selectedIndex:r,onClickDot:n}}function ne(e,o){let s=useRef(0),r=useRef([]),i=typeof o=="number"?o:.24,a=useCallback(u=>{r.current=u.slideNodes().map(p=>p.querySelector(".slide__parallax__layer"));},[]),t=useCallback(u=>{s.current=i*u.scrollSnapList().length;},[i]),n=useCallback((u,p)=>{let l=u.internalEngine(),m=u.scrollProgress(),d=u.slidesInView(),S=p==="scroll";u.scrollSnapList().forEach((f,y)=>{let g=f-m;l.slideRegistry[y].forEach(k=>{if(S&&!d.includes(k))return;l.options.loop&&l.slideLooper.loopPoints.forEach(D=>{let M=D.target();if(k===D.index&&M!==0){let V=Math.sign(M);V===-1&&(g=f-(1+m)),V===1&&(g=f+(1-m));}});let ce=g*(-1*s.current)*100,U=r.current[k];U&&(U.style.transform=`translateX(${ce}%)`);});});},[]);return useEffect(()=>{!e||!o||(a(e),t(e),n(e),e.on("reInit",a).on("reInit",t).on("reInit",n).on("scroll",n));},[e,n]),null}function le(e){let[o,s]=useState(0),r=useCallback(i=>{let a=Math.max(0,Math.min(1,i.scrollProgress()));s(a*100);},[]);return useEffect(()=>{e&&(r(e),e.on("reInit",r),e.on("scroll",r));},[e,r]),{value:o}}function ue(e,o){let[s,r]=Xe({containScroll:"keepSnaps",dragFree:!0,...o}),[i,a]=useState(0),t=useCallback(u=>{!e||!r||e.scrollTo(u);},[e,r]),n=useCallback(()=>{!e||!r||(a(e.selectedScrollSnap()),r.scrollTo(e.selectedScrollSnap()));},[e,r,a]);return useEffect(()=>{e&&(n(),e.on("select",n),e.on("reInit",n));},[e,n]),{onClickThumb:t,thumbsRef:s,thumbsApi:r,selectedIndex:i}}var vt=(e,o)=>{let[s,r]=Xe(e,o),{disablePrev:i,disableNext:a,onClickPrev:t,onClickNext:n}=A(r),u=o?.map(y=>y.name),p=se(r),l=oe(r),m=re(r),d=le(r),S=ue(r,e?.thumbs);ne(r,e?.parallax);let f=useMemo(()=>u?.includes("autoplay")?{onClickPrev:()=>l.onClickAutoplay(t),onClickNext:()=>l.onClickAutoplay(n)}:u?.includes("autoScroll")?{onClickPrev:()=>m.onClickAutoplay(t),onClickNext:()=>m.onClickAutoplay(n)}:{onClickPrev:t,onClickNext:n},[m,l,n,t,u]);return {options:{...e,...r?.internalEngine().options},pluginNames:u,mainRef:s,mainApi:r,arrows:{disablePrev:i,disableNext:a,onClickPrev:f.onClickPrev,onClickNext:f.onClickNext},dots:p,thumbs:S,progress:d,autoplay:l,autoScroll:m}};
+var Ge={xs:"(min-width: 0px)",sm:"(min-width: 600px)",md:"(min-width: 900px)",lg:"(min-width: 1200px)",xl:"(min-width: 1536px)"};var c={root:"mnl__carousel__root",container:"mnl__carousel__container",dots:"mnl__carousel__dots",dot:"mnl__carousel__dot",arrows:"mnl__carousel__arrows",arrowsLabel:"mnl__carousel__arrows_label",arrowPrev:"mnl__carousel__btn--prev",arrowNext:"mnl__carousel__btn--next",arrowSvg:"mnl__carousel__btn__svg",slide:"mnl__carousel__slide",slideContent:"mnl__carousel__slide__content",thumbs:"mnl__carousel__thumbs",thumb:"mnl__carousel__thumb",thumbContainer:"mnl__carousel__thumbs__container",thumbImage:"mnl__carousel__thumb__image",progress:"mnl__carousel__progress",progressBar:"mnl__carousel__progress__bar",state:{selected:"state--selected",disabled:"state--disabled"}};var pe=styled(N,{shouldForwardProp:e=>e!=="axis"&&e!=="slideSpacing"})(({axis:e,slideSpacing:o})=>({display:"block",position:"relative",...e==="x"&&{minWidth:0,paddingLeft:o},...e==="y"&&{minHeight:0,paddingTop:o}})),me=styled(N)(()=>({overflow:"hidden",position:"relative",borderRadius:"inherit"}));function w({sx:e,options:o,children:s,...r}){let i=de(o?.slidesToShow);return jsx(pe,{component:"li",axis:o?.axis??"x",slideSpacing:o?.slideSpacing,className:c.slide,sx:{flex:i,...e},...r,children:o?.parallax?jsx(me,{className:c.slideContent,children:jsx("div",{className:"slide__parallax__layer",children:s})}):s})}function de(e){return e&&typeof e=="object"?Object.keys(e).reduce((o,s)=>{let r=e[s];return o[s]=W(r),o},{}):W(e)}function W(e=1){if(typeof e=="string"){if(!(e==="auto"||e.endsWith("%")||e.endsWith("px")))throw new Error("Only accepts values: auto, px, %, or number.");return `0 0 ${e}`}if(typeof e=="number")return `0 0 ${100/e}%`;throw new Error("Invalid value type. Only accepts values: auto, px, %, or number.")}var T=styled(N,{shouldForwardProp:e=>e!=="axis"})(({axis:e})=>({margin:"auto",width:"100%",maxWidth:"100%",overflow:"hidden",position:"relative",...e==="y"&&{height:"100%"}})),I=styled(N,{shouldForwardProp:e=>e!=="axis"&&e!=="slideSpacing"})(({axis:e,slideSpacing:o})=>({display:"flex",backfaceVisibility:"hidden",...e==="x"&&{touchAction:"pan-y pinch-zoom",marginLeft:`calc(${o} * -1)`},...e==="y"&&{height:"100%",flexDirection:"column",touchAction:"pan-x pinch-zoom",marginTop:`calc(${o} * -1)`}}));function io({carousel:e,children:o,sx:s,slotProps:r}){let{mainRef:i,options:a}=e,t=a?.axis??"x",n=a?.slideSpacing??"0px",u=a?.direction??"ltr",p=Children.map(o,l=>{if(isValidElement(l)){let m=l;return jsx(w,{options:e.options,sx:r?.slide,children:l},m.key)}return null});return jsx(T,{sx:s,axis:t,ref:i,dir:u,className:c.root,children:jsx(I,{component:"ul",axis:t,slideSpacing:n,className:c.container,sx:{...e.pluginNames?.includes("autoHeight")&&{alignItems:"flex-start",transition:l=>l.transitions.create(["height"],{easing:l.transitions.easing.easeInOut,duration:l.transitions.duration.shorter})},...r?.container},children:p})})}function Co({options:e,slotProps:o,totalSlides:s,selectedIndex:r,onClickPrev:i,onClickNext:a,disablePrev:t,disableNext:n,sx:u,...p}){return jsxs(Y,{direction:"row",alignItems:"center",display:"inline-flex",className:c.arrows,sx:{gap:.5,zIndex:9,color:"action.active",...u},...p,children:[jsx(h,{variant:"prev",options:e,disabled:t,onClick:i,svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:o?.prevBtn?.sx}),jsx(h,{variant:"next",options:e,disabled:n,onClick:a,svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:o?.prevBtn?.sx})]})}function ho({options:e,slotProps:o,totalSlides:s,selectedIndex:r,onClickPrev:i$1,onClickNext:a,disablePrev:t,disableNext:n,sx:u,...p}){let l=useTheme();return jsxs(Y,{direction:"row",alignItems:"center",display:"inline-flex",className:c.arrows,sx:{p:.5,gap:.25,zIndex:9,borderRadius:1.25,color:"common.white",bgcolor:i(l.vars.palette.grey["900Channel"],.48),...u},...p,children:[jsx(h,{variant:"prev",options:e,disabled:t,onClick:i$1,sx:{p:.75,borderRadius:"inherit",...o?.prevBtn?.sx},svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize??16}),jsxs(N,{component:"span",className:c.arrowsLabel,sx:{mx:.5,typography:"subtitle2"},children:[r,"/",s]}),jsx(h,{variant:"next",options:e,disabled:n,onClick:a,sx:{p:.75,borderRadius:"inherit",...o?.nextBtn?.sx},svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize??16})]})}function So({options:e,slotProps:o,onClickPrev:s,onClickNext:r,disablePrev:i,disableNext:a$1}){let t={zIndex:9,top:"50%",borderRadius:1.5,position:"absolute",color:"common.white",bgcolor:"text.primary",transform:"translateY(-50%)","&:hover":{opacity:.8},[a.dark]:{color:"grey.800"}};return jsxs(Fragment,{children:[jsx(h,{variant:"prev",options:e,disabled:i,onClick:s,svgIcon:o?.prevBtn?.svgIcon,svgSize:o?.prevBtn?.svgSize,sx:{left:-16,...t,...o?.prevBtn?.sx}}),jsx(h,{variant:"next",options:e,disabled:a$1,onClick:r,svgIcon:o?.nextBtn?.svgIcon,svgSize:o?.nextBtn?.svgSize,sx:{right:-16,...t,...o?.nextBtn?.sx}})]})}function h({sx:e,svgIcon:o,svgSize:s,options:r,variant:i,...a}){let t=i==="prev",n=i==="next",u=o||jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M15.488 4.43a.75.75 0 0 1 .081 1.058L9.988 12l5.581 6.512a.75.75 0 1 1-1.138.976l-6-7a.75.75 0 0 1 0-.976l6-7a.75.75 0 0 1 1.057-.081",clipRule:"evenodd"}),p=o||jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M8.512 4.43a.75.75 0 0 1 1.057.082l6 7a.75.75 0 0 1 0 .976l-6 7a.75.75 0 0 1-1.138-.976L14.012 12L8.431 5.488a.75.75 0 0 1 .08-1.057",clipRule:"evenodd"});return jsx(J,{className:t?c.arrowPrev:c.arrowPrev,"aria-label":t?"Prev button":"Next button",sx:{p:1,borderRadius:"50%",boxSizing:"content-box",transition:l=>l.transitions.create(["all"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),[`&.${buttonBaseClasses.disabled}`]:{opacity:.4},...e,...r?.direction==="rtl"&&{...t&&{right:-16,left:"auto"},...n&&{left:-16,right:"auto"}}},...a,children:jsx(he,{className:c.arrowSvg,sx:{width:s??20,height:s??20,...r?.axis==="y"&&{transform:" rotate(90deg)"},...r?.direction==="rtl"&&{transform:" scaleX(-1)"}},children:t?u:p})})}function To({sx:e,gap:o,slotProps:s,onClickDot:r,scrollSnaps:i$1,selectedIndex:a$1,fallbackCount:t=1,variant:n="circular",fallback:u=!1,...p}){let l=useTheme(),m={number:o??6,rounded:o??2,circular:o??2},d={circular:s?.dot?.size??18,number:s?.dot?.size??28},S=jsx(N,{sx:{height:d.circular,width:`calc(${t*d.circular+m.circular*(t-1)}px )`,...n==="number"&&{height:d.number,width:`calc(${t*d.number+m.number*(t-1)}px )`}}}),f={circular:y=>({width:d.circular,height:d.circular,"&::before":{width:8,height:8,content:'""',opacity:.24,borderRadius:"50%",bgcolor:"primary.main",transition:l.transitions.create(["opacity"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),...y&&{opacity:1}}}),rounded:y=>({width:d.circular,height:d.circular,"&::before":{width:8,height:8,content:'""',opacity:.24,borderRadius:"50%",bgcolor:"primary.main",transition:l.transitions.create(["width","opacity"],{easing:l.transitions.easing.sharp,duration:l.transitions.duration.short}),...y&&{width:"calc(100% - 4px)",opacity:1,borderRadius:1}}}),number:y=>({width:d.number,height:d.number,borderRadius:"50%",typography:"caption",color:"text.disabled",border:`solid 1px ${i(l.vars.palette.grey["500Channel"],.16)}`,...y&&{color:"common.white",bgcolor:"text.primary",fontWeight:"fontWeightSemiBold",[a.dark]:{color:"grey.800"}}})};return jsx(_e,{fallback:u?S:null,children:jsx(N,{component:"ul",className:c.dots,sx:{zIndex:9,display:"inline-flex",...n==="circular"&&{gap:`${m.circular}px`},...n==="rounded"&&{gap:`${m.rounded}px`},...n==="number"&&{gap:`${m.number}px`},...e},...p,children:i$1.map((y,g)=>{let v=g===a$1;return jsx(N,{component:"li",sx:{display:"inline-flex"},children:jsx(J,{disableRipple:!0,"aria-label":`dot-${g}`,className:c.dot.concat(v?` ${c.state.selected}`:""),onClick:()=>r(g),sx:{...n==="circular"&&f.circular(v),...n==="rounded"&&f.rounded(v),...n==="number"&&f.number(v),[`&.${c.state.selected}`]:{...s?.dot?.selected},...s?.dot?.sx},children:n==="number"&&g+1})},g)})})})}var we=styled(N)(({theme:e})=>({height:6,maxWidth:120,width:"100%",borderRadius:6,overflow:"hidden",position:"relative",color:e.vars.palette.text.primary,backgroundColor:i(e.vars.palette.grey["500Channel"],.2)})),Pe=styled(N)(()=>({top:0,bottom:0,width:"100%",left:"-100%",position:"absolute",backgroundColor:"currentColor"}));function Uo({value:e,sx:o,...s}){return jsx(we,{sx:o,className:c.progress,...s,children:jsx(Pe,{className:c.progressBar,sx:{transform:`translate3d(${e}%, 0px, 0px)`}})})}var Ne=forwardRef(({children:e,slotProps:o,options:s,sx:r,...i},a)=>{let t=s?.axis??"x",n=s?.slideSpacing??"12px",u=Oe(t),p=Children.map(e,l=>{if(isValidElement(l)){let m=l;return jsx(w,{options:{...s,slideSpacing:n},sx:o?.slide,children:l},m.key)}return null});return jsx(T,{ref:a,slideSpacing:void 0,axis:t,className:c.thumbs,sx:{flexShrink:0,...t==="x"&&{p:.5,maxWidth:1},...t==="y"&&{p:.5,maxHeight:1},...!o?.disableMask&&u,...r},...i,children:jsx(I,{component:"ul",axis:t,slideSpacing:n,className:c.thumbContainer,sx:{...o?.container},children:p})})});Ne.displayName="CarouselThumbs";function Go({thumbType:e="image",sx:o,src:s,index:r,selected:i,...a}){return e==="image"&&s?jsx(J,{className:c.thumb,sx:{width:64,height:64,opacity:.48,flexShrink:0,cursor:"pointer",borderRadius:1.25,transition:t=>t.transitions.create(["opacity","box-shadow"],{easing:t.transitions.easing.sharp,duration:t.transitions.duration.short}),...i&&{opacity:1,boxShadow:t=>`0 0 0 2px ${t.vars.palette.primary.main}`},...o},...a,children:jsx(N,{component:"img",alt:`carousel-thumb-${r}`,src:s,className:c.thumbImage,sx:{width:1,height:1,objectFit:"cover",borderRadius:"inherit"}})}):e==="video"?jsx(J,{className:c.thumb,sx:{width:64,height:64,opacity:.48,flexShrink:0,cursor:"pointer",borderRadius:1.25,color:t=>t.vars.palette.primary.main,transition:t=>t.transitions.create(["opacity","box-shadow"],{easing:t.transitions.easing.sharp,duration:t.transitions.duration.short}),...i&&{opacity:1,boxShadow:t=>`0 0 0 2px ${t.vars.palette.primary.main}`},...o},...a,children:jsx(a$1,{icon:"PLAY_CIRCLE",width:32})}):null}function Oe(e){let o=useTheme(),s={zIndex:9,content:'""',position:"absolute"},r=`${o.vars.palette.background.paper} 20%, ${i(o.vars.palette.background.paperChannel,0)} 100%)`;return e==="y"?{"&::before, &::after":{...s,left:0,height:40,width:"100%"},"&::before":{top:-8,background:`linear-gradient(to bottom, ${r}`},"&::after":{bottom:-8,background:`linear-gradient(to top, ${r}`}}:{"&::before, &::after":{...s,top:0,width:40,height:"100%"},"&::before":{left:-8,background:`linear-gradient(to right, ${r}`},"&::after":{right:-8,background:`linear-gradient(to left, ${r}`}}}var A=e=>{let[o,s]=useState(!0),[r,i]=useState(!0),a=useCallback(()=>{e&&e.scrollPrev();},[e]),t=useCallback(()=>{e&&e.scrollNext();},[e]),n=useCallback(u=>{s(!u.canScrollPrev()),i(!u.canScrollNext());},[]);return useEffect(()=>{e&&(n(e),e.on("reInit",n),e.on("select",n));},[e,n]),{disablePrev:o,disableNext:r,onClickPrev:a,onClickNext:t}};function oe(e){let[o,s]=useState(!1),r=useCallback(a=>{let t=e?.plugins()?.autoplay;if(!t)return;(t.options.stopOnInteraction===!1?t.reset:t.stop)(),a();},[e]),i=useCallback(()=>{let a=e?.plugins()?.autoplay;if(!a)return;(a.isPlaying()?a.stop:a.play)();},[e]);return useEffect(()=>{let a=e?.plugins()?.autoplay;a&&(s(a.isPlaying()),e.on("autoplay:play",()=>s(!0)).on("autoplay:stop",()=>s(!1)).on("reInit",()=>s(!1)));},[e]),{isPlaying:o,onTogglePlay:i,onClickAutoplay:r}}function re(e){let[o,s]=useState(!1),r=useCallback(a=>{let t=e?.plugins()?.autoScroll;if(!t)return;(t.options.stopOnInteraction===!1?t.reset:t.stop)(),a();},[e]),i=useCallback(()=>{let a=e?.plugins()?.autoScroll;if(!a)return;(a.isPlaying()?a.stop:a.play)();},[e]);return useEffect(()=>{let a=e?.plugins()?.autoScroll;a&&(s(a.isPlaying()),e.on("autoScroll:play",()=>s(!0)).on("autoScroll:stop",()=>s(!1)).on("reInit",()=>s(!1)));},[e]),{isPlaying:o,onTogglePlay:i,onClickAutoplay:r}}function se(e){let[o,s]=useState(0),[r,i]=useState(0),[a,t]=useState([]),n=useCallback(l=>{e&&e.scrollTo(l);},[e]),u=useCallback(l=>{t(l.scrollSnapList());},[]),p=useCallback(l=>{i(l.selectedScrollSnap()),s(l.scrollSnapList().length);},[]);return useEffect(()=>{e&&(u(e),p(e),e.on("reInit",u),e.on("reInit",p),e.on("select",p));},[e,u,p]),{dotCount:o,scrollSnaps:a,selectedIndex:r,onClickDot:n}}function ne(e,o){let s=useRef(0),r=useRef([]),i=typeof o=="number"?o:.24,a=useCallback(u=>{r.current=u.slideNodes().map(p=>p.querySelector(".slide__parallax__layer"));},[]),t=useCallback(u=>{s.current=i*u.scrollSnapList().length;},[i]),n=useCallback((u,p)=>{let l=u.internalEngine(),m=u.scrollProgress(),d=u.slidesInView(),S=p==="scroll";u.scrollSnapList().forEach((f,y)=>{let g=f-m;l.slideRegistry[y].forEach(k=>{if(S&&!d.includes(k))return;l.options.loop&&l.slideLooper.loopPoints.forEach(D=>{let M=D.target();if(k===D.index&&M!==0){let V=Math.sign(M);V===-1&&(g=f-(1+m)),V===1&&(g=f+(1-m));}});let ce=g*(-1*s.current)*100,U=r.current[k];U&&(U.style.transform=`translateX(${ce}%)`);});});},[]);return useEffect(()=>{!e||!o||(a(e),t(e),n(e),e.on("reInit",a).on("reInit",t).on("reInit",n).on("scroll",n));},[e,n]),null}function le(e){let[o,s]=useState(0),r=useCallback(i=>{let a=Math.max(0,Math.min(1,i.scrollProgress()));s(a*100);},[]);return useEffect(()=>{e&&(r(e),e.on("reInit",r),e.on("scroll",r));},[e,r]),{value:o}}function ue(e,o){let[s,r]=Xe({containScroll:"keepSnaps",dragFree:!0,...o}),[i,a]=useState(0),t=useCallback(u=>{!e||!r||e.scrollTo(u);},[e,r]),n=useCallback(()=>{!e||!r||(a(e.selectedScrollSnap()),r.scrollTo(e.selectedScrollSnap()));},[e,r,a]);return useEffect(()=>{e&&(n(),e.on("select",n),e.on("reInit",n));},[e,n]),{onClickThumb:t,thumbsRef:s,thumbsApi:r,selectedIndex:i}}var vt=(e,o)=>{let[s,r]=Xe(e,o),{disablePrev:i,disableNext:a,onClickPrev:t,onClickNext:n}=A(r),u=o?.map(y=>y.name),p=se(r),l=oe(r),m=re(r),d=le(r),S=ue(r,e?.thumbs);ne(r,e?.parallax);let f=useMemo(()=>u?.includes("autoplay")?{onClickPrev:()=>l.onClickAutoplay(t),onClickNext:()=>l.onClickAutoplay(n)}:u?.includes("autoScroll")?{onClickPrev:()=>m.onClickAutoplay(t),onClickNext:()=>m.onClickAutoplay(n)}:{onClickPrev:t,onClickNext:n},[m,l,n,t,u]);return {options:{...e,...r?.internalEngine().options},pluginNames:u,mainRef:s,mainApi:r,arrows:{disablePrev:i,disableNext:a,onClickPrev:f.onClickPrev,onClickNext:f.onClickNext},dots:p,thumbs:S,progress:d,autoplay:l,autoScroll:m}};
 
 export { h as ArrowButton, io as Carousel, Co as CarouselArrowBasicButtons, So as CarouselArrowFloatButtons, ho as CarouselArrowNumberButtons, To as CarouselDotButtons, Uo as CarouselProgressBar, w as CarouselSlide, Go as CarouselThumb, Ne as CarouselThumbs, I as StyledContainer, T as StyledRoot, Ge as carouselBreakpoints, c as carouselClasses, vt as useCarousel };

package/dist/components/lightbox/index.d.ts

@@ -20,7 +20,7 @@ type UseLightBoxReturn = {
     setSelected: React.Dispatch<React.SetStateAction<number>>;
 };
 
-declare function Lightbox({ slides, disableZoom, disableVideo, disableTotal, disableCaptions, disableSlideshow, disableThumbnails, disableFullscreen, onGetCurrentIndex, ...other }: LightBoxProps): react_jsx_runtime.JSX.Element;
+declare function Lightbox({ slides, disableZoom, disableVideo, disableTotal, disableCaptions, disableSlideshow, disableThumbnails, disableFullscreen, onGetCurrentIndex, render, ...other }: LightBoxProps): react_jsx_runtime.JSX.Element;
 declare function getPlugins({ disableZoom, disableVideo, disableCaptions, disableSlideshow, disableThumbnails, disableFullscreen, }: Partial<LightBoxProps>): (typeof Captions)[];
 type DisplayTotalProps = {
     totalItems: number;

package/dist/components/lightbox/index.js

@@ -1,7 +1,7 @@
 import { a } from '../../chunk-C7G4JHJP.js';
 import '../../chunk-6HPAQ46I.js';
-import _ from '@mui/material/Box';
-import w, { useLightboxState } from 'yet-another-react-lightbox';
+import w from '@mui/material/Box';
+import C, { useLightboxState } from 'yet-another-react-lightbox';
 import d from 'yet-another-react-lightbox/plugins/captions';
 import h from 'yet-another-react-lightbox/plugins/fullscreen';
 import u from 'yet-another-react-lightbox/plugins/slideshow';
@@ -11,6 +11,6 @@ import y from 'yet-another-react-lightbox/plugins/zoom';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
 
-var f={root:"mnl__lightbox__root"};function v({slides:i,disableZoom:l,disableVideo:r,disableTotal:p,disableCaptions:c,disableSlideshow:s,disableThumbnails:o,disableFullscreen:t,onGetCurrentIndex:a$1,...E}){let m=i?i.length:0;return jsx(w,{slides:i,animation:{swipe:240},carousel:{finite:m<5},controller:{closeOnBackdropClick:!0},plugins:O({disableZoom:l,disableVideo:r,disableCaptions:c,disableSlideshow:s,disableThumbnails:o,disableFullscreen:t}),on:{view:({index:S})=>{a$1&&a$1(S);}},toolbar:{buttons:[jsx(L,{totalItems:m,disableTotal:p},0),"close"]},render:{iconClose:()=>jsx(a,{width:24,icon:"CLOSE_MARK_BUTTON"}),iconZoomIn:()=>jsx(a,{width:24,icon:"ZOOM_IN"}),iconZoomOut:()=>jsx(a,{width:24,icon:"ZOOM_OUT"}),iconSlideshowPlay:()=>jsx(a,{width:24,icon:"PLAY_EXECUTE"}),iconSlideshowPause:()=>jsx(a,{width:24,icon:"PAUSE"}),iconPrev:()=>jsx(a,{width:32,icon:"CHEVRON_LEFT"}),iconNext:()=>jsx(a,{width:32,icon:"CHEVRON_RIGHT"}),iconExitFullscreen:()=>jsx(a,{width:24,icon:"MINIMIZE_SCREEN"}),iconEnterFullscreen:()=>jsx(a,{width:24,icon:"MAXIMIZE_SCREEN"})},className:f.root,...E})}function O({disableZoom:i,disableVideo:l,disableCaptions:r,disableSlideshow:p,disableThumbnails:c,disableFullscreen:s}){let o=[d,h,u,x,g,y];return c&&(o=o.filter(t=>t!==x)),r&&(o=o.filter(t=>t!==d)),s&&(o=o.filter(t=>t!==h)),p&&(o=o.filter(t=>t!==u)),i&&(o=o.filter(t=>t!==y)),l&&(o=o.filter(t=>t!==g)),o}function L({totalItems:i,disableTotal:l}){let{currentIndex:r}=useLightboxState();return l?null:jsxs(_,{component:"span",className:"yarl__button",sx:{typography:"body2",alignItems:"center",display:"inline-flex",justifyContent:"center"},children:[jsxs("strong",{children:[" ",r+1," "]})," / ",i]})}function K(i){let[l,r]=useState(-1),p=useCallback(s=>{let o=i.findIndex(t=>t.type==="video"?t.poster===s:t.src===s);r(o);},[i]),c=useCallback(()=>{r(-1);},[]);return {selected:l,open:l>=0,onOpen:p,onClose:c,setSelected:r}}
+var f={root:"mnl__lightbox__root"};function D({slides:i,disableZoom:l,disableVideo:r,disableTotal:p,disableCaptions:c,disableSlideshow:s,disableThumbnails:o,disableFullscreen:t,onGetCurrentIndex:a$1,render:E,...S}){let m=i?i.length:0;return jsx(C,{slides:i,animation:{swipe:240},carousel:{finite:m<5},controller:{closeOnBackdropClick:!0},plugins:L({disableZoom:l,disableVideo:r,disableCaptions:c,disableSlideshow:s,disableThumbnails:o,disableFullscreen:t}),on:{view:({index:_})=>{a$1&&a$1(_);}},toolbar:{buttons:[jsx(P,{totalItems:m,disableTotal:p},0),"close"]},render:{iconClose:()=>jsx(a,{width:24,icon:"CLOSE_MARK_BUTTON"}),iconZoomIn:()=>jsx(a,{width:24,icon:"ZOOM_IN"}),iconZoomOut:()=>jsx(a,{width:24,icon:"ZOOM_OUT"}),iconSlideshowPlay:()=>jsx(a,{width:24,icon:"PLAY_EXECUTE"}),iconSlideshowPause:()=>jsx(a,{width:24,icon:"PAUSE"}),iconPrev:()=>jsx(a,{width:32,icon:"CHEVRON_LEFT"}),iconNext:()=>jsx(a,{width:32,icon:"CHEVRON_RIGHT"}),iconExitFullscreen:()=>jsx(a,{width:24,icon:"MINIMIZE_SCREEN"}),iconEnterFullscreen:()=>jsx(a,{width:24,icon:"MAXIMIZE_SCREEN"}),...E},className:f.root,...S})}function L({disableZoom:i,disableVideo:l,disableCaptions:r,disableSlideshow:p,disableThumbnails:c,disableFullscreen:s}){let o=[d,h,u,x,g,y];return c&&(o=o.filter(t=>t!==x)),r&&(o=o.filter(t=>t!==d)),s&&(o=o.filter(t=>t!==h)),p&&(o=o.filter(t=>t!==u)),i&&(o=o.filter(t=>t!==y)),l&&(o=o.filter(t=>t!==g)),o}function P({totalItems:i,disableTotal:l}){let{currentIndex:r}=useLightboxState();return l?null:jsxs(w,{component:"span",className:"yarl__button",sx:{typography:"body2",alignItems:"center",display:"inline-flex",justifyContent:"center"},children:[jsxs("strong",{children:[" ",r+1," "]})," / ",i]})}function Y(i){let[l,r]=useState(-1),p=useCallback(s=>{let o=i.findIndex(t=>t.type==="video"?t.poster===s:t.src===s);r(o);},[i]),c=useCallback(()=>{r(-1);},[]);return {selected:l,open:l>=0,onOpen:p,onClose:c,setSelected:r}}
 
-export { L as DisplayTotal, v as Lightbox, O as getPlugins, K as useLightBox };
+export { P as DisplayTotal, D as Lightbox, L as getPlugins, Y as useLightBox };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zydon/common",
-  "version": "2.1.39",
+  "version": "2.1.41",
   "license": "MIT",
   "type": "module",
   "module": "./dist/index.js",