yet-another-react-lightbox 3.5.4 → 3.6.0

package/dist/core/modules/Controller.js

@@ -1,215 +0,0 @@
-import * as React from "react";
-import { createModule } from "../config.js";
-import { cleanup, clsx, computeSlideRect, cssClass, cssVar, makeComposePrefix, makeUseContext, parseLengthPercentage, } from "../utils.js";
-import { useAnimation, useContainerRect, useDelay, useEventCallback, useForkRef, useRTL, useSensors, } from "../hooks/index.js";
-import { useEvents, useLightboxDispatch, useLightboxState } from "../contexts/index.js";
-import { SwipeState, usePointerSwipe, usePreventSwipeNavigation, useWheelSwipe } from "./controller/index.js";
-import { ACTION_CLOSE, ACTION_NEXT, ACTION_PREV, ACTION_SWIPE, ACTIVE_SLIDE_COMPLETE, ACTIVE_SLIDE_ERROR, ACTIVE_SLIDE_LOADING, ACTIVE_SLIDE_PLAYING, CLASS_FLEX_CENTER, EVENT_ON_KEY_UP, MODULE_CONTROLLER, VK_ESCAPE, } from "../consts.js";
-const cssContainerPrefix = makeComposePrefix("container");
-export const ControllerContext = React.createContext(null);
-export const useController = makeUseContext("useController", "ControllerContext", ControllerContext);
-export function Controller({ children, ...props }) {
-    var _a;
-    const { carousel, animation, controller, on, styles, render } = props;
-    const [toolbarWidth, setToolbarWidth] = React.useState();
-    const state = useLightboxState();
-    const dispatch = useLightboxDispatch();
-    const [swipeState, setSwipeState] = React.useState(SwipeState.NONE);
-    const swipeOffset = React.useRef(0);
-    const { registerSensors, subscribeSensors } = useSensors();
-    const { subscribe, publish } = useEvents();
-    const cleanupAnimationIncrement = useDelay();
-    const cleanupSwipeOffset = useDelay();
-    const { containerRef, setContainerRef, containerRect } = useContainerRect();
-    const handleContainerRef = useForkRef(usePreventSwipeNavigation(), setContainerRef);
-    const carouselRef = React.useRef(null);
-    const setCarouselRef = useForkRef(carouselRef, undefined);
-    const isRTL = useRTL();
-    const rtl = (value) => (isRTL ? -1 : 1) * (typeof value === "number" ? value : 1);
-    const focus = useEventCallback(() => { var _a; return (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
-    const getLightboxProps = useEventCallback(() => props);
-    const getLightboxState = useEventCallback(() => state);
-    const prev = React.useCallback((params) => publish(ACTION_PREV, params), [publish]);
-    const next = React.useCallback((params) => publish(ACTION_NEXT, params), [publish]);
-    const close = React.useCallback(() => publish(ACTION_CLOSE), [publish]);
-    const isSwipeValid = (offset) => !(carousel.finite &&
-        ((rtl(offset) > 0 && state.currentIndex === 0) ||
-            (rtl(offset) < 0 && state.currentIndex === state.slides.length - 1)));
-    const setSwipeOffset = (offset) => {
-        var _a;
-        swipeOffset.current = offset;
-        (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.style.setProperty(cssVar("swipe_offset"), `${Math.round(offset)}px`);
-    };
-    const { prepareAnimation, isAnimationPlaying } = useAnimation(carouselRef, (snapshot, rect, translate) => {
-        var _a;
-        if (carouselRef.current && containerRect && ((_a = state.animation) === null || _a === void 0 ? void 0 : _a.duration)) {
-            const parsedSpacing = parseLengthPercentage(carousel.spacing);
-            const spacingValue = (parsedSpacing.percent
-                ? (parsedSpacing.percent * containerRect.width) / 100
-                : parsedSpacing.pixel) || 0;
-            return {
-                keyframes: [
-                    {
-                        transform: `translateX(${rtl(state.globalIndex - snapshot.index) * (containerRect.width + spacingValue) +
-                            snapshot.rect.x -
-                            rect.x +
-                            translate.x}px)`,
-                    },
-                    { transform: "translateX(0)" },
-                ],
-                duration: state.animation.duration,
-                easing: state.animation.easing,
-            };
-        }
-        return undefined;
-    });
-    const swipe = useEventCallback((action) => {
-        var _a, _b;
-        const currentSwipeOffset = action.offset || 0;
-        const swipeDuration = !currentSwipeOffset ? (_a = animation.navigation) !== null && _a !== void 0 ? _a : animation.swipe : animation.swipe;
-        const swipeEasing = !currentSwipeOffset && !isAnimationPlaying() ? animation.easing.navigation : animation.easing.swipe;
-        let { direction } = action;
-        const count = (_b = action.count) !== null && _b !== void 0 ? _b : 1;
-        let newSwipeState = SwipeState.ANIMATION;
-        let newSwipeAnimationDuration = swipeDuration * count;
-        if (!direction) {
-            const containerWidth = containerRect === null || containerRect === void 0 ? void 0 : containerRect.width;
-            const elapsedTime = action.duration || 0;
-            const expectedTime = containerWidth
-                ? (swipeDuration / containerWidth) * Math.abs(currentSwipeOffset)
-                : swipeDuration;
-            if (count !== 0) {
-                if (elapsedTime < expectedTime) {
-                    newSwipeAnimationDuration =
-                        (newSwipeAnimationDuration / expectedTime) * Math.max(elapsedTime, expectedTime / 5);
-                }
-                else if (containerWidth) {
-                    newSwipeAnimationDuration =
-                        (swipeDuration / containerWidth) * (containerWidth - Math.abs(currentSwipeOffset));
-                }
-                direction = rtl(currentSwipeOffset) > 0 ? ACTION_PREV : ACTION_NEXT;
-            }
-            else {
-                newSwipeAnimationDuration = swipeDuration / 2;
-            }
-        }
-        let increment = 0;
-        if (direction === ACTION_PREV) {
-            if (isSwipeValid(rtl(1))) {
-                increment = -count;
-            }
-            else {
-                newSwipeState = SwipeState.NONE;
-                newSwipeAnimationDuration = swipeDuration;
-            }
-        }
-        else if (direction === ACTION_NEXT) {
-            if (isSwipeValid(rtl(-1))) {
-                increment = count;
-            }
-            else {
-                newSwipeState = SwipeState.NONE;
-                newSwipeAnimationDuration = swipeDuration;
-            }
-        }
-        newSwipeAnimationDuration = Math.round(newSwipeAnimationDuration);
-        cleanupSwipeOffset(() => {
-            setSwipeOffset(0);
-            setSwipeState(SwipeState.NONE);
-        }, newSwipeAnimationDuration);
-        if (carouselRef.current) {
-            prepareAnimation({
-                rect: carouselRef.current.getBoundingClientRect(),
-                index: state.globalIndex,
-            });
-        }
-        setSwipeState(newSwipeState);
-        publish(ACTION_SWIPE, {
-            type: "swipe",
-            increment,
-            duration: newSwipeAnimationDuration,
-            easing: swipeEasing,
-        });
-    });
-    React.useEffect(() => {
-        var _a, _b;
-        if (((_a = state.animation) === null || _a === void 0 ? void 0 : _a.increment) && ((_b = state.animation) === null || _b === void 0 ? void 0 : _b.duration)) {
-            cleanupAnimationIncrement(() => dispatch({ type: "swipe", increment: 0 }), state.animation.duration);
-        }
-    }, [state.animation, dispatch, cleanupAnimationIncrement]);
-    const swipeParams = [
-        subscribeSensors,
-        isSwipeValid,
-        (containerRect === null || containerRect === void 0 ? void 0 : containerRect.width) || 0,
-        animation.swipe,
-        () => setSwipeState(SwipeState.SWIPE),
-        (offset) => setSwipeOffset(offset),
-        (offset, duration) => swipe({ offset, duration, count: 1 }),
-        (offset) => swipe({ offset, count: 0 }),
-    ];
-    usePointerSwipe(...swipeParams);
-    useWheelSwipe(swipeState, ...swipeParams);
-    const focusOnMount = useEventCallback(() => {
-        var _a;
-        if (controller.focus) {
-            (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-    });
-    React.useEffect(focusOnMount, [focusOnMount]);
-    const onViewCallback = useEventCallback(() => {
-        var _a;
-        (_a = on.view) === null || _a === void 0 ? void 0 : _a.call(on, { index: state.currentIndex });
-    });
-    React.useEffect(onViewCallback, [state.globalIndex, onViewCallback]);
-    React.useEffect(() => cleanup(subscribe(ACTION_PREV, (action) => swipe({ direction: ACTION_PREV, ...action })), subscribe(ACTION_NEXT, (action) => swipe({ direction: ACTION_NEXT, ...action })), subscribe(ACTION_SWIPE, (action) => dispatch(action))), [subscribe, swipe, dispatch]);
-    React.useEffect(() => subscribeSensors(EVENT_ON_KEY_UP, (event) => {
-        if (event.code === VK_ESCAPE) {
-            close();
-        }
-    }), [subscribeSensors, close]);
-    const context = React.useMemo(() => ({
-        prev,
-        next,
-        close,
-        focus,
-        slideRect: containerRect ? computeSlideRect(containerRect, carousel.padding) : { width: 0, height: 0 },
-        containerRect: containerRect || { width: 0, height: 0 },
-        subscribeSensors,
-        containerRef,
-        setCarouselRef,
-        toolbarWidth,
-        setToolbarWidth,
-    }), [
-        prev,
-        next,
-        close,
-        focus,
-        subscribeSensors,
-        containerRect,
-        containerRef,
-        setCarouselRef,
-        toolbarWidth,
-        setToolbarWidth,
-        carousel.padding,
-    ]);
-    React.useImperativeHandle(controller.ref, () => ({
-        prev,
-        next,
-        close,
-        focus,
-        getLightboxProps,
-        getLightboxState,
-    }), [prev, next, close, focus, getLightboxProps, getLightboxState]);
-    return (React.createElement("div", { ref: handleContainerRef, className: clsx(cssClass(cssContainerPrefix()), cssClass(CLASS_FLEX_CENTER)), style: {
-            ...(swipeState === SwipeState.SWIPE
-                ? { [cssVar("swipe_offset")]: `${Math.round(swipeOffset.current)}px` }
-                : null),
-            ...(controller.touchAction !== "none"
-                ? { [cssVar("controller_touch_action")]: controller.touchAction }
-                : null),
-            ...styles.container,
-        }, ...(controller.aria ? { role: "presentation", "aria-live": "polite" } : null), tabIndex: -1, ...registerSensors }, containerRect && (React.createElement(ControllerContext.Provider, { value: context },
-        children, (_a = render.controls) === null || _a === void 0 ? void 0 :
-        _a.call(render)))));
-}
-export const ControllerModule = createModule(MODULE_CONTROLLER, Controller);

package/dist/core/modules/Navigation.d.ts

@@ -1,13 +0,0 @@
-import * as React from "react";
-import { ComponentProps, RenderFunction } from "../../types.js";
-export type NavigationButtonProps = {
-    label: string;
-    icon: React.ElementType;
-    renderIcon?: RenderFunction;
-    action: "prev" | "next";
-    onClick: () => void;
-    disabled?: boolean;
-};
-export declare function NavigationButton({ label, icon, renderIcon, action, onClick, disabled }: NavigationButtonProps): React.JSX.Element;
-export declare function Navigation({ carousel: { finite }, animation, render: { buttonPrev, buttonNext, iconPrev, iconNext }, }: ComponentProps): React.JSX.Element;
-export declare const NavigationModule: import("../../types.js").Module;

package/dist/core/modules/Navigation.js

@@ -1,35 +0,0 @@
-import * as React from "react";
-import { createModule } from "../config.js";
-import { useEventCallback, useLoseFocus, useRTL, useThrottle } from "../hooks/index.js";
-import { cssClass } from "../utils.js";
-import { IconButton, NextIcon, PreviousIcon } from "../components/index.js";
-import { useLightboxState } from "../contexts/index.js";
-import { useController } from "./Controller.js";
-import { ACTION_NEXT, ACTION_PREV, EVENT_ON_KEY_DOWN, MODULE_NAVIGATION, VK_ARROW_LEFT, VK_ARROW_RIGHT, } from "../consts.js";
-export function NavigationButton({ label, icon, renderIcon, action, onClick, disabled }) {
-    return (React.createElement(IconButton, { label: label, icon: icon, renderIcon: renderIcon, className: cssClass(`navigation_${action}`), disabled: disabled, onClick: onClick, ...useLoseFocus(disabled) }));
-}
-export function Navigation({ carousel: { finite }, animation, render: { buttonPrev, buttonNext, iconPrev, iconNext }, }) {
-    var _a;
-    const { slides, currentIndex } = useLightboxState();
-    const { prev, next, subscribeSensors } = useController();
-    const isRTL = useRTL();
-    const prevDisabled = slides.length === 0 || (finite && currentIndex === 0);
-    const nextDisabled = slides.length === 0 || (finite && currentIndex === slides.length - 1);
-    const throttle = ((_a = animation.navigation) !== null && _a !== void 0 ? _a : animation.swipe) / 2;
-    const prevThrottled = useThrottle(prev, throttle);
-    const nextThrottled = useThrottle(next, throttle);
-    const handleKeyDown = useEventCallback((event) => {
-        if (event.key === VK_ARROW_LEFT && !(isRTL ? nextDisabled : prevDisabled)) {
-            (isRTL ? nextThrottled : prevThrottled)();
-        }
-        if (event.key === VK_ARROW_RIGHT && !(isRTL ? prevDisabled : nextDisabled)) {
-            (isRTL ? prevThrottled : nextThrottled)();
-        }
-    });
-    React.useEffect(() => subscribeSensors(EVENT_ON_KEY_DOWN, handleKeyDown), [subscribeSensors, handleKeyDown]);
-    return (React.createElement(React.Fragment, null,
-        buttonPrev ? (buttonPrev()) : (React.createElement(NavigationButton, { label: "Previous", action: ACTION_PREV, icon: PreviousIcon, renderIcon: iconPrev, disabled: prevDisabled, onClick: prev })),
-        buttonNext ? (buttonNext()) : (React.createElement(NavigationButton, { label: "Next", action: ACTION_NEXT, icon: NextIcon, renderIcon: iconNext, disabled: nextDisabled, onClick: next }))));
-}
-export const NavigationModule = createModule(MODULE_NAVIGATION, Navigation);

package/dist/core/modules/NoScroll.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { ComponentProps } from "../../types.js";
-export declare function NoScroll({ children }: ComponentProps): React.JSX.Element;
-export declare const NoScrollModule: import("../../types.js").Module;

package/dist/core/modules/NoScroll.js

@@ -1,52 +0,0 @@
-import * as React from "react";
-import { createModule } from "../config.js";
-import { cssClass } from "../utils.js";
-import { useLayoutEffect, useRTL } from "../hooks/index.js";
-import { CLASS_NO_SCROLL, CLASS_NO_SCROLL_PADDING, MODULE_NO_SCROLL } from "../consts.js";
-const noScroll = cssClass(CLASS_NO_SCROLL);
-const noScrollPadding = cssClass(CLASS_NO_SCROLL_PADDING);
-function isHTMLElement(element) {
-    return "style" in element;
-}
-function padScrollbar(element, padding, rtl) {
-    const styles = window.getComputedStyle(element);
-    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`);
-    return () => {
-        if (originalValue) {
-            element.style.setProperty(property, originalValue);
-        }
-        else {
-            element.style.removeProperty(property);
-        }
-    };
-}
-export function NoScroll({ children }) {
-    const rtl = useRTL();
-    useLayoutEffect(() => {
-        const cleanup = [];
-        const { body, documentElement } = document;
-        const scrollbar = Math.round(window.innerWidth - documentElement.clientWidth);
-        if (scrollbar > 0) {
-            cleanup.push(padScrollbar(body, scrollbar, rtl));
-            const elements = body.getElementsByTagName("*");
-            for (let i = 0; i < elements.length; i += 1) {
-                const element = elements[i];
-                if (isHTMLElement(element) &&
-                    window.getComputedStyle(element).getPropertyValue("position") === "fixed" &&
-                    !element.classList.contains(noScrollPadding)) {
-                    cleanup.push(padScrollbar(element, scrollbar, rtl));
-                }
-            }
-        }
-        body.classList.add(noScroll);
-        return () => {
-            body.classList.remove(noScroll);
-            cleanup.forEach((clean) => clean());
-        };
-    }, [rtl]);
-    return React.createElement(React.Fragment, null, children);
-}
-export const NoScrollModule = createModule(MODULE_NO_SCROLL, NoScroll);

package/dist/core/modules/Portal.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { ComponentProps } from "../../types.js";
-export declare function Portal({ children, animation, styles, className, on, portal, close }: ComponentProps): React.ReactPortal | null;
-export declare const PortalModule: import("../../types.js").Module;

package/dist/core/modules/Portal.js

@@ -1,92 +0,0 @@
-import * as React from "react";
-import * as ReactDOM from "react-dom";
-import { LightboxDefaultProps } from "../../props.js";
-import { createModule } from "../config.js";
-import { clsx, composePrefix, cssClass, cssVar } from "../utils.js";
-import { useEventCallback, useMotionPreference } from "../hooks/index.js";
-import { useEvents, useTimeouts } from "../contexts/index.js";
-import { ACTION_CLOSE, CLASS_NO_SCROLL_PADDING, MODULE_PORTAL } from "../consts.js";
-function cssPrefix(value) {
-    return composePrefix(MODULE_PORTAL, value);
-}
-function setAttribute(element, attribute, value) {
-    const previousValue = element.getAttribute(attribute);
-    element.setAttribute(attribute, value);
-    return () => {
-        if (previousValue) {
-            element.setAttribute(attribute, previousValue);
-        }
-        else {
-            element.removeAttribute(attribute);
-        }
-    };
-}
-export function Portal({ children, animation, styles, className, on, portal, close }) {
-    const [mounted, setMounted] = React.useState(false);
-    const [visible, setVisible] = React.useState(false);
-    const cleanup = React.useRef([]);
-    const { setTimeout } = useTimeouts();
-    const { subscribe } = useEvents();
-    const reduceMotion = useMotionPreference();
-    const animationDuration = !reduceMotion ? animation.fade : 0;
-    React.useEffect(() => {
-        setMounted(true);
-        return () => {
-            setMounted(false);
-            setVisible(false);
-        };
-    }, []);
-    const handleClose = useEventCallback(() => {
-        var _a;
-        setVisible(false);
-        (_a = on.exiting) === null || _a === void 0 ? void 0 : _a.call(on);
-        setTimeout(() => {
-            var _a;
-            (_a = on.exited) === null || _a === void 0 ? void 0 : _a.call(on);
-            close();
-        }, animationDuration);
-    });
-    React.useEffect(() => subscribe(ACTION_CLOSE, handleClose), [subscribe, handleClose]);
-    const handleEnter = useEventCallback((node) => {
-        var _a, _b, _c;
-        node.scrollTop;
-        setVisible(true);
-        (_a = on.entering) === null || _a === void 0 ? void 0 : _a.call(on);
-        const elements = (_c = (_b = node.parentNode) === null || _b === void 0 ? void 0 : _b.children) !== null && _c !== void 0 ? _c : [];
-        for (let i = 0; i < elements.length; i += 1) {
-            const element = elements[i];
-            if (["TEMPLATE", "SCRIPT", "STYLE"].indexOf(element.tagName) === -1 && element !== node) {
-                cleanup.current.push(setAttribute(element, "inert", "true"));
-                cleanup.current.push(setAttribute(element, "aria-hidden", "true"));
-            }
-        }
-        setTimeout(() => {
-            var _a;
-            (_a = on.entered) === null || _a === void 0 ? void 0 : _a.call(on);
-        }, animationDuration);
-    });
-    const handleExit = useEventCallback(() => {
-        cleanup.current.forEach((clean) => clean());
-        cleanup.current = [];
-    });
-    const handleRef = React.useCallback((node) => {
-        if (node) {
-            handleEnter(node);
-        }
-        else {
-            handleExit();
-        }
-    }, [handleEnter, handleExit]);
-    return mounted
-        ? ReactDOM.createPortal(React.createElement("div", { ref: handleRef, className: clsx(className, cssClass("root"), cssClass(cssPrefix()), cssClass(CLASS_NO_SCROLL_PADDING), visible && cssClass(cssPrefix("open"))), role: "presentation", "aria-live": "polite", style: {
-                ...(animation.fade !== LightboxDefaultProps.animation.fade
-                    ? { [cssVar("fade_animation_duration")]: `${animationDuration}ms` }
-                    : null),
-                ...(animation.easing.fade !== LightboxDefaultProps.animation.easing.fade
-                    ? { [cssVar("fade_animation_timing_function")]: animation.easing.fade }
-                    : null),
-                ...styles.root,
-            } }, children), portal.root || document.body)
-        : null;
-}
-export const PortalModule = createModule(MODULE_PORTAL, Portal);

package/dist/core/modules/Root.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { ComponentProps } from "../../types.js";
-export declare function Root({ children }: ComponentProps): React.JSX.Element;
-export declare const RootModule: import("../../types.js").Module;

package/dist/core/modules/Root.js

@@ -1,7 +0,0 @@
-import * as React from "react";
-import { createModule } from "../config.js";
-import { MODULE_ROOT } from "../consts.js";
-export function Root({ children }) {
-    return React.createElement(React.Fragment, null, children);
-}
-export const RootModule = createModule(MODULE_ROOT, Root);

package/dist/core/modules/Toolbar.d.ts

@@ -1,4 +0,0 @@
-import * as React from "react";
-import { ComponentProps } from "../../types.js";
-export declare function Toolbar({ toolbar: { buttons }, render: { buttonClose, iconClose } }: ComponentProps): React.JSX.Element;
-export declare const ToolbarModule: import("../../types.js").Module;

package/dist/core/modules/Toolbar.js

@@ -1,25 +0,0 @@
-import * as React from "react";
-import { createModule } from "../config.js";
-import { useLayoutEffect } from "../hooks/index.js";
-import { composePrefix, cssClass, stopNavigationEventsPropagation } from "../utils.js";
-import { CloseIcon, IconButton } from "../components/index.js";
-import { useContainerRect } from "../hooks/useContainerRect.js";
-import { useController } from "./Controller.js";
-import { ACTION_CLOSE, MODULE_TOOLBAR } from "../consts.js";
-function cssPrefix(value) {
-    return composePrefix(MODULE_TOOLBAR, value);
-}
-export function Toolbar({ toolbar: { buttons }, render: { buttonClose, iconClose } }) {
-    const { close, setToolbarWidth } = useController();
-    const { setContainerRef, containerRect } = useContainerRect();
-    useLayoutEffect(() => {
-        setToolbarWidth(containerRect === null || containerRect === void 0 ? void 0 : containerRect.width);
-    }, [setToolbarWidth, containerRect === null || containerRect === void 0 ? void 0 : containerRect.width]);
-    const renderCloseButton = () => {
-        if (buttonClose)
-            return buttonClose();
-        return React.createElement(IconButton, { key: ACTION_CLOSE, label: "Close", icon: CloseIcon, renderIcon: iconClose, onClick: close });
-    };
-    return (React.createElement("div", { ref: setContainerRef, className: cssClass(cssPrefix()), ...stopNavigationEventsPropagation() }, buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => (button === ACTION_CLOSE ? renderCloseButton() : button))));
-}
-export const ToolbarModule = createModule(MODULE_TOOLBAR, Toolbar);

package/dist/core/modules/controller/index.d.ts

@@ -1,8 +0,0 @@
-export declare enum SwipeState {
-    NONE = 0,
-    SWIPE = 1,
-    ANIMATION = 2
-}
-export * from "./usePointerSwipe.js";
-export * from "./usePreventSwipeNavigation.js";
-export * from "./useWheelSwipe.js";

package/dist/core/modules/controller/index.js

@@ -1,9 +0,0 @@
-export var SwipeState;
-(function (SwipeState) {
-    SwipeState[SwipeState["NONE"] = 0] = "NONE";
-    SwipeState[SwipeState["SWIPE"] = 1] = "SWIPE";
-    SwipeState[SwipeState["ANIMATION"] = 2] = "ANIMATION";
-})(SwipeState || (SwipeState = {}));
-export * from "./usePointerSwipe.js";
-export * from "./usePreventSwipeNavigation.js";
-export * from "./useWheelSwipe.js";

package/dist/core/modules/controller/usePointerSwipe.d.ts

@@ -1,2 +0,0 @@
-import { UseSensors } from "../../hooks/useSensors.js";
-export declare function usePointerSwipe<T extends Element = Element>(subscribeSensors: UseSensors<T>["subscribeSensors"], isSwipeValid: (offset: number) => boolean, containerWidth: number, swipeAnimationDuration: number, onSwipeStart: () => void, onSwipeProgress: (offset: number) => void, onSwipeFinish: (offset: number, duration: number) => void, onSwipeCancel: (offset: number) => void): void;

package/dist/core/modules/controller/usePointerSwipe.js

@@ -1,72 +0,0 @@
-import * as React from "react";
-import { cleanup } from "../../utils.js";
-import { useEventCallback } from "../../hooks/useEventCallback.js";
-import { EVENT_ON_POINTER_CANCEL, EVENT_ON_POINTER_DOWN, EVENT_ON_POINTER_LEAVE, EVENT_ON_POINTER_MOVE, EVENT_ON_POINTER_UP, } from "../../consts.js";
-export function usePointerSwipe(subscribeSensors, isSwipeValid, containerWidth, swipeAnimationDuration, onSwipeStart, onSwipeProgress, onSwipeFinish, onSwipeCancel) {
-    const offset = React.useRef(0);
-    const pointers = React.useRef([]);
-    const activePointer = React.useRef();
-    const startTime = React.useRef(0);
-    const clearPointer = React.useCallback((event) => {
-        if (activePointer.current === event.pointerId) {
-            activePointer.current = undefined;
-        }
-        const currentPointers = pointers.current;
-        currentPointers.splice(0, currentPointers.length, ...currentPointers.filter((p) => p.pointerId !== event.pointerId));
-    }, []);
-    const addPointer = React.useCallback((event) => {
-        clearPointer(event);
-        event.persist();
-        pointers.current.push(event);
-    }, [clearPointer]);
-    const onPointerDown = useEventCallback((event) => {
-        addPointer(event);
-    });
-    const onPointerUp = useEventCallback((event) => {
-        if (pointers.current.find((x) => x.pointerId === event.pointerId) &&
-            activePointer.current === event.pointerId) {
-            const duration = Date.now() - startTime.current;
-            const currentOffset = offset.current;
-            if (Math.abs(currentOffset) > 0.3 * containerWidth ||
-                (Math.abs(currentOffset) > 5 && duration < swipeAnimationDuration)) {
-                onSwipeFinish(currentOffset, duration);
-            }
-            else {
-                onSwipeCancel(currentOffset);
-            }
-            offset.current = 0;
-        }
-        clearPointer(event);
-    });
-    const onPointerMove = useEventCallback((event) => {
-        const pointer = pointers.current.find((p) => p.pointerId === event.pointerId);
-        if (pointer) {
-            const isCurrentPointer = activePointer.current === event.pointerId;
-            if (event.buttons === 0) {
-                if (isCurrentPointer && offset.current !== 0) {
-                    onPointerUp(event);
-                }
-                else {
-                    clearPointer(pointer);
-                }
-                return;
-            }
-            const deltaX = event.clientX - pointer.clientX;
-            const deltaY = event.clientY - pointer.clientY;
-            if (activePointer.current === undefined &&
-                isSwipeValid(deltaX) &&
-                Math.abs(deltaX) > Math.abs(deltaY) &&
-                Math.abs(deltaX) > 30) {
-                addPointer(event);
-                activePointer.current = event.pointerId;
-                startTime.current = Date.now();
-                onSwipeStart();
-            }
-            else if (isCurrentPointer) {
-                offset.current = deltaX;
-                onSwipeProgress(deltaX);
-            }
-        }
-    });
-    React.useEffect(() => cleanup(subscribeSensors(EVENT_ON_POINTER_DOWN, onPointerDown), subscribeSensors(EVENT_ON_POINTER_MOVE, onPointerMove), subscribeSensors(EVENT_ON_POINTER_UP, onPointerUp), subscribeSensors(EVENT_ON_POINTER_LEAVE, onPointerUp), subscribeSensors(EVENT_ON_POINTER_CANCEL, onPointerUp)), [subscribeSensors, onPointerDown, onPointerMove, onPointerUp]);
-}

package/dist/core/modules/controller/usePreventSwipeNavigation.d.ts

@@ -1,3 +0,0 @@
-/** prevent browser back/forward navigation on touchpad left/right swipe (especially noticeable in Safari)
- * this has to be done via non-passive native event handler */
-export declare function usePreventSwipeNavigation<T extends HTMLElement = HTMLElement>(): (node: T | null) => void;

package/dist/core/modules/controller/usePreventSwipeNavigation.js

@@ -1,20 +0,0 @@
-import * as React from "react";
-const WHEEL = "wheel";
-function preventDefault(event) {
-    if (Math.abs(event.deltaX) > Math.abs(event.deltaY) || event.ctrlKey) {
-        event.preventDefault();
-    }
-}
-export function usePreventSwipeNavigation() {
-    const ref = React.useRef(null);
-    return React.useCallback((node) => {
-        var _a;
-        if (node) {
-            node.addEventListener(WHEEL, preventDefault, { passive: false });
-        }
-        else {
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(WHEEL, preventDefault);
-        }
-        ref.current = node;
-    }, []);
-}

package/dist/core/modules/controller/useWheelSwipe.d.ts

@@ -1,3 +0,0 @@
-import { UseSensors } from "../../hooks/index.js";
-import { SwipeState } from "./index.js";
-export declare function useWheelSwipe<T extends Element = Element>(swipeState: SwipeState, subscribeSensors: UseSensors<T>["subscribeSensors"], isSwipeValid: (offset: number) => boolean, containerWidth: number, swipeAnimationDuration: number, onSwipeStart: () => void, onSwipeProgress: (offset: number) => void, onSwipeFinish: (offset: number, duration: number) => void, onSwipeCancel: (offset: number) => void): void;