@uxf/core-react 11.31.0 → 11.33.0

package/components/hide.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hide = void 0;
+exports.Hide = Hide;
 const react_1 = __importDefault(require("react"));
 function Hide(props) {
     if (props.when) {
@@ -11,4 +11,3 @@ function Hide(props) {
     }
     return react_1.default.createElement(react_1.default.Fragment, null, props.children);
 }
-exports.Hide = Hide;

package/components/show.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Show = void 0;
+exports.Show = Show;
 const react_1 = __importDefault(require("react"));
 function Show(props) {
     if (!props.when) {
@@ -11,4 +11,3 @@ function Show(props) {
     }
     return react_1.default.createElement(react_1.default.Fragment, null, props.children);
 }
-exports.Show = Show;

package/hooks/_use-simulated-button.d.ts

@@ -6,9 +6,9 @@ interface Props<T extends HTMLElement> {
     onClick?: MouseEventHandler<T>;
     onKeyDown?: KeyboardEventHandler<T>;
     onKeyUp?: KeyboardEventHandler<T>;
-    submit?: boolean;
+    isSubmitType?: boolean;
 }
-export declare function _useSimulatedButton<T extends HTMLElement>({ analyticsCallback, isClickable, isHyperlink, onClick, onKeyDown, onKeyUp, submit, }: Props<T>): {
+export declare function _useSimulatedButton<T extends HTMLElement>({ analyticsCallback, isClickable, isHyperlink, onClick, onKeyDown, onKeyUp, isSubmitType, }: Props<T>): {
     onClick: MouseEventHandler<T>;
     onKeyDown: KeyboardEventHandler<T>;
     onKeyUp: KeyboardEventHandler<T>;

package/hooks/_use-simulated-button.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._useSimulatedButton = void 0;
+exports._useSimulatedButton = _useSimulatedButton;
 const react_1 = require("react");
-function _useSimulatedButton({ analyticsCallback, isClickable, isHyperlink, onClick, onKeyDown, onKeyUp, submit, }) {
+function _useSimulatedButton({ analyticsCallback, isClickable, isHyperlink, onClick, onKeyDown, onKeyUp, isSubmitType, }) {
     const _onClick = (0, react_1.useCallback)((e) => {
         var _a;
         if ((isClickable || isHyperlink) && analyticsCallback) {
             analyticsCallback();
         }
         if (isClickable) {
-            if (submit) {
+            if (isSubmitType) {
                 const closestForm = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.closest("form");
                 if (closestForm) {
                     closestForm.dispatchEvent(new Event("submit", { bubbles: true, cancelable: true }));
@@ -22,7 +22,7 @@ function _useSimulatedButton({ analyticsCallback, isClickable, isHyperlink, onCl
         else {
             e.preventDefault();
         }
-    }, [analyticsCallback, isClickable, isHyperlink, onClick, submit]);
+    }, [analyticsCallback, isClickable, isHyperlink, onClick, isSubmitType]);
     const _onKeyUp = (0, react_1.useCallback)((e) => {
         if (isClickable && (e.key === "Enter" || e.key === " ")) {
             e.target.dispatchEvent(new MouseEvent("click", {
@@ -46,4 +46,3 @@ function _useSimulatedButton({ analyticsCallback, isClickable, isHyperlink, onCl
     }, [isClickable, onKeyDown]);
     return { onClick: _onClick, onKeyDown: _onKeyDown, onKeyUp: _onKeyUp };
 }
-exports._useSimulatedButton = _useSimulatedButton;

package/hooks/use-anchor-props.d.ts

@@ -1,8 +1,8 @@
 import { AnchorHTMLAttributes } from "react";
 export interface UseAnchorProps {
     analyticsCallback?: () => void;
-    disabled?: boolean;
-    loading?: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
     type?: "submit";
 }
-export declare function useAnchorProps<T extends AnchorHTMLAttributes<HTMLAnchorElement>>({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, disabled, download, href, hrefLang, loading, media, onClick, onKeyDown, onKeyUp, ping, referrerPolicy, rel, role, tabIndex, target, type, ...restProps }: UseAnchorProps & T): T;
+export declare function useAnchorProps<T extends AnchorHTMLAttributes<HTMLAnchorElement>>({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, isDisabled, download, href, hrefLang, isLoading, media, onClick, onKeyDown, onKeyUp, ping, referrerPolicy, rel, role, tabIndex, target, type, ...restProps }: UseAnchorProps & T): T;

package/hooks/use-anchor-props.js

@@ -1,30 +1,31 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAnchorProps = void 0;
+exports.useAnchorProps = useAnchorProps;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
+const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
 const _use_simulated_button_1 = require("./_use-simulated-button");
-function useAnchorProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, disabled, download, href, hrefLang, loading, media, onClick, onKeyDown, onKeyUp, ping, referrerPolicy, rel, role, tabIndex, target, type, ...restProps }) {
-    const isBusy = loading ? loading : Boolean(ariaBusy);
-    const isDisabled = disabled ? disabled : Boolean(ariaDisabled);
-    const isBusyOrDisabled = isBusy || isDisabled;
-    const submit = type === "submit";
-    const isButton = submit || !!onClick;
+function useAnchorProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, isDisabled, download, href, hrefLang, isLoading, media, onClick, onKeyDown, onKeyUp, ping, referrerPolicy, rel, role, tabIndex, target, type, ...restProps }) {
+    const isBusy = Boolean(isLoading || ariaBusy);
+    const isDisabledOrAriaDisabled = Boolean(isDisabled || ariaDisabled);
+    const isBusyOrDisabled = isBusy || isDisabledOrAriaDisabled;
+    const isSubmitType = type === "submit";
+    const isButton = isSubmitType || (0, is_not_nil_1.isNotNil)(onClick);
     const tabIndexInteractive = isBusyOrDisabled ? -1 : tabIndex;
-    const _className = [isBusy && classes_1.CLASSES.IS_LOADING, disabled && classes_1.CLASSES.IS_DISABLED, className];
+    const _className = [isBusy && classes_1.CLASSES.IS_LOADING, isDisabledOrAriaDisabled && classes_1.CLASSES.IS_DISABLED, className];
     const simulatedButton = (0, _use_simulated_button_1._useSimulatedButton)({
         analyticsCallback,
         isClickable: !isBusyOrDisabled || isButton,
-        isHyperlink: !isBusyOrDisabled || !!href,
+        isHyperlink: !isBusyOrDisabled || Boolean(href),
         onClick,
         onKeyDown,
         onKeyUp,
-        submit,
+        isSubmitType,
     });
     if (href) {
         return {
             "aria-busy": isBusy,
-            "aria-disabled": isDisabled,
+            "aria-disabled": isDisabledOrAriaDisabled,
             className: (0, cx_1.cx)(classes_1.CLASSES.IS_HOVERABLE, ..._className),
             download,
             href,
@@ -45,7 +46,7 @@ function useAnchorProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabl
     if (isButton) {
         return {
             "aria-busy": isBusy,
-            "aria-disabled": isDisabled,
+            "aria-disabled": isDisabledOrAriaDisabled,
             className: (0, cx_1.cx)(classes_1.CLASSES.IS_HOVERABLE, ..._className),
             onClick: simulatedButton.onClick,
             onKeyDown: simulatedButton.onKeyDown,
@@ -62,4 +63,3 @@ function useAnchorProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabl
         ...restProps,
     };
 }
-exports.useAnchorProps = useAnchorProps;

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useBodyScrollLock = void 0;
+exports.useBodyScrollLock = useBodyScrollLock;
 const bodyScrollLock_1 = require("@uxf/core/utils/bodyScrollLock");
 const react_1 = require("react");
 function useBodyScrollLock(containerRef, isOpen, { allowTouchMove, clearAllOnClose, reserveScrollBarGap } = {}) {
@@ -32,4 +32,3 @@ function useBodyScrollLock(containerRef, isOpen, { allowTouchMove, clearAllOnClo
         };
     }, [allowTouchMove, clearAllOnClose, containerRef, isOpen, reserveScrollBarGap]);
 }
-exports.useBodyScrollLock = useBodyScrollLock;

package/hooks/use-button-props.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useButtonProps = void 0;
+exports.useButtonProps = useButtonProps;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = require("react");
@@ -56,4 +56,3 @@ function useButtonProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabl
         ...restProps,
     };
 }
-exports.useButtonProps = useButtonProps;

package/hooks/use-clickable-props.d.ts

@@ -1,8 +1,8 @@
 import { HTMLAttributes } from "react";
 export interface UseClickableProps {
     analyticsCallback?: () => void;
-    disabled?: boolean;
-    loading?: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
     type?: "submit";
 }
-export declare function useClickableProps<T extends HTMLAttributes<HTMLElement>>({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, disabled, loading, onClick, onKeyDown, onKeyUp, role, tabIndex, type, ...restProps }: UseClickableProps & T): T;
+export declare function useClickableProps<T extends HTMLAttributes<HTMLElement>>({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, isDisabled, isLoading, onClick, onKeyDown, onKeyUp, role, tabIndex, type, ...restProps }: UseClickableProps & T): T;

package/hooks/use-clickable-props.js

@@ -1,16 +1,17 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useClickableProps = void 0;
+exports.useClickableProps = useClickableProps;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
+const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
 const _use_simulated_button_1 = require("./_use-simulated-button");
-function useClickableProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, disabled, loading, onClick, onKeyDown, onKeyUp, role, tabIndex, type, ...restProps }) {
-    const isBusy = loading ? loading : Boolean(ariaBusy);
-    const isDisabled = disabled ? disabled : Boolean(ariaDisabled);
-    const isBusyOrDisabled = isBusy || isDisabled;
-    const submit = type === "submit";
-    const isButton = submit || !!onClick;
-    const _className = [isBusy && classes_1.CLASSES.IS_LOADING, isDisabled && classes_1.CLASSES.IS_DISABLED, className];
+function useClickableProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDisabled, analyticsCallback, className, isDisabled, isLoading, onClick, onKeyDown, onKeyUp, role, tabIndex, type, ...restProps }) {
+    const isBusy = Boolean(isLoading || ariaBusy);
+    const isDisabledOrAriaDisabled = Boolean(isDisabled || ariaDisabled);
+    const isBusyOrDisabled = isBusy || isDisabledOrAriaDisabled;
+    const isSubmitType = type === "submit";
+    const isButton = isSubmitType || (0, is_not_nil_1.isNotNil)(onClick);
+    const _className = [isBusy && classes_1.CLASSES.IS_LOADING, isDisabledOrAriaDisabled && classes_1.CLASSES.IS_DISABLED, className];
     const simulatedButton = (0, _use_simulated_button_1._useSimulatedButton)({
         analyticsCallback,
         isClickable: !isBusyOrDisabled || isButton,
@@ -18,18 +19,18 @@ function useClickableProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDis
         onClick,
         onKeyDown,
         onKeyUp,
-        submit,
+        isSubmitType,
     });
     if (isButton) {
         return {
             "aria-busy": isBusy,
-            "aria-disabled": isDisabled,
+            "aria-disabled": isDisabledOrAriaDisabled,
             className: (0, cx_1.cx)(classes_1.CLASSES.IS_HOVERABLE, ..._className),
             onClick: simulatedButton.onClick,
             onKeyDown: simulatedButton.onKeyDown,
             onKeyUp: simulatedButton.onKeyUp,
             role: role || "button",
-            tabIndex: isBusyOrDisabled ? -1 : tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0,
+            tabIndex: isBusyOrDisabled ? -1 : (tabIndex !== null && tabIndex !== void 0 ? tabIndex : 0),
             ...restProps,
         };
     }
@@ -40,4 +41,3 @@ function useClickableProps({ ["aria-busy"]: ariaBusy, ["aria-disabled"]: ariaDis
         ...restProps,
     };
 }
-exports.useClickableProps = useClickableProps;

package/hooks/use-focus-return.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusReturn = void 0;
+exports.useFocusReturn = useFocusReturn;
 const react_1 = require("react");
 const use_on_update_1 = require("./use-on-update");
 function useFocusReturn(opened, transitionDuration = 0, shouldReturnFocus = true) {
@@ -29,7 +29,6 @@ function useFocusReturn(opened, transitionDuration = 0, shouldReturnFocus = true
             clearTimeout(timeout);
             document.removeEventListener("keydown", clearFocusTimeout);
         };
-    }, [opened]);
+    }, [opened, shouldReturnFocus, transitionDuration]);
     return returnFocus;
 }
-exports.useFocusReturn = useFocusReturn;

package/hooks/use-focus-trap.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusTrap = void 0;
+exports.useFocusTrap = useFocusTrap;
 const react_1 = require("react");
 const use_on_unmount_1 = require("./use-on-unmount");
 const TABBABLE_NODES = /input|select|textarea|button|object/;
@@ -143,4 +143,3 @@ function useFocusTrap(active = true) {
     (0, use_on_unmount_1.useOnUnmount)(() => clearTimeout(timer.current));
     return setRef;
 }
-exports.useFocusTrap = useFocusTrap;

package/hooks/use-input-focus.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useInputFocus = void 0;
+exports.useInputFocus = useInputFocus;
 const react_1 = require("react");
 function useInputFocus(focusRef, onBlur, onFocus) {
     const [focused, setFocused] = (0, react_1.useState)(false);
@@ -24,4 +24,3 @@ function useInputFocus(focusRef, onBlur, onFocus) {
     }, [onBlur]);
     return { focused, focus, onBlur: _onBlur, onFocus: _onFocus };
 }
-exports.useInputFocus = useInputFocus;

package/hooks/use-is-mounted.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useIsMounted = void 0;
+exports.useIsMounted = useIsMounted;
 const react_1 = require("react");
 function useIsMounted() {
     const [isMounted, setIsMounted] = (0, react_1.useState)(false);
     (0, react_1.useEffect)(() => setIsMounted(true), []);
     return isMounted;
 }
-exports.useIsMounted = useIsMounted;

package/hooks/use-key.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useKey = void 0;
+exports.useKey = useKey;
 const react_1 = require("react");
 const createKeyPredicate = (keyFilter) => typeof keyFilter === "function"
     ? keyFilter
@@ -25,4 +25,3 @@ function useKey(keyFilter, callback, { disabled, targetRef, type = "keydown" } =
         };
     }, [callback, disabled, keyFilter, targetRef, type]);
 }
-exports.useKey = useKey;

package/hooks/use-latest.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function useLatest<T>(current: T): import("react").MutableRefObject<T>;

package/hooks/use-latest.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLatest = void 0;
+exports.useLatest = useLatest;
 const react_1 = require("react");
 function useLatest(current) {
     const storedValue = (0, react_1.useRef)(current);
     storedValue.current = current;
     return storedValue;
 }
-exports.useLatest = useLatest;

package/hooks/use-min-window-width.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMinWindowWidth = void 0;
+exports.useMinWindowWidth = useMinWindowWidth;
 const react_1 = require("react");
 const use_raf_state_1 = require("./use-raf-state");
 function useMinWindowWidth(minWidth, debounce = 0) {
@@ -26,4 +26,3 @@ function useMinWindowWidth(minWidth, debounce = 0) {
     }, [debounce, minWidth, setState]);
     return state;
 }
-exports.useMinWindowWidth = useMinWindowWidth;

package/hooks/use-mouse-drag-to-scroll.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMouseDragToScroll = void 0;
+exports.useMouseDragToScroll = useMouseDragToScroll;
 const react_1 = require("react");
 function useMouseDragToScroll(containerRef) {
     const position = (0, react_1.useRef)({ left: 0, top: 0, x: 0, y: 0 });
@@ -36,4 +36,3 @@ function useMouseDragToScroll(containerRef) {
     }, [containerRef]);
     return style;
 }
