@purr-core/hooks.focus-with-callback 0.0.8 → 0.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1 -0
- package/dist/index.d.cts +39 -0
- package/dist/index.d.ts +39 -0
- package/dist/index.js +1 -0
- package/package.json +1 -1
package/dist/index.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
'use strict';var react=require('react');var F=({onFocus:n,onBlur:o,focused:l=false,disabled:e=false})=>{let[s,u]=react.useState(l),a=react.useCallback(t=>{e||(n?.(t),u(true));},[e,n]),r=react.useCallback(t=>{e||(o?.(t),u(false));},[e,o]);return {captureOnFocus:a,captureOnBlur:r,isFocused:s}},f=F;module.exports=f;
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { FocusEventHandler, FocusEvent } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* The props for the useFocusWithCallback hook.
|
|
5
|
+
*
|
|
6
|
+
* @interface IFocusWithCallbackProps
|
|
7
|
+
* @property {FocusEventHandler<HTMLElement>} onFocus - The callback function to be called when the element is focused.
|
|
8
|
+
* @property {FocusEventHandler<HTMLElement>} onBlur - The callback function to be called when the element is blurred.
|
|
9
|
+
* @property {boolean} [focused=false] - The initial focused state of the element.
|
|
10
|
+
* @property {boolean} [disabled=false] - The disabled state of the element.
|
|
11
|
+
*/
|
|
12
|
+
interface IFocusWithCallbackProps {
|
|
13
|
+
onFocus: FocusEventHandler<HTMLElement> | undefined;
|
|
14
|
+
onBlur: FocusEventHandler<HTMLElement> | undefined;
|
|
15
|
+
focused?: boolean;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* The return type of the useFocusWithCallback hook.
|
|
20
|
+
*
|
|
21
|
+
* @interface IFocusWithCallbackReturnType
|
|
22
|
+
* @property {function} captureOnFocus - The function to capture the focus event.
|
|
23
|
+
* @property {function} captureOnBlur - The function to capture the blur event.
|
|
24
|
+
* @property {boolean} isFocused - The focused state of the element.
|
|
25
|
+
*/
|
|
26
|
+
interface IFocusWithCallbackReturnType {
|
|
27
|
+
captureOnFocus: (e: FocusEvent<HTMLElement, Element>) => void;
|
|
28
|
+
captureOnBlur: (e: FocusEvent<HTMLElement, Element>) => void;
|
|
29
|
+
isFocused: boolean;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* A hook that captures the focus and blur events of an element and calls the callback functions.
|
|
33
|
+
*
|
|
34
|
+
* @param {IFocusWithCallbackProps} props - The props for the hook.
|
|
35
|
+
* @returns {IFocusWithCallbackReturnType} The return value of the hook.
|
|
36
|
+
*/
|
|
37
|
+
declare const useFocusWithCallback: ({ onFocus, onBlur, focused, disabled, }: IFocusWithCallbackProps) => IFocusWithCallbackReturnType;
|
|
38
|
+
|
|
39
|
+
export { useFocusWithCallback as default };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { FocusEventHandler, FocusEvent } from 'react';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* The props for the useFocusWithCallback hook.
|
|
5
|
+
*
|
|
6
|
+
* @interface IFocusWithCallbackProps
|
|
7
|
+
* @property {FocusEventHandler<HTMLElement>} onFocus - The callback function to be called when the element is focused.
|
|
8
|
+
* @property {FocusEventHandler<HTMLElement>} onBlur - The callback function to be called when the element is blurred.
|
|
9
|
+
* @property {boolean} [focused=false] - The initial focused state of the element.
|
|
10
|
+
* @property {boolean} [disabled=false] - The disabled state of the element.
|
|
11
|
+
*/
|
|
12
|
+
interface IFocusWithCallbackProps {
|
|
13
|
+
onFocus: FocusEventHandler<HTMLElement> | undefined;
|
|
14
|
+
onBlur: FocusEventHandler<HTMLElement> | undefined;
|
|
15
|
+
focused?: boolean;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* The return type of the useFocusWithCallback hook.
|
|
20
|
+
*
|
|
21
|
+
* @interface IFocusWithCallbackReturnType
|
|
22
|
+
* @property {function} captureOnFocus - The function to capture the focus event.
|
|
23
|
+
* @property {function} captureOnBlur - The function to capture the blur event.
|
|
24
|
+
* @property {boolean} isFocused - The focused state of the element.
|
|
25
|
+
*/
|
|
26
|
+
interface IFocusWithCallbackReturnType {
|
|
27
|
+
captureOnFocus: (e: FocusEvent<HTMLElement, Element>) => void;
|
|
28
|
+
captureOnBlur: (e: FocusEvent<HTMLElement, Element>) => void;
|
|
29
|
+
isFocused: boolean;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* A hook that captures the focus and blur events of an element and calls the callback functions.
|
|
33
|
+
*
|
|
34
|
+
* @param {IFocusWithCallbackProps} props - The props for the hook.
|
|
35
|
+
* @returns {IFocusWithCallbackReturnType} The return value of the hook.
|
|
36
|
+
*/
|
|
37
|
+
declare const useFocusWithCallback: ({ onFocus, onBlur, focused, disabled, }: IFocusWithCallbackProps) => IFocusWithCallbackReturnType;
|
|
38
|
+
|
|
39
|
+
export { useFocusWithCallback as default };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import {useState,useCallback}from'react';var F=({onFocus:n,onBlur:o,focused:l=false,disabled:e=false})=>{let[s,u]=useState(l),a=useCallback(t=>{e||(n?.(t),u(true));},[e,n]),r=useCallback(t=>{e||(o?.(t),u(false));},[e,o]);return {captureOnFocus:a,captureOnBlur:r,isFocused:s}},f=F;export{f as default};
|