yet-another-react-lightbox 3.12.0 → 3.12.2

package/dist/index.d.ts

@@ -194,7 +194,7 @@ type ImageSlideProps = Partial<Pick<CarouselSettings, "imageFit" | "imageProps">
 };
 declare function ImageSlide({ slide: image, offset, render, rect, imageFit, imageProps, onClick, onLoad, style, }: ImageSlideProps): React.JSX.Element;
 
-declare function Carousel({ carousel: { finite, preload, padding, spacing } }: ComponentProps): React.JSX.Element;
+declare function Carousel({ carousel }: ComponentProps): React.JSX.Element;
 declare const CarouselModule: Module;
 
 declare enum SwipeState {

package/dist/index.js

@@ -606,8 +606,8 @@ function ImageSlide({ slide: image, offset, render, rect, imageFit, imageProps,
     }, []);
     const cover = isImageFitCover(image, imageFit);
     const nonInfinite = (value, fallback) => (Number.isFinite(value) ? value : fallback);
-    const maxWidth = nonInfinite(Math.max(...((_b = (_a = image.srcSet) === null || _a === void 0 ? void 0 : _a.map((x) => x.width)) !== null && _b !== void 0 ? _b : []).concat(image.width ? [image.width] : [])), ((_c = imageRef.current) === null || _c === void 0 ? void 0 : _c.naturalWidth) || 0);
-    const maxHeight = nonInfinite(Math.max(...((_e = (_d = image.srcSet) === null || _d === void 0 ? void 0 : _d.map((x) => x.height)) !== null && _e !== void 0 ? _e : []).concat(image.height ? [image.height] : [])), ((_f = imageRef.current) === null || _f === void 0 ? void 0 : _f.naturalHeight) || 0);
+    const maxWidth = nonInfinite(Math.max(...((_b = (_a = image.srcSet) === null || _a === void 0 ? void 0 : _a.map((x) => x.width)) !== null && _b !== void 0 ? _b : []).concat(image.width ? [image.width] : []).filter(Boolean)), ((_c = imageRef.current) === null || _c === void 0 ? void 0 : _c.naturalWidth) || 0);
+    const maxHeight = nonInfinite(Math.max(...((_e = (_d = image.srcSet) === null || _d === void 0 ? void 0 : _d.map((x) => x.height)) !== null && _e !== void 0 ? _e : []).concat(image.height ? [image.height] : []).filter(Boolean)), ((_f = imageRef.current) === null || _f === void 0 ? void 0 : _f.naturalHeight) || 0);
     const defaultStyle = maxWidth && maxHeight
         ? {
             maxWidth: `min(${maxWidth}px, 100%)`,
@@ -1174,21 +1174,22 @@ function Placeholder() {
     const style = useLightboxProps().styles.slide;
     return React.createElement("div", { className: cssClass("slide"), style: style });
 }
-function Carousel({ carousel: { finite, preload, padding, spacing } }) {
+function Carousel({ carousel }) {
     const { slides, currentIndex, globalIndex } = useLightboxState();
     const { setCarouselRef } = useController();
-    const spacingValue = parseLengthPercentage(spacing);
-    const paddingValue = parseLengthPercentage(padding);
+    const spacingValue = parseLengthPercentage(carousel.spacing);
+    const paddingValue = parseLengthPercentage(carousel.padding);
     const items = [];
-    if ((slides === null || slides === void 0 ? void 0 : slides.length) > 0) {
+    const preload = Math.min(carousel.preload, Math.max(Math.floor(slides.length / 2), 1));
+    if (hasSlides(slides)) {
         for (let i = currentIndex - preload; i < currentIndex; i += 1) {
             const key = globalIndex + i - currentIndex;
-            items.push(!finite || i >= 0 ? (React.createElement(CarouselSlide, { key: key, slide: slides[(i + preload * slides.length) % slides.length], offset: i - currentIndex })) : (React.createElement(Placeholder, { key: key })));
+            items.push(!carousel.finite || i >= 0 ? (React.createElement(CarouselSlide, { key: key, slide: slides[(i + preload * slides.length) % slides.length], offset: i - currentIndex })) : (React.createElement(Placeholder, { key: key })));
         }
         items.push(React.createElement(CarouselSlide, { key: globalIndex, slide: slides[currentIndex], offset: 0 }));
         for (let i = currentIndex + 1; i <= currentIndex + preload; i += 1) {
             const key = globalIndex + i - currentIndex;
-            items.push(!finite || i <= slides.length - 1 ? (React.createElement(CarouselSlide, { key: key, slide: slides[i % slides.length], offset: i - currentIndex })) : (React.createElement(Placeholder, { key: key })));
+            items.push(!carousel.finite || i <= slides.length - 1 ? (React.createElement(CarouselSlide, { key: key, slide: slides[i % slides.length], offset: i - currentIndex })) : (React.createElement(Placeholder, { key: key })));
         }
     }
     return (React.createElement("div", { ref: setCarouselRef, className: clsx(cssClass(cssPrefix$2()), items.length > 0 && cssClass(cssPrefix$2("with_slides"))), style: {

package/dist/plugins/thumbnails/index.js

@@ -121,7 +121,7 @@ function ThumbnailsTrack({ visible, containerRef }) {
     });
     React.useEffect(() => cleanup(subscribe(ACTION_SWIPE, handleControllerSwipe)), [subscribe, handleControllerSwipe]);
     const { finite } = carousel;
-    const preload = Math.max(Math.min(carousel.preload, slides.length - 1), 0);
+    const preload = Math.min(carousel.preload, Math.floor(slides.length / 2));
     const items = [];
     if (hasSlides(slides)) {
         if (offset < 0) {
@@ -129,7 +129,7 @@ function ThumbnailsTrack({ visible, containerRef }) {
                 items.push({ slide: null, index: i, placeholder: true });
             }
         }
-        for (let i = index - preload - (offset > 0 ? offset : 0); i < index; i += 1) {
+        for (let i = index - preload - Math.max(offset, 0); i < index; i += 1) {
             if (!(finite && i < 0)) {
                 items.push({ slide: getSlide(slides, i), index: i });
             }
@@ -138,7 +138,7 @@ function ThumbnailsTrack({ visible, containerRef }) {
             }
         }
         items.push({ slide: getSlide(slides, index), index });
-        for (let i = index + 1; i <= index + preload - (offset < 0 ? offset : 0); i += 1) {
+        for (let i = index + 1; i <= index + preload - Math.min(offset, 0); i += 1) {
             if (!finite || i <= slides.length - 1) {
                 items.push({ slide: getSlide(slides, i), index: i });
             }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "yet-another-react-lightbox",
-    "version": "3.12.0",
+    "version": "3.12.2",
     "description": "Modern React lightbox component",
     "author": "Igor Danchenko",
     "license": "MIT",