@pallasoft/ps-core-components 2.24.0 → 2.25.0

package/dist/esm/hooks/use-ps-exit-snapshot.js

@@ -0,0 +1,7 @@
+import { useRef } from 'react';
+export const usePsExitSnapshot = (isOpen, value) => {
+    const snapshotRef = useRef(value);
+    if (isOpen)
+        snapshotRef.current = value;
+    return snapshotRef.current;
+};

package/dist/esm/hooks/use-ps-exit-transition.js

@@ -1,9 +1,12 @@
 import { useEffect, useRef, useState } from 'react';
+import { usePsReducedMotion } from './use-ps-reduced-motion';
 export const usePsExitTransition = (isOpen, durationMs = 180) => {
     const [shouldRender, setShouldRender] = useState(isOpen);
     const [isClosing, setIsClosing] = useState(false);
     const timeoutRef = useRef();
     const hasRenderedRef = useRef(isOpen);
+    const isReducedMotion = usePsReducedMotion();
+    const exitDurationMs = isReducedMotion ? 0 : durationMs;
     useEffect(() => {
         if (timeoutRef.current)
             clearTimeout(timeoutRef.current);
@@ -18,12 +21,12 @@ export const usePsExitTransition = (isOpen, durationMs = 180) => {
         timeoutRef.current = setTimeout(() => {
             setShouldRender(false);
             setIsClosing(false);
-        }, durationMs);
+        }, exitDurationMs);
         return () => {
             if (timeoutRef.current)
                 clearTimeout(timeoutRef.current);
         };
-    }, [isOpen, durationMs]);
+    }, [isOpen, exitDurationMs]);
     hasRenderedRef.current = shouldRender;
     return { isClosing, shouldRender };
 };

package/dist/esm/hooks/use-ps-restore-focus.js

@@ -0,0 +1,16 @@
+import { useEffect, useRef } from 'react';
+export const usePsRestoreFocus = (isActive) => {
+    const returnTargetRef = useRef(null);
+    useEffect(() => {
+        if (!isActive)
+            return;
+        returnTargetRef.current =
+            document.activeElement instanceof HTMLElement ? document.activeElement : null;
+        return () => {
+            const target = returnTargetRef.current;
+            returnTargetRef.current = null;
+            if (target && target.isConnected)
+                target.focus();
+        };
+    }, [isActive]);
+};

package/dist/esm/hooks/use-ps-scroll-lock.js

@@ -0,0 +1,9 @@
+import { useEffect } from 'react';
+import { PsScrollLockService } from '../services/ps-scroll-lock-service';
+export const usePsScrollLock = (isLocked) => {
+    useEffect(() => {
+        if (!isLocked)
+            return;
+        return PsScrollLockService.lock();
+    }, [isLocked]);
+};

package/dist/esm/index.js

@@ -32,6 +32,7 @@ export * from './hooks/use-ps-published-height';
 export * from './constants/ps-scaled-preview-config';
 export * from './constants/ps-site-header-config';
 export * from './components/ps-skeleton';
+export * from './services/ps-scroll-lock-service';
 export * from './services/ps-skeleton-class-service';
 export * from './models/ps-skeleton-size';
 export * from './constants/ps-skeleton-shape';
@@ -45,7 +46,10 @@ export * from './components/ps-spinner';
 export * from './components/ps-theme-toggle';
 export * from './components/ps-voice-orb';
 export * from './hooks/use-ps-audio-spectrum';
+export * from './hooks/use-ps-exit-snapshot';
 export * from './hooks/use-ps-exit-transition';
+export * from './hooks/use-ps-restore-focus';
+export * from './hooks/use-ps-scroll-lock';
 export * from './hooks/use-ps-hide-on-scroll';
 export * from './hooks/use-ps-invisible-recaptcha';
 export * from './contexts/ps-layer-context';

package/dist/esm/services/ps-scroll-lock-service.js

