@ringcentral/spring-base 1.7.0 → 1.9.0

package/index.js

@@ -1,14 +1,15 @@
 export { configure, rcConfiguration } from './config.js';
 export { RcResponsiveContext, WindowContext, breakpointList, getMatchDetail, useResponsiveContext, useWindowContext } from './contexts.js';
-export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, visuallyHiddenStyles } from './hooks.js';
+export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useButton, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, useVirtuosoExternalWindow, visuallyHiddenStyles } from './hooks.js';
 export { unstable_ownerDocument as ownerDocument, unstable_useControlled as useControlled } from '@mui/utils';
 export { a11yKeyboard, capitalize, checkDefaultPrevented, checkElementName, clearWindowSelection, getSelectionPosition, getTitle, globalStateClasses, isDeleteKeyboardEvent, isSuiElement, isUrl, isWebKit154, omit, outerSize, pick, preloadImg, removeClassName, runKeyHandler, setSelectionPosition, useClasses } from './utils.js';
 export { a as ariaHideOutside, b as combineClasses, c as combineProps, g as getRefElement, i as isRef, l as logInDev, o as ownerWindow, t as twMerge } from './chunks/twMerge.js';
 import 'react';
 import 'lodash/uniqueId';
-import 'lodash/isPlainObject';
+import '@mui/base/useButton';
 import 'lodash/omit';
 import 'lodash/pick';
+import 'lodash/isPlainObject';
 import 'lodash/debounce';
 import 'lodash/noop';
 import 'lodash/throttle';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ringcentral/spring-base",
-  "version": "1.7.0",
+  "version": "1.9.0",
   "author": "RingCentral",
   "description": "Core utilities, hooks, and foundational functionality for Spring UI components, providing essential building blocks for React applications",
   "main": "./index.js",

package/src/config.d.ts

