@uxf/core-react 11.88.0 → 11.90.0

package/hooks/use-body-scroll-lock.d.ts

@@ -1,6 +1,6 @@
 import { BodyScrollOptions } from "@uxf/core/utils/body-scroll-lock";
 import { RefObject } from "react";
-export interface UseBodyScrollLockOptions extends BodyScrollOptions {
-    clearAllOnClose?: boolean;
+export interface UseBodyScrollLockOptions<E extends HTMLElement> extends BodyScrollOptions<E> {
+    willClearAllOnClose?: boolean;
 }
-export declare function useBodyScrollLock<T extends HTMLElement>(containerRef: RefObject<T | null>, isOpen: boolean, { allowTouchMove, clearAllOnClose, reserveScrollBarGap }?: Partial<UseBodyScrollLockOptions>): void;
+export declare function useBodyScrollLock<E extends HTMLElement = HTMLElement>(containerRef: RefObject<E | null>, isOpen: boolean, { allowTouchMove, willClearAllOnClose, willReserveScrollBarGap }?: Partial<UseBodyScrollLockOptions<E>>): void;

package/hooks/use-body-scroll-lock.js

@@ -2,33 +2,35 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useBodyScrollLock = useBodyScrollLock;
 const body_scroll_lock_1 = require("@uxf/core/utils/body-scroll-lock");
+const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
 const react_1 = require("react");
-function useBodyScrollLock(containerRef, isOpen, { allowTouchMove, clearAllOnClose, reserveScrollBarGap } = {}) {
+function useBodyScrollLock(containerRef, isOpen, { allowTouchMove, willClearAllOnClose, willReserveScrollBarGap } = {}) {
     (0, react_1.useEffect)(() => {
         const node = containerRef.current;
         if (isOpen && node) {
             (0, body_scroll_lock_1.disableBodyScroll)(node, {
                 allowTouchMove: allowTouchMove ||
                     ((element) => {
-                        var _a;
                         while (element !== document.body) {
                             if (element.getAttribute("data-body-scroll-lock-ignore") !== null) {
                                 return true;
                             }
-                            element = (_a = element.parentElement) !== null && _a !== void 0 ? _a : element;
+                            if ((0, is_not_nil_1.isNotNil)(element.parentElement)) {
+                                element = element.parentElement;
+                            }
                         }
                         return false;
                     }),
-                reserveScrollBarGap,
+                willReserveScrollBarGap,
             });
         }
         return () => {
             if (node) {
                 (0, body_scroll_lock_1.enableBodyScroll)(node);
             }
-            if (clearAllOnClose) {
+            if (willClearAllOnClose) {
                 (0, body_scroll_lock_1.clearAllBodyScrollLocks)();
             }
         };
-    }, [allowTouchMove, clearAllOnClose, containerRef, isOpen, reserveScrollBarGap]);
+    }, [allowTouchMove, willClearAllOnClose, containerRef, isOpen, willReserveScrollBarGap]);
 }

package/hooks/use-pagination.test.js

@@ -16,19 +16,19 @@ describe("usePagination Hook", () => {
         };
         const { result } = (0, react_1.renderHook)(() => (0, use_pagination_1.usePagination)(mockConfig));
         const paginationItems = result.current;
-        expect(paginationItems[0]).toBe("first");
-        expect(paginationItems[1]).toBe("previous");
-        expect(paginationItems[2]).toBe(1);
-        expect(paginationItems[3]).toBe(2);
-        expect(paginationItems[4]).toBe("start-ellipsis");
-        expect(paginationItems[5]).toBe(10);
-        expect(paginationItems[6]).toBe(11);
-        expect(paginationItems[7]).toBe(12);
-        expect(paginationItems[8]).toBe("end-ellipsis");
-        expect(paginationItems[9]).toBe(99);
-        expect(paginationItems[10]).toBe(100);
-        expect(paginationItems[11]).toBe("next");
-        expect(paginationItems[12]).toBe("last");
+        expect(paginationItems.at(0)).toBe("first");
+        expect(paginationItems.at(1)).toBe("previous");
+        expect(paginationItems.at(2)).toBe(1);
+        expect(paginationItems.at(3)).toBe(2);
+        expect(paginationItems.at(4)).toBe("start-ellipsis");
+        expect(paginationItems.at(5)).toBe(10);
+        expect(paginationItems.at(6)).toBe(11);
+        expect(paginationItems.at(7)).toBe(12);
+        expect(paginationItems.at(8)).toBe("end-ellipsis");
+        expect(paginationItems.at(9)).toBe(99);
+        expect(paginationItems.at(10)).toBe(100);
+        expect(paginationItems.at(11)).toBe("next");
+        expect(paginationItems.at(12)).toBe("last");
     });
     it("should return correct pagination items with hidden 'Previous' and 'Next' buttons", () => {
         const mockConfigHidePrevNext = {
@@ -43,16 +43,16 @@ describe("usePagination Hook", () => {
         };
         const { result } = (0, react_1.renderHook)(() => (0, use_pagination_1.usePagination)(mockConfigHidePrevNext));
         const paginationItems = result.current;
-        expect(paginationItems[0]).toBe("first");
-        expect(paginationItems[1]).toBe(1);
-        expect(paginationItems[2]).toBe(2);
-        expect(paginationItems[3]).toBe(3);
-        expect(paginationItems[4]).toBe(4);
-        expect(paginationItems[5]).toBe(5);
-        expect(paginationItems[6]).toBe(6);
-        expect(paginationItems[7]).toBe(7);
-        expect(paginationItems[8]).toBe("end-ellipsis");
-        expect(paginationItems[9]).toBe(20);
-        expect(paginationItems[10]).toBe("last");
+        expect(paginationItems.at(0)).toBe("first");
+        expect(paginationItems.at(1)).toBe(1);
+        expect(paginationItems.at(2)).toBe(2);
+        expect(paginationItems.at(3)).toBe(3);
+        expect(paginationItems.at(4)).toBe(4);
+        expect(paginationItems.at(5)).toBe(5);
+        expect(paginationItems.at(6)).toBe(6);
+        expect(paginationItems.at(7)).toBe(7);
+        expect(paginationItems.at(8)).toBe("end-ellipsis");
+        expect(paginationItems.at(9)).toBe(20);
+        expect(paginationItems.at(10)).toBe("last");
     });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/core-react",
-    "version": "11.88.0",
+    "version": "11.90.0",
     "description": "UXF Core",
     "author": "UX Fans s.r.o",
     "license": "MIT",
@@ -12,13 +12,13 @@
         "typecheck": "tsc --noEmit --skipLibCheck"
     },
     "dependencies": {
-        "@uxf/core": "11.88.0"
+        "@uxf/core": "11.90.0"
     },
     "peerDependencies": {
         "react": ">=18.2.0"
     },
     "devDependencies": {
-        "@types/react": "18.3.26",
+        "@types/react": "18.3.27",
         "react": "18.3.1"
     }
 }