@@ -0,0 +1,23 @@
+export class PsScrollLockService {
+    static lock() {
+        if (typeof document === 'undefined')
+            return () => undefined;
+        if (PsScrollLockService.count === 0) {
+            PsScrollLockService.previousOverflow = document.body.style.overflow;
+            document.body.style.overflow = 'hidden';
+        }
+        PsScrollLockService.count += 1;
+        let isReleased = false;
+        return () => {
+            if (isReleased)
+                return;
+            isReleased = true;
+            PsScrollLockService.count -= 1;
+            if (PsScrollLockService.count === 0) {
+                document.body.style.overflow = PsScrollLockService.previousOverflow;
+            }
+        };
+    }
+}
+PsScrollLockService.count = 0;
+PsScrollLockService.previousOverflow = '';

package/dist/hooks/use-ps-exit-snapshot.d.ts

@@ -0,0 +1 @@
+export declare const usePsExitSnapshot: <T>(isOpen: boolean, value: T) => T;

package/dist/hooks/use-ps-exit-snapshot.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsExitSnapshot = void 0;
+const react_1 = require("react");
+const usePsExitSnapshot = (isOpen, value) => {
+    const snapshotRef = (0, react_1.useRef)(value);
+    if (isOpen)
+        snapshotRef.current = value;
+    return snapshotRef.current;
+};
+exports.usePsExitSnapshot = usePsExitSnapshot;

package/dist/hooks/use-ps-exit-transition.js

@@ -2,11 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.usePsExitTransition = void 0;
 const react_1 = require("react");
+const use_ps_reduced_motion_1 = require("./use-ps-reduced-motion");
 const usePsExitTransition = (isOpen, durationMs = 180) => {
     const [shouldRender, setShouldRender] = (0, react_1.useState)(isOpen);
     const [isClosing, setIsClosing] = (0, react_1.useState)(false);
     const timeoutRef = (0, react_1.useRef)();
     const hasRenderedRef = (0, react_1.useRef)(isOpen);
+    const isReducedMotion = (0, use_ps_reduced_motion_1.usePsReducedMotion)();
+    const exitDurationMs = isReducedMotion ? 0 : durationMs;
     (0, react_1.useEffect)(() => {
         if (timeoutRef.current)
             clearTimeout(timeoutRef.current);
@@ -21,12 +24,12 @@ const usePsExitTransition = (isOpen, durationMs = 180) => {
         timeoutRef.current = setTimeout(() => {
             setShouldRender(false);
             setIsClosing(false);
-        }, durationMs);
+        }, exitDurationMs);
         return () => {
             if (timeoutRef.current)
                 clearTimeout(timeoutRef.current);
         };
-    }, [isOpen, durationMs]);
+    }, [isOpen, exitDurationMs]);
     hasRenderedRef.current = shouldRender;
     return { isClosing, shouldRender };
 };

package/dist/hooks/use-ps-restore-focus.d.ts

@@ -0,0 +1 @@
+export declare const usePsRestoreFocus: (isActive: boolean) => void;

package/dist/hooks/use-ps-restore-focus.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsRestoreFocus = void 0;
+const react_1 = require("react");
+const usePsRestoreFocus = (isActive) => {
+    const returnTargetRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (!isActive)
+            return;
+        returnTargetRef.current =
+            document.activeElement instanceof HTMLElement ? document.activeElement : null;
+        return () => {
+            const target = returnTargetRef.current;
+            returnTargetRef.current = null;
+            if (target && target.isConnected)
+                target.focus();
+        };
+    }, [isActive]);
+};
+exports.usePsRestoreFocus = usePsRestoreFocus;

package/dist/hooks/use-ps-scroll-lock.d.ts

@@ -0,0 +1 @@
+export declare const usePsScrollLock: (isLocked: boolean) => void;

package/dist/hooks/use-ps-scroll-lock.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePsScrollLock = void 0;
+const react_1 = require("react");
+const ps_scroll_lock_service_1 = require("../services/ps-scroll-lock-service");
+const usePsScrollLock = (isLocked) => {
+    (0, react_1.useEffect)(() => {
+        if (!isLocked)
+            return;
+        return ps_scroll_lock_service_1.PsScrollLockService.lock();
+    }, [isLocked]);
+};
+exports.usePsScrollLock = usePsScrollLock;

