[FIX] various types problem

Author: nDriaDev

README.md

@@ -208,7 +208,7 @@ Go to [Demo](https://ndriadev.github.io/react-tools) to see and try all implemen
 
 A state management hook implemented on Publish-Subscribe pattern. It allows components to subscribe to state changes and receive updates whenever the state is modified, providing a scalable and decoupled state management solution.__N.B.: to work properly, objects like Set, Map, Date or more generally objects without _Symbol.iterator_ must be treated as immutable__. [See demo](https://ndriadev.github.io/react-tools/#/hooks/state/createPubSubStore)
 ```tsx
-createPubSubStore<T extends Record<string, unknown>, E extends Record<string, (store: T, ...args: any) => void>>(obj: T, mutatorsFn?: E, persist?: boolean): { getStore: () => T; mutateStore: (cb: (globStore: T) => void) => void; mutators: Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>, usePubSubStore: { (subscribe?: undefined): [T, (store: T | ((currStore: T) => T)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [C, (store: C | ((currStore: C) => C)) => void, () => C, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [T | C, (store: T | C | ((currStore: T) => T) | ((currStore: C) => C)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>] }}
+createPubSubStore<T extends object, E extends Record<string, (store: T, ...args: any) => void>>(obj: T, mutatorsFn?: E, persist?: boolean): { getStore: () => T; mutateStore: (cb: (globStore: T) => void) => void; mutators: Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>, usePubSubStore: { (subscribe?: undefined): [T, (store: T | ((currStore: T) => T)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [C, (store: C | ((currStore: C) => C)) => void, () => C, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [T | C, (store: T | C | ((currStore: T) => T) | ((currStore: C) => C)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>] }}
 ```
 
 ### useArray
@@ -313,7 +313,7 @@ useStateHistoryGetter<T>(initialState: T | (() => T), capacity: number | "no-lim
 
 Custom _useState_ hook that validates state on every update. [See demo](https://ndriadev.github.io/react-tools/#/hooks/state/useStateValidator)
 ```tsx
-useStateValidator<T>(initialState: T | (() => T), validator: StateValidator<T>): [T, Dispatch<SetStateAction<T>>, T extends Record<string, unknown> ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: string}]
+useStateValidator<T>(initialState: T | (() => T), validator: StateValidator<T>): [T, Dispatch<SetStateAction<T>>, T extends object ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: string}]
 ```
 
 ### useSyncExternalStore
@@ -795,7 +795,7 @@ useGeolocation({mode, locationOptions, onError}: { locationOptions?: PositionOpt
 
 Hook to invoke a callback when the browser is idle. Refer to [requestIdleCallback](https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback) in React. The __options__ parameter differs from _IdleRequestOptions_ type: it adds the possibility to pass another property __unsupportedBehavior__ to specify what do if requestIdleCallback is not supported. [See demo](https://ndriadev.github.io/react-tools/#/hooks/api-dom/useIdleCallback)
 ```tsx
-useIdleCallback(cb: (deadline?: IdleDeadline | DOMHighResTimeStamp | void) => void, opts?: {timeout: number , unsupportedBehavior?: "animationFrame" | "timeout" | "immediatly" }): [() => void, () => void]
+useIdleCallback(cb: (deadline?: IdleDeadline | DOMHighResTimeStamp | void) => void, opts?: {timeout: number , unsupportedBehavior?: "animationFrame" | "timeout" | "immediatly" }): [boolean, () => void, () => void]
 ```
 
 ### useInterval

apps/react-tools-demo/src/markdown/For.md

@@ -48,9 +48,9 @@ For = memo(<T extends unknown>({ of, children, filter, map, sort, elementKey, fa
 component properties object.
 > - __props.of__: _T[]_  
 array of elements.
-> - __props.elementKey?__: _T extends Record<string,unknown> ? keyof T|((item:T)=> string|number) : never_  
-if elements are objects, this prop is a key of the array elements or a function with one parameter which type is the type of the elements in __of__ prop and returns a string or a number, otherwise this prop is unsettable.
-> - __props.children__: _(item: T, index: T extends Record<string,unknown> ? number | T[keyof T] | string : number) => ReactNode_  
+> - __props.elementKey?__: _T extends object ? keyof T | ((item: T) => string | number) : string | number | ((item: T) => string | number)_  
+if the elements are objects, this prop is a key of the array elements or a function with one parameter which type is the type of the elements in __of__ prop and returns a string or a number, otherwise this prop can be the function described before, a string or a number.
+> - __props.children__: _(item: T, index: T extends object ? number | T[keyof T] | string : number) => ReactNode_  
 it's a function that takes the current item as first argument and optionally a second argument that is number if element of array aren't object, otherwise it can be a number or the value of the element key specified in the _elementKey_ prop.
 > - __props.fallback?__: _ReactNode_  
 optional element to render when _of_ prop is an empty array.

apps/react-tools-demo/src/markdown/createPubSubStore.md

@@ -81,12 +81,12 @@ export const CreatePubSubStore = () => {
 ## API
 
 ```tsx
-createPubSubStore<T extends Record<string, unknown>, E extends Record<string, (store: T, ...args: any) => void>>(obj: T, mutatorsFn?: E, persist?: boolean): { getStore: () => T; mutateStore: (cb: (globStore: T) => void) => void; mutators: Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>, usePubSubStore: { (subscribe?: undefined): [T, (store: T | ((currStore: T) => T)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [C, (store: C | ((currStore: C) => C)) => void, () => C, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [T | C, (store: T | C | ((currStore: T) => T) | ((currStore: C) => C)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>] }}
+createPubSubStore<T extends object, E extends Record<string, (store: T, ...args: any) => void>>(obj: T, mutatorsFn?: E, persist?: boolean): { getStore: () => T; mutateStore: (cb: (globStore: T) => void) => void; mutators: Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>, usePubSubStore: { (subscribe?: undefined): [T, (store: T | ((currStore: T) => T)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [C, (store: C | ((currStore: C) => C)) => void, () => C, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>]; <C>(subscribe?: (store: T) => C): [T | C, (store: T | C | ((currStore: T) => T) | ((currStore: C) => C)) => void, () => T, Record<keyof E, (...args: ExtractTail<Parameters<E[keyof E]>>) => void>] }}
 ```
 
 > ### Params
 >
-> - __obj__: _T extends Record<string, unknown>_  
+> - __obj__: _T extends object_  
 Object that rapresent the initialState of the store.
 > - __mutatorsFn?__: _E extends Record<string, (store: T, ...args: any) => void>_  
 Object that contains specified void function to mutate the store value, not the store itself, that receives the store as first parameter and other optional parameters.

apps/react-tools-demo/src/markdown/getBase64.md

@@ -9,7 +9,7 @@ getBase64<T>(target: string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImage
 
 > ### Params
 >
-> - __target__: _target: string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImageElement | T | T[]_
+> - __target__: _string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImageElement | T | T[]_
 > - __options?__: _ToDataURLOptions | UseBase64ObjectOptions<T>_
 >
 

apps/react-tools-demo/src/markdown/useBattery.md

@@ -10,7 +10,7 @@ export const UseBattery = () => {
 	return (<div style={{ textAlign: "center" }}>
 		{
 			Object.keys(status).map(el => (
-				<p key={el}>{el}: {status[el as keyof typeof status]}</p>
+				<p key={el}>{el}: {el === "isSupported" ? status.isSupported ? "Yes" : "No": status[el as keyof typeof status]}</p>
 			))
 		}
 	</div>)

apps/react-tools-demo/src/markdown/useIdleCallback.md

@@ -7,7 +7,7 @@ Hook to invoke a callback when the browser is idle. Refer to [requestIdleCallbac
 export const UseIdleCallback = () => {
 	const [iterations, setIterations] = useState(0);
 	const [log, setLog] = useState("");
-	const [invoke] = useIdleCallback(() => setLog("RequestIdleCallback executed"));
+	const [isSupported, invoke] = useIdleCallback(() => setLog("RequestIdleCallback executed"));
 
 	const start = async() => {
 		invoke();
@@ -20,6 +20,7 @@ export const UseIdleCallback = () => {
 		setIterations(0);
 	}
 	return (<div>
+		<p>Supported: {isSupported ? "Yes" : "No"}</p>
 		<p>Iterations are: {iterations}</p>
 		<p>Log is: {log}</p>
 		<button onClick={start}>START</button>
@@ -38,7 +39,7 @@ export const UseIdleCallback = () => {
 ## API
 
 ```tsx
-useIdleCallback(cb: (deadline?: IdleDeadline | DOMHighResTimeStamp | void) => void, opts?: {timeout: number , unsupportedBehavior?: "animationFrame" | "timeout" | "immediatly" }): [() => void, () => void]
+useIdleCallback(cb: (deadline?: IdleDeadline | DOMHighResTimeStamp | void) => void, opts?: {timeout: number , unsupportedBehavior?: "animationFrame" | "timeout" | "immediatly" }): [boolean, () => void, () => void]
 ```
 
 > ### Params
@@ -51,8 +52,11 @@ Contains optional configuration parameters.
 
 > ### Returns
 >
-> __result__: array where functions to invoke and cancel execution.
-> - __Array__:  
->     - _()=>void_  
->     - _()=>void_  
+> __result__:  __Array__:  
+    - _()=>void_  
+    - _()=>void_  
+> Array with three elements:
+> - first element: __isSupported__; boolean value that indicates if _requestIdleCallback_ is supported or not.
+> - second element: __invoke__: function to invoke execution.
+> - third element: __cancel__: function to cancel execution.
 >

apps/react-tools-demo/src/markdown/useStateValidator.md

@@ -47,7 +47,7 @@ export const UseStateValidator = () => {
 ## API
 
 ```tsx
-useStateValidator<T>(initialState: T | (() => T), validator: StateValidator<T>): [T, Dispatch<SetStateAction<T>>, T extends Record<string, unknown> ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: string}]
+useStateValidator<T>(initialState: T | (() => T), validator: StateValidator<T>): [T, Dispatch<SetStateAction<T>>, T extends object ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: string}]
 ```
 
 > ### Params
@@ -64,7 +64,7 @@ function that will be executed to validate state.
 > __} invalid__:  __Array__:  
     - _T_  
     - _Dispatch<SetStateAction<T>>_  
-    - _T extends Record<string, unknown> ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: strin_  
+    - _T extends object ? {[k in keyof T]:{invalid: boolean, message?: string}} : {invalid: boolean, message?: strin_  
 > Array with:
 > - first element: __state__ value.
 > - second element: __setState__ function to update state.

apps/react-tools-demo/src/pages/hooks/api-dom/useBattery/UseBattery.tsx

@@ -9,7 +9,7 @@ export const UseBattery = () => {
 	return (<div style={{ textAlign: "center" }}>
 		{
 			Object.keys(status).map(el => (
-				<p key={el}>{el}: {status[el as keyof typeof status]}</p>
+				<p key={el}>{el}: {el === "isSupported" ? status.isSupported ? "Yes" : "No": status[el as keyof typeof status]}</p>
 			))
 		}
 	</div>)

apps/react-tools-demo/src/pages/hooks/api-dom/useIdleCallback/UseIdleCallback.tsx

@@ -12,7 +12,7 @@ The component has:
 export const UseIdleCallback = () => {
 	const [iterations, setIterations] = useState(0);
 	const [log, setLog] = useState("");
-	const [invoke] = useIdleCallback(() => setLog("RequestIdleCallback executed"));
+	const [isSupported, invoke] = useIdleCallback(() => setLog("RequestIdleCallback executed"));
 
 	const start = async() => {
 		invoke();
@@ -25,6 +25,7 @@ export const UseIdleCallback = () => {
 		setIterations(0);
 	}
 	return (<div>
+		<p>Supported: {isSupported ? "Yes" : "No"}</p>
 		<p>Iterations are: {iterations}</p>
 		<p>Log is: {log}</p>
 		<button onClick={start}>START</button>