'use client';
import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
import React, { createContext } from 'react';
import { LoadingOverlay } from '../../elements/Loading/index.js';
import { useDelayedRender } from '../../hooks/useDelayedRender.js';
import { useTranslation } from '../../providers/Translation/index.js';
import { defaultLoadingOverlayState, reducer } from './reducer.js';
const animatedDuration = 250;
const Context = /*#__PURE__*/ createContext({
    isOnScreen: false,
    toggleLoadingOverlay: undefined
});
export const LoadingOverlayProvider = ({ children })=>{
    const { t } = useTranslation();
    const fallbackText = t('general:loading');
    const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState);
    const { isMounted, isUnmounting, triggerDelayedRender } = useDelayedRender({
        delayBeforeShow: 1000,
        inTimeout: animatedDuration,
        minShowTime: 500,
        outTimeout: animatedDuration,
        show: overlays.isLoading
    });
    const toggleLoadingOverlay = React.useCallback(({ type, isLoading, key, loadingText = fallbackText })=>{
        if (isLoading) {
            triggerDelayedRender();
            dispatchOverlay({
                type: 'add',
                payload: {
                    type,
                    key,
                    loadingText
                }
            });
        } else {
            dispatchOverlay({
                type: 'remove',
                payload: {
                    type,
                    key
                }
            });
        }
    }, [
        triggerDelayedRender,
        fallbackText
    ]);
    return /*#__PURE__*/ _jsxDEV(Context, {
        value: {
            isOnScreen: isMounted,
            toggleLoadingOverlay
        },
        children: [
            isMounted && /*#__PURE__*/ _jsxDEV(LoadingOverlay, {
                animationDuration: `${animatedDuration}ms`,
                loadingText: overlays.loadingText || fallbackText,
                overlayType: overlays.overlayType,
                show: !isUnmounting
            }, void 0, false, {
                fileName: "src/elements/LoadingOverlay/index.tsx",
                lineNumber: 64,
                columnNumber: 9
            }, this),
            children
        ]
    }, void 0, true, {
        fileName: "src/elements/LoadingOverlay/index.tsx",
        lineNumber: 57,
        columnNumber: 5
    }, this);
};
export const useLoadingOverlay = ()=>{
    const contextHook = React.use(Context);
    if (contextHook === undefined) {
        throw new Error('useLoadingOverlay must be used within a LoadingOverlayProvider');
    }
    return contextHook;
};

//# sourceMappingURL=index.js.map