-exports.useMouseDragToScroll = useMouseDragToScroll;

package/hooks/use-on-mount.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useOnMount = void 0;
+exports.useOnMount = useOnMount;
 const react_1 = require("react");
 function useOnMount(effect) {
     (0, react_1.useEffect)(() => {
         return effect();
     }, []); // eslint-disable-line react-hooks/exhaustive-deps
 }
-exports.useOnMount = useOnMount;

package/hooks/use-on-unmount.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useOnUnmount = void 0;
+exports.useOnUnmount = useOnUnmount;
 const react_1 = require("react");
 function useOnUnmount(effect) {
     const effectRef = (0, react_1.useRef)(effect);
@@ -12,4 +12,3 @@ function useOnUnmount(effect) {
         };
     }, []);
 }
-exports.useOnUnmount = useOnUnmount;

package/hooks/use-on-update.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useOnUpdate = void 0;
+exports.useOnUpdate = useOnUpdate;
 const react_1 = require("react");
 function useOnUpdate(effect, deps) {
     const firstRun = (0, react_1.useRef)(true);
@@ -12,4 +12,3 @@ function useOnUpdate(effect, deps) {
         return effect();
     }, deps); // eslint-disable-line react-hooks/exhaustive-deps
 }
-exports.useOnUpdate = useOnUpdate;