@@ -1,40 +1,15 @@
-declare type WarningFunctionType = ((
-/** warning message */
-message: string, 
-/** addition options with that warning */
-options?: {
+declare type WarningFunctionType = ((message: string, options?: {
     level: 'warn' | 'error';
 }) => void) | undefined;
 interface RcConfigurationType {
-    /** is ignore all warning show from spring */
     WARNING_IGNORE: boolean;
     WARNING_FUNCTION: WarningFunctionType;
 }
-/**
- * config global setting
- *
- * ```ts
- * configure({
- *   warning: false
- * })
- * ```
- * ## WARNING related method and  only work in `development mode`
- *
- * `WARNING_IGNORE`:  only work in `development mode`
- * `WARNING_FUNCTION` only work in `development mode`
- */
 declare let rcConfiguration: RcConfigurationType;
 declare type RcConfigure = {
-    /** is show warning message in development */
     warning?: boolean;
-    /** custom warning callback */
     warningFunction?: WarningFunctionType;
 };
-/**
- * set config with Spring
- *
- * ## WARNING method only work in `development mode`
- */
 export declare const configure: (options: RcConfigure) => void;
 export { rcConfiguration };
 export type { WarningFunctionType };

package/src/contexts/ResponsiveContext/breakpointList.d.ts

@@ -1,3 +1,2 @@
 import { Breakpoint } from './types';
-/** small to large */
 export declare const breakpointList: Breakpoint[];

package/src/contexts/ResponsiveContext/types.d.ts

@@ -1,7 +1,4 @@
 export declare type Breakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-/**
- * null is no match, it means small than XS
- */
 export declare type MatchedBreakpoint = Breakpoint | null;
 export declare type GTBreakpoint = 'gt-xs' | 'gt-sm' | 'gt-md' | 'gt-lg' | 'gt-xl';
 export declare type LTBreakpoint = 'lt-sm' | 'lt-md' | 'lt-lg' | 'lt-xl';
@@ -9,15 +6,7 @@ export declare type FullBreakpoint = GTBreakpoint | LTBreakpoint | Breakpoint;
 export declare type BreakpointMatchMap = Partial<Record<'gtXS' | 'gtSM' | 'gtMD' | 'gtLG' | 'gtXL' | 'ltSM' | 'ltMD' | 'ltLG' | 'ltXL' | FullBreakpoint, true>>;
 export declare type BreakpointMatchDetail = {
     matchBP: MatchedBreakpoint;
-    /**
-     * large to small
-     * example: [gtSM, gtXS]
-     */
     gtMatchGroup: GTBreakpoint[];
-    /**
-     * small to large
-     * example: [ltSM, ltLG]
-     */
     ltMatchGroup: LTBreakpoint[];
     matchMap: BreakpointMatchMap;
 };

package/src/hooks/index.d.ts

@@ -1,6 +1,7 @@
 export * from './useA11yKeyEvent';
 export * from './useActive';
 export * from './useAnnouncer';
+export * from './useButton';
 export * from './useAriaHideOutside';
 export * from './useAudio';
 export * from './useChange';
@@ -41,3 +42,4 @@ export * from './useTimeout';
 export * from './useTouchMouseEvent';
 export * from './useFontLoaded';
 export * from './useBodyScrollLock';
+export * from './useVirtuosoExternalWindow';

package/src/hooks/useA11yKeyEvent/useA11yKeyEvent.d.ts

@@ -1,23 +1,6 @@
 export declare type useA11yKeyEventOptions = {
-    /**
-     * that event should only trigger from target element, ignore all `propagation` events
-     */
     onlyOnFocus?: boolean;
-    /**
-     * is that need preventDefault when trigger `callBack`,
-     * @default true
-     */
     preventDefault?: boolean;
-    /**
-     * check point for `event.key`
-     *
-     * @default ['Enter', ' ']
-     */
     checkKeys?: string[];
 };
-/**
- * bind event with a11y keyboard, `space`, `enter`, only trigger when key includes in `checkKeys`
- *
- * that will auto preventDefault by default, if you don't want that, set `false` with `preventDefault`
- */
 export declare const useA11yKeyEvent: (fn?: ((e: any) => void) | undefined, { onlyOnFocus, preventDefault, checkKeys, }?: useA11yKeyEventOptions) => (event: React.KeyboardEvent<HTMLElement>) => void;

package/src/hooks/useActive/useActive.d.ts

@@ -1,22 +1,16 @@
-import { EventHandler, KeyboardEventHandler, SyntheticEvent } from 'react';
+import { EventHandler, KeyboardEventHandler, MouseEventHandler, SyntheticEvent } from 'react';
 export declare type UseActiveOptions = {
     onKeyDown?: KeyboardEventHandler;
     onKeyUp?: KeyboardEventHandler;
-    /**
-     * will receive keyboard event
-     */
+    onMouseDown?: MouseEventHandler;
     onClick?: EventHandler<SyntheticEvent>;
     disabled?: boolean;
 };
-/**
- * bind event with a11y keyboard, `space`. help not native button to implement `:active`
- *
- * that will auto preventDefault by default, if you don't want that, set `false` with `preventDefault`
- */
-export declare const useActive: ({ onKeyDown, onKeyUp, onClick, disabled, }?: UseActiveOptions) => {
+export declare const useActive: ({ onKeyDown, onKeyUp, onMouseDown, onClick, disabled, }?: UseActiveOptions) => {
     activeHandlers: {
         onKeyDown: KeyboardEventHandler<Element> | undefined;
         onKeyUp: KeyboardEventHandler<Element> | undefined;
+        onMouseDown: MouseEventHandler<Element> | undefined;
         onClick: ((event: SyntheticEvent<Element, Event>) => void) | undefined;
     };
     active: boolean;

package/src/hooks/useAnnouncer/useAnnouncer.d.ts

@@ -1,12 +1,2 @@
 export declare const visuallyHiddenStyles = "\n  clip-path: inset(100%);\n  clip: rect(1px, 1px, 1px, 1px);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n";
-/**
- * read announce when need read message.
- *
- * @example
- * ```ts
- *   const announce = useAnnouncer('simpleId');
- *
- *   announce(`You click "Announce" button`);
- * ```
- */
 export declare const useAnnouncer: (id?: string | undefined) => (message?: string | undefined) => void;

package/src/hooks/useAriaHideOutside/useAriaHideOutside.d.ts

@@ -4,9 +4,5 @@ export declare type UseAriaHideOutsideProps = {
 };
 export declare const useAriaHideOutside: (props?: UseAriaHideOutsideProps) => {
     ariaHideOutsideRef: import("react").RefObject<HTMLElement>;
-    /**
-     * Whether the `aria-hidden` attribute is being applied to outside elements.
-     * When true, elements outside the ref are hidden from screen readers.
-     */
     ariaHideEnabled: boolean;
 };

package/src/hooks/useAudio/useAudio.d.ts

@@ -1,21 +1 @@
-/**
- * get Browser `Audio` instance, and auto destroy when component be destroyed.
- *
- *
- * @param init a callback when you init that audio
- *
- * @example
- *
- * ```ts
- * const audio = useAudio((instance) => {
- *   instance.src = 'https://your.audio'
- * });
- *
- * const click = () => audio.play();
- *
- * click();
- * ```
- * @see stories {@link https://develop-rcui-int.fiji.gliprc.com/?path=/story/%F0%9F%94%A7-foundation-hooks-useaudio--simple-announcer 🔧-foundation-hooks-useaudio--simple-announcer}
- * @see {@link https://chromium-review.googlesource.com/c/chromium/src/+/2816118}
- */
 export declare const useAudio: (init?: ((audio: HTMLAudioElement) => void) | undefined) => HTMLAudioElement;

package/src/hooks/useBodyScrollLock/useBodyScrollLock.d.ts

@@ -1,25 +1,6 @@
 export interface UseBodyScrollLockOptions {
-    /**
-     * If true, disables the scroll lock
-     * @default false
-     */
     disabled?: boolean;
-    /**
-     * Reserve scrollbar gap to prevent layout shift
-     * @default true
-     */
     reserveScrollBarGap?: boolean;
-    /**
-     * Allow touch move on specific elements
-     */
     allowTouchMove?: (el: Element) => boolean;
 }
-/**
- * Hook to lock body scroll while allowing scroll on target element
- * Uses body-scroll-lock library for cross-platform compatibility
- *
- * @param isLocked - Whether scroll should be locked
- * @param targetElement - Element that should remain scrollable (optional)
- * @param options - Configuration options
- */
 export declare const useBodyScrollLock: (isLocked: boolean, targetElement?: HTMLElement | null | undefined, options?: UseBodyScrollLockOptions) => void;

package/src/hooks/useButton/index.d.ts

@@ -0,0 +1 @@
+export { useButton } from './useButton';

package/src/hooks/useButton/useButton.d.ts

@@ -0,0 +1,2 @@
+import { UseButtonParameters, UseButtonReturnValue } from '@mui/base/useButton';
+export declare function useButton(parameters: UseButtonParameters): UseButtonReturnValue;

package/src/hooks/useChange/useChange.d.ts

@@ -1,12 +1,2 @@
-/**
- * get value when prev listen value change
- * @param cb that method you want calculate to get value
- * @param listenCb prev compare listener value
- */
 export declare const useChange: <T, K>(cb: (prevValue: K | undefined, nextValue: K) => T, listenCb: () => K) => T;
-/**
- * get value when prev deps one of array value change
- * @param cb that method you want calculate to get value
- * @param deps prev compare value array
- */
 export declare const useDepsChange: <T, K extends any[]>(cb: (prevValue: K | undefined, nextValue: K) => T, deps: K) => T;

package/src/hooks/useClickAway/useClickAway.d.ts

@@ -1,18 +1,8 @@
 import { SyntheticEvent } from 'react';
 export declare type useClickAwayProps = {
-    /**
-     * If `true`, the React tree is ignored and only the DOM tree is considered.
-     * This prop changes how portaled elements are handled.
-     * @default false
-     */
     disableReactTree?: boolean;
     isEnabled?: boolean;
 };
-/**
- * @deprecated Use `ClickAwayListener` from `@mui/base` instead.
- *
- * @param onClickAway Callback fired when a "click away" event is detected.
- */
 export declare const useClickAway: (onClickAway: (event: MouseEvent | TouchEvent) => void, props?: useClickAwayProps) => {
     clickAwayRef: (instance: Element | null) => void;
     clickAwayHandler: {

package/src/hooks/useDebounce/useDebounce.d.ts

@@ -1,8 +1,2 @@
 import type { DebounceSettings } from 'lodash';
-/**
- * provide a debounce method for debounce method
- * @param fn method for debounce
- * @param debounceTime debounce timeout value, default is  `200`ms
- * @param options debounce setting, default is  `{trailing: true, leading: flase}`, detail see lodash
- */
 export declare const useDebounce: <F extends (...args: any[]) => any>(fn: F, debounceTime?: number, options?: DebounceSettings | undefined) => import("lodash").DebouncedFunc<F>;

package/src/hooks/useEventListener/useEventListener.d.ts

@@ -4,28 +4,8 @@ export declare type UseEventListenerAction = {
     remove: () => void;
 };
 export declare type UseEventListenerConfig = {
-    /**
-     * start listening when component mounted
-     *
-     * @default true
-     */
     startImmediately?: boolean;
 };
-/**
- * bind event when component mount and auto remove event when destroy.
- * can remove listener by call returned function or pass empty 'target'.
- *
- * @param target
- * listener will be removed when target is changed to null,
- * or rebinding to new element when `ref.current` change
- * @returns a method object
- * - listen() listen listener again, if that have listener, that will not listen again
- * - remove() remove listener
- * @example
- * ```ts
- * useEventListener(window, 'keyup', () => console.log('window key up'))
- * ```
- */
 export declare function useEventListener<T = Event>(target: RefOrElementOrCallback<EventTarget> | EventTarget | null | undefined, key: string, callback: (event: T) => void, options?: AddEventListenerOptions & UseEventListenerConfig): {
     listen: () => void;
     remove: () => void;

package/src/hooks/useEver/useEver.d.ts

@@ -1,13 +1 @@
-/**
- * that value ever to be `you want value`
- * Return true when the value ever to be `you want value` once.
- *
- * @example
- * ```ts
- * // once that isOpen is true, that result will always be `true`
- * const isEverOpen = useEver(isOpen);
- *
- * const isEverToBe2 = useEver(count, (val) => val === 2);
- * ```
- */
 export declare const useEver: <T>(value: T, targetValue?: (value: T) => boolean) => boolean;

package/src/hooks/useFocusVisible/useFocusVisible.d.ts

@@ -1,16 +1,10 @@
 import { FocusEventHandler, FocusEvent, Ref } from 'react';
 export declare type UseFocusVisibleOptions = {
-    /** invoke when focusVisiable or focusVisibleWithin is true */
     onFocusVisible?: FocusEventHandler;
     onFocus?: FocusEventHandler;
     onBlur?: FocusEventHandler;
     within?: boolean;
 };
-/**
- * bind event with a11y keyboard, `space`, `enter`, only trigger when key includes in `checkKeys`
- *
- * that will auto preventDefault by default, if you don't want that, set `false` with `preventDefault`
- */
 export declare const useFocusVisible: ({ onFocusVisible, onFocus, onBlur, within, }?: UseFocusVisibleOptions) => {
     focusVisibleHandlers: {
         onBlur: (event: FocusEvent) => void;

package/src/hooks/useFontLoaded/useFontLoaded.d.ts

@@ -1,13 +1 @@
-/**
- * Hook to detect when fonts are loaded
- *
- * This hook provides graceful degradation:
- * - When Font Loading API is not available (older browsers, SSR, test environments),
- *   it assumes fonts are loaded to prevent blocking UI
- * - When disabled, it immediately returns true without listening to font events
- * - When enabled and API is available, it listens for font loading completion
- *
- * @param enabled - Whether to listen for font loading events (default: true)
- * @returns boolean indicating whether fonts are loaded
- */
 export declare const useFontLoaded: (enabled?: boolean) => boolean;

package/src/hooks/useForceUpdate/useForceUpdate.d.ts

@@ -1,5 +1 @@
-/**
- * a method for trigger force update
- * @returns force update method
- */
 export declare function useForceUpdate(): () => void;

package/src/hooks/useForkRef/useForkRef.d.ts

@@ -1,19 +1,2 @@
 import { unstable_useForkRef as MuiUseForkRef } from '@mui/utils';
-/**
- * That method will give you ability fork same value `ref object` or `method`
- * Example:
- * ```ts
- * const refA = useRef();
- * const refB = useRef();
- *
- * const ref = useForkRef(refA, refB)
- *
- * useEffect(() => {
- *   console.log(refA); // get that current div dom
- *   console.log(refB); // also get that current div dom
- * },[])
- *
- * return <div ref={ref} />
- * ```
- */
 export declare const useForkRef: typeof MuiUseForkRef;

package/src/hooks/useGlobalListener/createGlobalListener.d.ts

@@ -1,55 +1,18 @@
 import { SyntheticEvent } from 'react';
 import { RefOrElementOrCallback } from '../../utils';
 export declare const globalListenerEventMap: Map<string, {
-    /**
-     * listener exec method
-     */
     exec: (e: any) => void;
-    /**
-     * all listener
-     */
     listeners: Set<(e: any) => void>;
 }>;
 export declare type CreateGlobalListenerConfig = {
-    /**
-     * custom key for determining different event group, default is same as `key`
-     */
     customKey?: string;
-    /**
-     * custom binding event target, default is `window`
-     */
     target?: RefOrElementOrCallback | EventTarget;
 };
-/**
- * create globalListener handler for share one listener event
- *
- * @example
- * ```ts
- * const globalListener = createGlobalListener('focus', () => { console.log('focus') });
- * const globalListener2 = createGlobalListener('focus', () => { console.log('focus') });
- * globalListener.listen();
- * globalListener2.listen();
- *
- * => // that will only create an event listener on window, but every callback will get emit value when event triggered
- * ```
- */
 export declare const createGlobalListener: <T extends SyntheticEvent<Element, Event>>(key: string, listener: (event?: T | undefined) => void, options?: boolean | AddEventListenerOptions | undefined, { customKey, target: targetProp, }?: CreateGlobalListenerConfig) => {
     listen: () => void;
-    /**
-     * remove listener
-     */
     remove: () => void;
-    /**
-     * current listener state
-     */
     readonly state: {
-        /**
-         * current listener state count
-         */
         readonly count: number;
-        /**
-         * is that be listening
-         */
         listening: boolean;
     };
 };

package/src/hooks/useGlobalListener/useGlobalListener.d.ts

@@ -2,11 +2,6 @@ import { SyntheticEvent } from 'react';
 import { createGlobalListener, CreateGlobalListenerConfig } from './createGlobalListener';
 declare type GlobalListener = ReturnType<typeof createGlobalListener>;
 export declare type UseGlobalListenerConfig = CreateGlobalListenerConfig & {
-    /**
-     * start listening when component mounted
-     *
-     * @default true
-     */
     startImmediately?: boolean;
 };
 export declare function useGlobalListener<T extends SyntheticEvent>(key: string, listener: (event?: T) => void, config?: UseGlobalListenerConfig): GlobalListener;

package/src/hooks/useHiddenTabindex/useHiddenTabindex.d.ts

@@ -1,8 +1,4 @@
 import { RefOrElementOrCallback } from '../../utils';
-/**
- * group hidden logic, when binding events element focus,
- * that hiddenRef will auto be `tabindex={-1}` *
- */
 export declare const useHiddenTabindex: <T extends HTMLElement>(target: RefOrElementOrCallback<T>) => {
     onFocus: () => void;
     onBlur: () => void;

package/src/hooks/useHover/useHover.d.ts

@@ -3,9 +3,6 @@ export declare type UseHoverOptions<E = HTMLElement> = {
     onMouseEnter?: MouseEventHandler<E>;
     onMouseLeave?: MouseEventHandler<E>;
     disabled?: boolean;
-    /**
-     * @default true
-     */
     disableReactTree?: boolean;
 };
 export declare const useHover: <E = HTMLElement>({ onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, disabled, disableReactTree, }?: UseHoverOptions<E>) => {

package/src/hooks/useId/useId.d.ts

@@ -1,15 +1 @@
-/**
- * Generates a unique ID.
- *
- * @param id - Default component id or prefix id.
- * @param prefixMode Whether enable prefix the ID with.
- * @returns unique ID
- * @example
- * useId() => 'spring-id-xxxx'
- * useId('') => 'spring-id-xxxx'
- * useId(null) => 'spring-id-xxxx'
- * useId(undefined) => 'spring-id-xxxx'
- * useId('nameId') => 'nameId'
- * useId('nameId', true) => 'nameId-xxxx'
- */
 export declare function useId(id?: string, prefixMode?: boolean): string;

package/src/hooks/useImgLoaded/useImgLoaded.d.ts

@@ -6,19 +6,5 @@ declare type UseImgLoadedProps = {
     referrerPolicy?: ComponentProps<'img'>['referrerPolicy'];
 };
 declare type LoadedState = false | 'loaded' | 'error';
-/**
- * get load state of an image by passing src or srcSet
- * - false: not load yet
- * - 'loaded': successfully loaded
- * - 'error': fail to load
- *
- * @example
- * ```ts
- * const loaded = useImgLoaded({
- *   src,
- *   srcSet,
- * });
- * ```
- */
 export declare const useImgLoaded: ({ crossOrigin, referrerPolicy, src, srcSet, }: UseImgLoadedProps) => LoadedState;
 export {};

package/src/hooks/useInterval/useInterval.d.ts

@@ -1,43 +1,6 @@
-/**
- * controllable interval, provide easy way to control interval
- *
- * - cancel: cancel current interval
- * - pause: pause current interval
- * - play: play current interval
- * - getRunning: return current interval running state
- *
- *  @example
- * ```ts
- * const { cancel, play, pause } = useInterval(() => {
- *    console.log('interval be triggered');
- * }, 1000)
- *
- * // get current run times
- * useInterval((times) => {
- *    console.log('current times start from 1', times);
- * }, 2000)
- *
- * // not start interval immediately
- * useInterval((times) => {
- *    console.log('current times start from 1', times);
- * }, 2000, false)
- * ```
- */
 export declare const useInterval: (callback: (times: number) => void, delay?: number, startImmediately?: boolean) => {
-    /**
-     * cancel current interval
-     */
     cancel: () => void;
-    /**
-     * pause current interval
-     */
     pause: () => void;
-    /**
-     * play current interval
-     */
     play: () => void;
-    /**
-     * return current interval running state
-     */
     getRunning: () => boolean;
 };

package/src/hooks/useKeyDownOnce/useKeyDownOnce.d.ts

@@ -3,12 +3,6 @@ export declare type UseKeyDownOnce<T> = {
     onKeyUp?: (e: React.KeyboardEvent<T>) => void;
     onKeyDown?: (e: React.KeyboardEvent<T>) => void;
 };
-/**
- * Provide user trigger `onKeyDown` only one time when hold press on key.
- * @param includeKeys that check include keys
- * @param methods trigger when first keydown or keyup
- * @returns
- */
 export declare const useKeyDownOnce: <T>(includeKeys: string[], { onKeyDown, onKeyUp }: UseKeyDownOnce<T>) => {
     onKeyDown: (e: import("react").KeyboardEvent<T>) => void;
     onKeyUp: (e: import("react").KeyboardEvent<T>) => void;

package/src/hooks/useKeyboardMoveFocus/moveIndexInTwoDimension.d.ts

@@ -1,18 +1,7 @@
 export declare type MoveIndexInTwoDimensionalOptions = {
-    /** current index */
     currIndex: number;
-    /** column number with that two dimensional */
     columns: number;
-    /** total number of items */
     total: number;
-    /**
-     * if that touch boundary, is that can move to next available infinite
-     *
-     * - when set value as `order`, that will increase or decrease when `ArrowLeft` or `ArrowRight` touch boundary
-     */
     infinite?: boolean | 'order';
 };
-/**
- * that can move index in column array
- */
 export declare function moveIndexInTwoDimension(direction: string, options: MoveIndexInTwoDimensionalOptions): number;

package/src/hooks/useKeyboardMoveFocus/useKeyboardMoveFocus.d.ts

@@ -1,49 +1,16 @@
 /// <reference types="react" />
 import { MoveIndexInTwoDimensionalOptions } from './moveIndexInTwoDimension';
 export declare type UseKeyboardMoveFocusParams<T> = {
-    /** current focused index `ref` */
     focusedIndexRef: React.MutableRefObject<number>;
-    /** action when index change */
     onFocusedIndexChange: (event: React.KeyboardEvent<HTMLElement>, index: number) => void;
-    /** children items */
     options: T[];
-    /** column number with that move block, default is `1` */
     columns?: number;
-    /**
-     * Used to determine the disabled state for a given option.
-     *
-     * @param {T} option The option to test.
-     * @returns {boolean}
-     */
     getOptionDisabled?: (option: T) => boolean;
-    /**
-     * Used to get option text for search focus by other text.
-     *
-     * @param {T} option
-     * @returns {string} that string for search
-     */
     getOptionSearchText?: (option: T) => string;
-    /**
-     * when typing search text, end this search debounce time
-     *
-     * @default 500
-     */
     endSearchDebounceTime?: number;
 } & Pick<MoveIndexInTwoDimensionalOptions, 'infinite'>;
-/**
- * use keyboard move index in two dimensional
- */
 export declare const useKeyboardMoveFocus: <T>({ infinite, options, focusedIndexRef, onFocusedIndexChange, getOptionDisabled, getOptionSearchText, columns, endSearchDebounceTime, }: UseKeyboardMoveFocusParams<T>) => {
-    /**
-     * Get previous focusable option(include current index).
-     */
     getPrevFocusableOption: (index?: number, isInfinite?: any) => number;
-    /**
-     * Get next focusable option(include current index).
-     */
     getNextFocusableOption: (index?: number, isInfinite?: any) => number;
-    /**
-     * Use to handle keyboard event.
-     */
     onKeyFocusedIndexHandle: (event: React.KeyboardEvent<any>) => void;
 };