package/dist/index.d.ts

@@ -32,6 +32,7 @@ export * from './hooks/use-ps-published-height';
 export * from './constants/ps-scaled-preview-config';
 export * from './constants/ps-site-header-config';
 export * from './components/ps-skeleton';
+export * from './services/ps-scroll-lock-service';
 export * from './services/ps-skeleton-class-service';
 export * from './models/ps-skeleton-size';
 export * from './constants/ps-skeleton-shape';
@@ -45,7 +46,10 @@ export * from './components/ps-spinner';
 export * from './components/ps-theme-toggle';
 export * from './components/ps-voice-orb';
 export * from './hooks/use-ps-audio-spectrum';
+export * from './hooks/use-ps-exit-snapshot';
 export * from './hooks/use-ps-exit-transition';
+export * from './hooks/use-ps-restore-focus';
+export * from './hooks/use-ps-scroll-lock';
 export * from './hooks/use-ps-hide-on-scroll';
 export * from './hooks/use-ps-invisible-recaptcha';
 export * from './contexts/ps-layer-context';

package/dist/index.js

@@ -48,6 +48,7 @@ __exportStar(require("./hooks/use-ps-published-height"), exports);
 __exportStar(require("./constants/ps-scaled-preview-config"), exports);
 __exportStar(require("./constants/ps-site-header-config"), exports);
 __exportStar(require("./components/ps-skeleton"), exports);
+__exportStar(require("./services/ps-scroll-lock-service"), exports);
 __exportStar(require("./services/ps-skeleton-class-service"), exports);
 __exportStar(require("./models/ps-skeleton-size"), exports);
 __exportStar(require("./constants/ps-skeleton-shape"), exports);
@@ -61,7 +62,10 @@ __exportStar(require("./components/ps-spinner"), exports);
 __exportStar(require("./components/ps-theme-toggle"), exports);
 __exportStar(require("./components/ps-voice-orb"), exports);
 __exportStar(require("./hooks/use-ps-audio-spectrum"), exports);
+__exportStar(require("./hooks/use-ps-exit-snapshot"), exports);
 __exportStar(require("./hooks/use-ps-exit-transition"), exports);
+__exportStar(require("./hooks/use-ps-restore-focus"), exports);
+__exportStar(require("./hooks/use-ps-scroll-lock"), exports);
 __exportStar(require("./hooks/use-ps-hide-on-scroll"), exports);
 __exportStar(require("./hooks/use-ps-invisible-recaptcha"), exports);
 __exportStar(require("./contexts/ps-layer-context"), exports);

package/dist/services/ps-scroll-lock-service.d.ts

@@ -0,0 +1,5 @@
+export declare class PsScrollLockService {
+    private static count;
+    private static previousOverflow;
+    static lock(): () => void;
+}

package/dist/services/ps-scroll-lock-service.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PsScrollLockService = void 0;
+class PsScrollLockService {
+    static lock() {
+        if (typeof document === 'undefined')
+            return () => undefined;
+        if (PsScrollLockService.count === 0) {
+            PsScrollLockService.previousOverflow = document.body.style.overflow;
+            document.body.style.overflow = 'hidden';
+        }
+        PsScrollLockService.count += 1;
+        let isReleased = false;
+        return () => {
+            if (isReleased)
+                return;
+            isReleased = true;
+            PsScrollLockService.count -= 1;
+            if (PsScrollLockService.count === 0) {
+                document.body.style.overflow = PsScrollLockService.previousOverflow;
+            }
+        };
+    }
+}
+exports.PsScrollLockService = PsScrollLockService;
+PsScrollLockService.count = 0;
+PsScrollLockService.previousOverflow = '';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@pallasoft/ps-core-components",
-	"version": "2.24.0",
+	"version": "2.25.0",
 	"private": false,
 	"main": "./dist/index.js",
 	"module": "./dist/esm/index.js",