yet-another-react-lightbox 3.15.5 → 3.15.6

package/dist/index.d.ts

@@ -19,6 +19,7 @@ declare const hasWindow: () => boolean;
 declare function round(value: number, decimals?: number): number;
 declare const isImageSlide: (slide: Slide) => slide is SlideImage;
 declare const isImageFitCover: (image: SlideImage, imageFit?: LightboxProps["carousel"]["imageFit"]) => boolean;
+declare function parseInt(value: string | number): number;
 declare function parseLengthPercentage(input: LengthOrPercentage): {
     pixel: number;
     percent?: undefined;
@@ -260,4 +261,4 @@ declare const RootModule: Module;
 declare function Toolbar({ toolbar: { buttons }, render: { buttonClose, iconClose }, styles }: ComponentProps): React.JSX.Element;
 declare const ToolbarModule: Module;
 
-export { Augmentation, Callback, Carousel, CarouselModule, CarouselSettings, CloseIcon, Component, ComponentProps, type ComputeAnimation, ContainerRect, Controller, ControllerContext, type ControllerContextType, ControllerModule, ControllerRef, ErrorIcon, type Event, type EventCallback, EventTypes, EventsContext, type EventsContextType, EventsProvider, IconButton, type IconButtonProps, ImageSlide, type ImageSlideProps, type KeyboardEventType, Labels, LengthOrPercentage, Lightbox, LightboxDefaultProps, LightboxDispatchContext, type LightboxDispatchContextType, LightboxExternalProps, LightboxProps, LightboxPropsContext, type LightboxPropsContextType, LightboxPropsProvider, LightboxState, type LightboxStateAction, LightboxStateContext, type LightboxStateContextType, LightboxStateProvider, type LightboxStateProviderProps, LightboxStateSwipeAction, LightboxStateUpdateAction, LoadingIcon, Module, Navigation, NavigationButton, type NavigationButtonProps, NavigationModule, NextIcon, NoScroll, NoScrollModule, Node, Plugin, type PointerEventType, Portal, PortalModule, PreviousIcon, type Publish, type ReactEventType, type RegisterSensors, Render, RenderFunction, Root, RootModule, type SensorCallback, Slide, SlideImage, type Subscribe, type SubscribeSensors, type SupportedEventType, SwipeState, TimeoutsContext, type TimeoutsContextType, TimeoutsProvider, Toolbar, ToolbarModule, ToolbarSettings, type Topic, type Unsubscribe, type UseSensors, type WheelEventType, addToolbarButton, calculatePreload, cleanup, clsx, composePrefix, computeSlideRect, createIcon, createIconDisabled, createModule, createNode, cssClass, cssVar, Lightbox as default, devicePixelRatio, getSlide, getSlideIfPresent, getSlideIndex, hasSlides, hasWindow, isImageFitCover, isImageSlide, label, makeComposePrefix, makeUseContext, parseLengthPercentage, round, setRef, stopNavigationEventsPropagation, useAnimation, useContainerRect, useController, useDelay, useEventCallback, useEvents, useForkRef, useKeyboardNavigation, useLayoutEffect, useLightboxDispatch, useLightboxProps, useLightboxState, useLoseFocus, useMotionPreference, useNavigationState, usePointerSwipe, usePreventSwipeNavigation, useRTL, useSensors, useThrottle, useTimeouts, useWheelSwipe, withPlugins };
+export { Augmentation, Callback, Carousel, CarouselModule, CarouselSettings, CloseIcon, Component, ComponentProps, type ComputeAnimation, ContainerRect, Controller, ControllerContext, type ControllerContextType, ControllerModule, ControllerRef, ErrorIcon, type Event, type EventCallback, EventTypes, EventsContext, type EventsContextType, EventsProvider, IconButton, type IconButtonProps, ImageSlide, type ImageSlideProps, type KeyboardEventType, Labels, LengthOrPercentage, Lightbox, LightboxDefaultProps, LightboxDispatchContext, type LightboxDispatchContextType, LightboxExternalProps, LightboxProps, LightboxPropsContext, type LightboxPropsContextType, LightboxPropsProvider, LightboxState, type LightboxStateAction, LightboxStateContext, type LightboxStateContextType, LightboxStateProvider, type LightboxStateProviderProps, LightboxStateSwipeAction, LightboxStateUpdateAction, LoadingIcon, Module, Navigation, NavigationButton, type NavigationButtonProps, NavigationModule, NextIcon, NoScroll, NoScrollModule, Node, Plugin, type PointerEventType, Portal, PortalModule, PreviousIcon, type Publish, type ReactEventType, type RegisterSensors, Render, RenderFunction, Root, RootModule, type SensorCallback, Slide, SlideImage, type Subscribe, type SubscribeSensors, type SupportedEventType, SwipeState, TimeoutsContext, type TimeoutsContextType, TimeoutsProvider, Toolbar, ToolbarModule, ToolbarSettings, type Topic, type Unsubscribe, type UseSensors, type WheelEventType, addToolbarButton, calculatePreload, cleanup, clsx, composePrefix, computeSlideRect, createIcon, createIconDisabled, createModule, createNode, cssClass, cssVar, Lightbox as default, devicePixelRatio, getSlide, getSlideIfPresent, getSlideIndex, hasSlides, hasWindow, isImageFitCover, isImageSlide, label, makeComposePrefix, makeUseContext, parseInt, parseLengthPercentage, round, setRef, stopNavigationEventsPropagation, useAnimation, useContainerRect, useController, useDelay, useEventCallback, useEvents, useForkRef, useKeyboardNavigation, useLayoutEffect, useLightboxDispatch, useLightboxProps, useLightboxState, useLoseFocus, useMotionPreference, useNavigationState, usePointerSwipe, usePreventSwipeNavigation, useRTL, useSensors, useThrottle, useTimeouts, useWheelSwipe, withPlugins };

package/dist/index.js

@@ -1,9 +1,84 @@
 'use client';
 import * as React from 'react';
-import { ACTION_CLOSE, IMAGE_FIT_CONTAIN, MODULE_CONTROLLER, IMAGE_FIT_COVER, UNKNOWN_ACTION_TYPE, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_CANCEL, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_WHEEL, SLIDE_STATUS_LOADING, activeSlideStatus, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_PLACEHOLDER, ACTION_PREV, ACTION_NEXT, ACTION_SWIPE, MODULE_PORTAL, CLASS_FLEX_CENTER, MODULE_CAROUSEL, CLASS_SLIDE_WRAPPER, VK_ARROW_RIGHT, VK_ARROW_LEFT, VK_ESCAPE, MODULE_NAVIGATION, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, MODULE_NO_SCROLL, MODULE_ROOT, MODULE_TOOLBAR } from './types.js';
+import { IMAGE_FIT_COVER, IMAGE_FIT_CONTAIN, ACTION_CLOSE, MODULE_CONTROLLER, UNKNOWN_ACTION_TYPE, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_CANCEL, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_WHEEL, SLIDE_STATUS_LOADING, activeSlideStatus, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_PLACEHOLDER, ACTION_PREV, ACTION_NEXT, ACTION_SWIPE, MODULE_PORTAL, CLASS_FLEX_CENTER, MODULE_CAROUSEL, CLASS_SLIDE_WRAPPER, VK_ARROW_RIGHT, VK_ARROW_LEFT, VK_ESCAPE, MODULE_NAVIGATION, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, MODULE_NO_SCROLL, MODULE_ROOT, MODULE_TOOLBAR } from './types.js';
 import { createPortal } from 'react-dom';
 export { ACTIVE_SLIDE_COMPLETE, ACTIVE_SLIDE_ERROR, ACTIVE_SLIDE_LOADING, ACTIVE_SLIDE_PLAYING, CLASS_FULLSIZE, PLUGIN_CAPTIONS, PLUGIN_COUNTER, PLUGIN_DOWNLOAD, PLUGIN_FULLSCREEN, PLUGIN_INLINE, PLUGIN_SHARE, PLUGIN_SLIDESHOW, PLUGIN_THUMBNAILS, PLUGIN_ZOOM, SLIDE_STATUS_PLAYING } from './types.js';
 
+const clsx = (...classes) => [...classes].filter((cls) => Boolean(cls)).join(" ");
+const cssPrefix$3 = "yarl__";
+const cssClass = (name) => `${cssPrefix$3}${name}`;
+const cssVar = (name) => `--${cssPrefix$3}${name}`;
+const composePrefix = (base, prefix) => `${base}${prefix ? `_${prefix}` : ""}`;
+const makeComposePrefix = (base) => (prefix) => composePrefix(base, prefix);
+const label = (labels, lbl) => (labels && labels[lbl] ? labels[lbl] : lbl);
+const cleanup = (...cleaners) => () => {
+    cleaners.forEach((cleaner) => {
+        cleaner();
+    });
+};
+const makeUseContext = (name, contextName, context) => () => {
+    const ctx = React.useContext(context);
+    if (!ctx) {
+        throw new Error(`${name} must be used within a ${contextName}.Provider`);
+    }
+    return ctx;
+};
+const hasWindow = () => typeof window !== "undefined";
+function round(value, decimals = 0) {
+    const factor = 10 ** decimals;
+    return Math.round((value + Number.EPSILON) * factor) / factor;
+}
+const isImageSlide = (slide) => slide.type === undefined || slide.type === "image";
+const isImageFitCover = (image, imageFit) => image.imageFit === IMAGE_FIT_COVER || (image.imageFit !== IMAGE_FIT_CONTAIN && imageFit === IMAGE_FIT_COVER);
+function parseInt(value) {
+    return typeof value === "string" ? Number.parseInt(value, 10) : value;
+}
+function parseLengthPercentage(input) {
+    if (typeof input === "number") {
+        return { pixel: input };
+    }
+    if (typeof input === "string") {
+        const value = parseInt(input);
+        return input.endsWith("%") ? { percent: value } : { pixel: value };
+    }
+    return { pixel: 0 };
+}
+function computeSlideRect(containerRect, padding) {
+    const paddingValue = parseLengthPercentage(padding);
+    const paddingPixels = paddingValue.percent !== undefined ? (containerRect.width / 100) * paddingValue.percent : paddingValue.pixel;
+    return {
+        width: Math.max(containerRect.width - 2 * paddingPixels, 0),
+        height: Math.max(containerRect.height - 2 * paddingPixels, 0),
+    };
+}
+const devicePixelRatio = () => (hasWindow() ? window === null || window === void 0 ? void 0 : window.devicePixelRatio : undefined) || 1;
+const getSlideIndex = (index, slidesCount) => slidesCount > 0 ? ((index % slidesCount) + slidesCount) % slidesCount : 0;
+const hasSlides = (slides) => slides.length > 0;
+const getSlide = (slides, index) => slides[getSlideIndex(index, slides.length)];
+const getSlideIfPresent = (slides, index) => hasSlides(slides) ? getSlide(slides, index) : undefined;
+function addToolbarButton(toolbar, key, button) {
+    if (!button)
+        return toolbar;
+    const { buttons, ...restToolbar } = toolbar;
+    const index = buttons.findIndex((item) => item === key);
+    const buttonWithKey = React.isValidElement(button) ? React.cloneElement(button, { key }, null) : button;
+    if (index >= 0) {
+        const result = [...buttons];
+        result.splice(index, 1, buttonWithKey);
+        return { buttons: result, ...restToolbar };
+    }
+    return { buttons: [buttonWithKey, ...buttons], ...restToolbar };
+}
+function stopNavigationEventsPropagation() {
+    const stopPropagation = (event) => {
+        event.stopPropagation();
+    };
+    return { onPointerDown: stopPropagation, onKeyDown: stopPropagation, onWheel: stopPropagation };
+}
+function calculatePreload(carousel, slides, minimum = 0) {
+    return Math.min(carousel.preload, Math.max(carousel.finite ? slides.length - 1 : Math.floor(slides.length / 2), minimum));
+}
+
 const LightboxDefaultProps = {
     open: false,
     close: () => { },
@@ -140,78 +215,6 @@ function withPlugins(root, plugins = [], augmentations = []) {
     };
 }
 
-const clsx = (...classes) => [...classes].filter((cls) => Boolean(cls)).join(" ");
-const cssPrefix$3 = "yarl__";
-const cssClass = (name) => `${cssPrefix$3}${name}`;
-const cssVar = (name) => `--${cssPrefix$3}${name}`;
-const composePrefix = (base, prefix) => `${base}${prefix ? `_${prefix}` : ""}`;
-const makeComposePrefix = (base) => (prefix) => composePrefix(base, prefix);
-const label = (labels, lbl) => (labels && labels[lbl] ? labels[lbl] : lbl);
-const cleanup = (...cleaners) => () => {
-    cleaners.forEach((cleaner) => {
-        cleaner();
-    });
-};
-const makeUseContext = (name, contextName, context) => () => {
-    const ctx = React.useContext(context);
-    if (!ctx) {
-        throw new Error(`${name} must be used within a ${contextName}.Provider`);
-    }
-    return ctx;
-};
-const hasWindow = () => typeof window !== "undefined";
-function round(value, decimals = 0) {
-    const factor = 10 ** decimals;
-    return Math.round((value + Number.EPSILON) * factor) / factor;
-}
-const isImageSlide = (slide) => slide.type === undefined || slide.type === "image";
-const isImageFitCover = (image, imageFit) => image.imageFit === IMAGE_FIT_COVER || (image.imageFit !== IMAGE_FIT_CONTAIN && imageFit === IMAGE_FIT_COVER);
-function parseLengthPercentage(input) {
-    if (typeof input === "number") {
-        return { pixel: input };
-    }
-    if (typeof input === "string") {
-        const value = parseInt(input, 10);
-        return input.endsWith("%") ? { percent: value } : { pixel: value };
-    }
-    return { pixel: 0 };
-}
-function computeSlideRect(containerRect, padding) {
-    const paddingValue = parseLengthPercentage(padding);
-    const paddingPixels = paddingValue.percent !== undefined ? (containerRect.width / 100) * paddingValue.percent : paddingValue.pixel;
-    return {
-        width: Math.max(containerRect.width - 2 * paddingPixels, 0),
-        height: Math.max(containerRect.height - 2 * paddingPixels, 0),
-    };
-}
-const devicePixelRatio = () => (hasWindow() ? window === null || window === void 0 ? void 0 : window.devicePixelRatio : undefined) || 1;
-const getSlideIndex = (index, slidesCount) => slidesCount > 0 ? ((index % slidesCount) + slidesCount) % slidesCount : 0;
-const hasSlides = (slides) => slides.length > 0;
-const getSlide = (slides, index) => slides[getSlideIndex(index, slides.length)];
-const getSlideIfPresent = (slides, index) => hasSlides(slides) ? getSlide(slides, index) : undefined;
-function addToolbarButton(toolbar, key, button) {
-    if (!button)
-        return toolbar;
-    const { buttons, ...restToolbar } = toolbar;
-    const index = buttons.findIndex((item) => item === key);
-    const buttonWithKey = React.isValidElement(button) ? React.cloneElement(button, { key }, null) : button;
-    if (index >= 0) {
-        const result = [...buttons];
-        result.splice(index, 1, buttonWithKey);
-        return { buttons: result, ...restToolbar };
-    }
-    return { buttons: [buttonWithKey, ...buttons], ...restToolbar };
-}
-function stopNavigationEventsPropagation() {
-    const stopPropagation = (event) => {
-        event.stopPropagation();
-    };
-    return { onPointerDown: stopPropagation, onKeyDown: stopPropagation, onWheel: stopPropagation };
-}
-function calculatePreload(carousel, slides, minimum = 0) {
-    return Math.min(carousel.preload, Math.max(carousel.finite ? slides.length - 1 : Math.floor(slides.length / 2), minimum));
-}
-
 const EventsContext = React.createContext(null);
 const useEvents = makeUseContext("useEvents", "EventsContext", EventsContext);
 function EventsProvider({ children }) {
@@ -381,7 +384,7 @@ function currentTransformation(node) {
     const matrix = window.getComputedStyle(node).transform;
     const matcher = matrix.match(/matrix.*\((.+)\)/);
     if (matcher) {
-        const values = matcher[1].split(",").map((str) => Number.parseInt(str, 10));
+        const values = matcher[1].split(",").map(parseInt);
         if (values.length === 6) {
             x = values[4];
             y = values[5];
@@ -1252,7 +1255,7 @@ function padScrollbar(element, padding, rtl) {
     const property = rtl ? "padding-left" : "padding-right";
     const computedValue = rtl ? styles.paddingLeft : styles.paddingRight;
     const originalValue = element.style.getPropertyValue(property);
-    element.style.setProperty(property, `${(parseInt(computedValue, 10) || 0) + padding}px`);
+    element.style.setProperty(property, `${(parseInt(computedValue) || 0) + padding}px`);
     return () => {
         if (originalValue) {
             element.style.setProperty(property, originalValue);
@@ -1450,9 +1453,9 @@ function Lightbox({ carousel, animation, render, toolbar, controller, noScroll,
     if (!props.open)
         return null;
     return (React.createElement(LightboxPropsProvider, { ...props },
-        React.createElement(LightboxStateProvider, { slides: slides || defaultSlides, index: index || defaultIndex },
+        React.createElement(LightboxStateProvider, { slides: slides || defaultSlides, index: parseInt(index || defaultIndex) },
             React.createElement(TimeoutsProvider, null,
                 React.createElement(EventsProvider, null, renderNode(createNode(RootModule, config), props))))));
 }
 
-export { ACTION_CLOSE, ACTION_NEXT, ACTION_PREV, ACTION_SWIPE, CLASS_FLEX_CENTER, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, CLASS_SLIDE_WRAPPER, Carousel, CarouselModule, CloseIcon, Controller, ControllerContext, ControllerModule, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_POINTER_CANCEL, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_WHEEL, ErrorIcon, EventsContext, EventsProvider, IMAGE_FIT_CONTAIN, IMAGE_FIT_COVER, IconButton, ImageSlide, Lightbox, LightboxDefaultProps, LightboxDispatchContext, LightboxPropsContext, LightboxPropsProvider, LightboxStateContext, LightboxStateProvider, LoadingIcon, MODULE_CAROUSEL, MODULE_CONTROLLER, MODULE_NAVIGATION, MODULE_NO_SCROLL, MODULE_PORTAL, MODULE_ROOT, MODULE_TOOLBAR, Navigation, NavigationButton, NavigationModule, NextIcon, NoScroll, NoScrollModule, Portal, PortalModule, PreviousIcon, Root, RootModule, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_LOADING, SLIDE_STATUS_PLACEHOLDER, SwipeState, TimeoutsContext, TimeoutsProvider, Toolbar, ToolbarModule, UNKNOWN_ACTION_TYPE, VK_ARROW_LEFT, VK_ARROW_RIGHT, VK_ESCAPE, activeSlideStatus, addToolbarButton, calculatePreload, cleanup, clsx, composePrefix, computeSlideRect, createIcon, createIconDisabled, createModule, createNode, cssClass, cssVar, Lightbox as default, devicePixelRatio, getSlide, getSlideIfPresent, getSlideIndex, hasSlides, hasWindow, isImageFitCover, isImageSlide, label, makeComposePrefix, makeUseContext, parseLengthPercentage, round, setRef, stopNavigationEventsPropagation, useAnimation, useContainerRect, useController, useDelay, useEventCallback, useEvents, useForkRef, useKeyboardNavigation, useLayoutEffect, useLightboxDispatch, useLightboxProps, useLightboxState, useLoseFocus, useMotionPreference, useNavigationState, usePointerEvents, usePointerSwipe, usePreventSwipeNavigation, useRTL, useSensors, useThrottle, useTimeouts, useWheelSwipe, withPlugins };
+export { ACTION_CLOSE, ACTION_NEXT, ACTION_PREV, ACTION_SWIPE, CLASS_FLEX_CENTER, CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, CLASS_SLIDE_WRAPPER, Carousel, CarouselModule, CloseIcon, Controller, ControllerContext, ControllerModule, ELEMENT_BUTTON, ELEMENT_ICON, EVENT_ON_KEY_DOWN, EVENT_ON_KEY_UP, EVENT_ON_POINTER_CANCEL, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, EVENT_ON_WHEEL, ErrorIcon, EventsContext, EventsProvider, IMAGE_FIT_CONTAIN, IMAGE_FIT_COVER, IconButton, ImageSlide, Lightbox, LightboxDefaultProps, LightboxDispatchContext, LightboxPropsContext, LightboxPropsProvider, LightboxStateContext, LightboxStateProvider, LoadingIcon, MODULE_CAROUSEL, MODULE_CONTROLLER, MODULE_NAVIGATION, MODULE_NO_SCROLL, MODULE_PORTAL, MODULE_ROOT, MODULE_TOOLBAR, Navigation, NavigationButton, NavigationModule, NextIcon, NoScroll, NoScrollModule, Portal, PortalModule, PreviousIcon, Root, RootModule, SLIDE_STATUS_COMPLETE, SLIDE_STATUS_ERROR, SLIDE_STATUS_LOADING, SLIDE_STATUS_PLACEHOLDER, SwipeState, TimeoutsContext, TimeoutsProvider, Toolbar, ToolbarModule, UNKNOWN_ACTION_TYPE, VK_ARROW_LEFT, VK_ARROW_RIGHT, VK_ESCAPE, activeSlideStatus, addToolbarButton, calculatePreload, cleanup, clsx, composePrefix, computeSlideRect, createIcon, createIconDisabled, createModule, createNode, cssClass, cssVar, Lightbox as default, devicePixelRatio, getSlide, getSlideIfPresent, getSlideIndex, hasSlides, hasWindow, isImageFitCover, isImageSlide, label, makeComposePrefix, makeUseContext, parseInt, parseLengthPercentage, round, setRef, stopNavigationEventsPropagation, useAnimation, useContainerRect, useController, useDelay, useEventCallback, useEvents, useForkRef, useKeyboardNavigation, useLayoutEffect, useLightboxDispatch, useLightboxProps, useLightboxState, useLoseFocus, useMotionPreference, useNavigationState, usePointerEvents, usePointerSwipe, usePreventSwipeNavigation, useRTL, useSensors, useThrottle, useTimeouts, useWheelSwipe, withPlugins };

package/package.json

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