package/swipeable/use-swipeable.js

@@ -46,9 +46,10 @@ function rotateXYByAngle(pos, angle) {
     if (angle === 0) {
         return pos;
     }
+    const [posX, posY] = pos;
     const angleInRadians = (Math.PI / 180) * angle;
-    const x = pos[0] * Math.cos(angleInRadians) + pos[1] * Math.sin(angleInRadians);
-    const y = pos[1] * Math.cos(angleInRadians) - pos[0] * Math.sin(angleInRadians);
+    const x = posX * Math.cos(angleInRadians) + posX * Math.sin(angleInRadians);
+    const y = posY * Math.cos(angleInRadians) - posY * Math.sin(angleInRadians);
     return [x, y];
 }
 function getHandlers(set, handlerProps) {
@@ -67,6 +68,7 @@ function getHandlers(set, handlerProps) {
                 // eslint-disable-next-line @typescript-eslint/no-use-before-define
                 document.addEventListener(mouseUp, onUp);
             }
+            // eslint-disable-next-line no-restricted-syntax
             const { clientX, clientY } = isTouch ? event.touches[0] : event;
             const xy = rotateXYByAngle([clientX, clientY], props.rotationAngle);
             (_a = props.onTouchStartOrOnMouseDown) === null || _a === void 0 ? void 0 : _a.call(props, { event });
@@ -93,9 +95,12 @@ function getHandlers(set, handlerProps) {
             if (event.timeStamp - state.start > props.swipeDuration) {
                 return state.swiping ? { ...state, swiping: false } : state;
             }
+            // eslint-disable-next-line no-restricted-syntax
             const { clientX, clientY } = isTouch ? event.touches[0] : event;
             const [x, y] = rotateXYByAngle([clientX, clientY], props.rotationAngle);
+            // eslint-disable-next-line no-restricted-syntax
             const deltaX = x - state.xy[0];
+            // eslint-disable-next-line no-restricted-syntax
             const deltaY = y - state.xy[1];
             const absX = Math.abs(deltaX);
             const absY = Math.abs(deltaY);
@@ -132,11 +137,11 @@ function getHandlers(set, handlerProps) {
             (_b = props.onSwiping) === null || _b === void 0 ? void 0 : _b.call(props, eventData);
             // track if a swipe is cancelable (handler for swiping or swiped(dir) exists)
             // so we can call preventDefault if needed
-            let cancelablePageSwipe = false;
+            let isCancelablePageSwipe = false;
             if (props.onSwiping || props.onSwiped || props[`onSwiped${dir}`]) {
-                cancelablePageSwipe = true;
+                isCancelablePageSwipe = true;
             }
-            if (cancelablePageSwipe && props.preventScrollOnSwipe && props.trackTouch && event.cancelable) {
+            if (isCancelablePageSwipe && props.preventScrollOnSwipe && props.trackTouch && event.cancelable) {
                 event.preventDefault();
             }
             return {
@@ -285,7 +290,6 @@ function updateTransientState(state, props, previousProps, attachTouch) {
     return state;
 }
 function useSwipeable(options) {
-    const { trackMouse } = options;
     const transientState = (0, react_1.useRef)({ ...initialState });
     const transientProps = (0, react_1.useRef)({
         ...defaultProps,
@@ -308,7 +312,7 @@ function useSwipeable(options) {
             transientProps.current[defaultKey] = defaultProps[defaultKey];
         }
     }
-    const [handlers, attachTouch] = (0, react_1.useMemo)(() => getHandlers((stateSetter) => (transientState.current = stateSetter(transientState.current, transientProps.current)), { trackMouse }), [trackMouse]);
+    const [handlers, attachTouch] = (0, react_1.useMemo)(() => getHandlers((stateSetter) => (transientState.current = stateSetter(transientState.current, transientProps.current)), { trackMouse: options.trackMouse }), [options.trackMouse]);
     transientState.current = updateTransientState(transientState.current, transientProps.current, previousProps.current, attachTouch);
     return handlers;
 }

package/translations/create-default-t.d.ts

@@ -1,2 +1,3 @@
+import { AnyObject } from "@uxf/core/types";
 import type { TranslationFunction } from "./types";
-export declare function createDefaultT(translationObject: Record<string, any>): TranslationFunction<any>;
+export declare function createDefaultT<Key extends string>(translationObject: AnyObject): TranslationFunction<Key>;

package/translations/create-default-t.js

@@ -1,17 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createDefaultT = createDefaultT;
+const is_nil_1 = require("@uxf/core/utils/is-nil");
 const replace_variables_1 = require("./replace-variables");
 const resolve_plural_key_1 = require("./resolve-plural-key");
 function createDefaultT(translationObject) {
     return function (key, options) {
+        var _a;
         const pckg = key.split(":");
-        const path = pckg[1].split(".");
+        const pckgName = pckg.at(0);
+        const path = (_a = pckg.at(1)) === null || _a === void 0 ? void 0 : _a.split(".");
         let translation = key;
         try {
-            // eslint-disable-next-line
-            // @ts-ignore
-            translation = path.reduce((acc, k) => acc[k], translationObject[pckg[0]]);
+            if ((0, is_nil_1.isNil)(pckgName)) {
+                throw new Error(`Cannot parse package name for key: "${key}"`);
+            }
+            if ((0, is_nil_1.isNil)(path)) {
+                throw new Error(`Cannot parse package package for key: "${key}"`);
+            }
+            translation = path.reduce((acc, k) => acc[k], translationObject[pckgName]);
             if (options) {
                 const pluralKey = (0, resolve_plural_key_1.resolvePluralKey)(options.count);
                 // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
@@ -21,9 +28,9 @@ function createDefaultT(translationObject) {
                 translation = (0, replace_variables_1.replaceVariables)(translation, options);
             }
         }
-        catch {
+        catch (err) {
             // eslint-disable-next-line no-console
-            console.warn(`Can't find translation for key: "${key}"`);
+            console.warn(typeof err === "string" ? err : `Can't find translation for key: "${key}"`);
         }
         return translation;
     };

package/translations/create-dev-t.d.ts

@@ -1,2 +1,3 @@
+import { AnyObject } from "@uxf/core/types";
 import type { SupportedLanguages, TranslationFunction } from "./types";
-export declare function createDevT(locale: SupportedLanguages, translationObject: Record<string, any>): TranslationFunction<any>;
+export declare function createDevT<Key extends string>(locale: SupportedLanguages, translationObject: AnyObject): TranslationFunction<Key>;

package/translations/create-dev-t.js

@@ -1,15 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createDevT = createDevT;
+const is_nil_1 = require("@uxf/core/utils/is-nil");
 const replace_variables_1 = require("./replace-variables");
 const resolve_plural_key_1 = require("./resolve-plural-key");
 function createDevT(locale, translationObject) {
     return function (key, options) {
+        var _a;
         const pckg = key.split(":");
-        const path = pckg[1].split(".");
-        // eslint-disable-next-line
-        // @ts-ignore
-        let translation = path.reduce((acc, k) => acc[k], translationObject[pckg[0]])[locale];
+        const pckgName = pckg.at(0);
+        const path = (_a = pckg.at(1)) === null || _a === void 0 ? void 0 : _a.split(".");
+        if ((0, is_nil_1.isNil)(pckgName)) {
+            throw new Error(`Cannot parse package name for key: "${key}"`);
+        }
+        if ((0, is_nil_1.isNil)(path)) {
+            throw new Error(`Cannot parse package package for key: "${key}"`);
+        }
+        let translation = path.reduce((acc, k) => acc[k], translationObject[pckgName])[locale];
         if (options) {
             const pluralKey = (0, resolve_plural_key_1.resolvePluralKey)(options.count);
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition

package/translations/index.js

@@ -4,7 +4,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TranslationsProvider = void 0;
 exports.useUxfTranslation = useUxfTranslation;
 const react_1 = require("react");
-const translationsContext = (0, react_1.createContext)((key) => key);
+/* intellisense and linting is broken with any other more specific type */
+const translationsContext = (0, react_1.createContext)((key) => key); // eslint-disable-line @typescript-eslint/no-explicit-any
 exports.TranslationsProvider = translationsContext.Provider;
 function useUxfTranslation() {
     return (0, react_1.useContext)(translationsContext);

package/translations/replace-variables.d.ts

@@ -1 +1,2 @@
-export declare function replaceVariables(translation: string, options: Record<string, any>): string;
+import { AnyObject } from "@uxf/core/types";
+export declare function replaceVariables(translation: string, options: AnyObject): string;

package/translations/types.d.ts

@@ -1,6 +1,7 @@
+import { AnyObject } from "@uxf/core/types";
 export type SupportedLanguages = "cs" | "sk" | "en" | "de";
 export type SupportedPluralKeywords = "0" | "zero" | "one" | "few" | "many" | "other";
-export type TranslationFunction<Key extends string> = (key: Key, options?: Record<string, any>) => string;
+export type TranslationFunction<Key extends string> = (key: Key, options?: AnyObject) => string;
 export type TranslationsContextValue<Keys extends string> = TranslationFunction<Keys>;
 type JoinDot<S1, S2> = S1 extends string ? S2 extends string ? S2 extends SupportedPluralKeywords | SupportedLanguages ? S1 : `${S1}.${S2}` : never : never;
 type JoinNamespace<NS, S> = NS extends string ? (S extends string ? `${NS}:${S}` : never) : never;