package/hooks/use-previous.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
 export declare function usePrevious<T>(current: T): import("react").MutableRefObject<T>;

package/hooks/use-previous.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePrevious = void 0;
+exports.usePrevious = usePrevious;
 const react_1 = require("react");
 function usePrevious(current) {
     const storedValue = (0, react_1.useRef)(current);
@@ -9,4 +9,3 @@ function usePrevious(current) {
     });
     return storedValue;
 }
-exports.usePrevious = usePrevious;

package/hooks/use-raf-state.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useRafState = void 0;
+exports.useRafState = useRafState;
 const react_1 = require("react");
 const use_on_unmount_1 = require("./use-on-unmount");
 function useRafState(initialState) {
@@ -15,4 +15,3 @@ function useRafState(initialState) {
     (0, use_on_unmount_1.useOnUnmount)(() => cancelAnimationFrame(frame.current));
     return [state, setRafState];
 }
-exports.useRafState = useRafState;

package/hooks/use-window-scroll.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWindowScroll = void 0;
+exports.useWindowScroll = useWindowScroll;
 const react_1 = require("react");
 const use_raf_state_1 = require("./use-raf-state");
 function useWindowScroll() {
@@ -19,4 +19,3 @@ function useWindowScroll() {
     }, [setState]);
     return state;
 }
-exports.useWindowScroll = useWindowScroll;

package/hooks/use-window-size.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useWindowSize = void 0;
+exports.useWindowSize = useWindowSize;
 const react_1 = require("react");
 const use_raf_state_1 = require("./use-raf-state");
 function useWindowSize() {
@@ -16,4 +16,3 @@ function useWindowSize() {
     }, [setState]);
     return state;
 }
-exports.useWindowSize = useWindowSize;

package/package.json

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

package/utils/compose-refs.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.composeRefs = void 0;
+exports.composeRefs = composeRefs;
 function composeRefs(...refs) {
     return (value) => refs.forEach((ref) => {
         if (!ref) {
@@ -13,4 +13,3 @@ function composeRefs(...refs) {
         ref.current = value;
     });
 }
-exports.composeRefs = composeRefs;