@ndriadev/react-tools/dist/utils.d.ts

A React library of hooks, components, utils and types ready to use

import { ComponentType } from 'react';
import { KeyboardEvent as KeyboardEvent_2 } from 'react';
import { LazyExoticComponent } from 'react';
import { SyntheticEvent } from 'react';

/**
 * **`alphanumericCompare`**: Function which, given two strings, the type of comparison to be verified, and optional options, performs the comparison between the two strings and returns a boolean indicating whether the indicated comparison is respected or not. [See demo](https://react-tools.ndria.dev/#/utils/alphanumericCompare)
 * @param {Object} param - object
 * @param {string} param.string1 - first string to compare.
 * @param {string} param.string2 - second string to compare.
 * @param {"<" | ">" | "=" | ">=" | "<="} [param.compareType] - type of compare to verify.
 * @param {Intl.LocalesArgument} [param.locales] - A string with a BCP 47 language tag or an Intl.Locale instance, or an array of such locale identifiers. The runtime's default locale is used when undefined is passed or when none of the specified locale identifiers is supported.
 * @param {Intl.CollatorOptions} [param.opts] - An object adjusting the output format. Corresponds to the options parameter of the Intl.Collator() constructor.
 * @returns {boolean|number} result - boolean or number that indicates whether the indicated comparison is respected or not.
 */
export declare function alphanumericCompare({ string1, string2, compareType, locales, opts }: {
    string1: string;
    string2: string;
    compareType?: undefined;
    locales?: Intl.LocalesArgument;
    opts?: Intl.CollatorOptions;
}): number;

export declare function alphanumericCompare({ string1, string2, compareType, locales, opts }: {
    string1: string;
    string2: string;
    compareType?: "<" | ">" | "=" | ">=" | "<=";
    locales?: Intl.LocalesArgument;
    opts?: Intl.CollatorOptions;
}): boolean;

/**
 * **`changeStringCase`**: Function that given a string, a case type, and an optional delimiter, returns the string in the specified case or empty string. [See demo](https://react-tools.ndria.dev/#/utils/changeStringCase)
 * @param {Object} param - object
 * @param {string|undefined} [param.string] - string to the which change case.
 * @param {"pascalCase" | "snakeCase" | "kebabCase" | "camelCase"} param.caseType - selected case to change string.
 * @param {"upperCase" | "lowerCase" | string} [param.delemiter] - optional delemiter for case that support it.
 * @returns {string} result - string with changed case or empty string.
 */
export declare function changeStringCase({ string, caseType, delimiter }: {
    string?: string;
    caseType: "pascalCase" | "snakeCase" | "kebabCase" | "camelCase";
    delimiter?: "upperCase" | "lowerCase" | string;
}): string;

/**
 * **`clickElementOnKeydownEvent`**: Function which, given a triggering code, executes _click_ on element when a keyDown event with triggering code is executed. [See demo](https://react-tools.ndria.dev/#/utils/clickElementOnKeydownEvent)
 * @param {codeTriggering: KeyboardEventCode} codeTriggering
     * @returns {(e: KeyboardEvent) => void}
     */
 export declare function clickElementOnKeydownEvent(codeTriggering: KeyboardEventCode): ((e: KeyboardEvent) => void);

 /**
  * **`defaultSerializer`**: Function to serialize any type of value. [See demo](https://react-tools.ndria.dev/#/utils/defaultSerializer)
  * @param {T} target
  * @returns {string}
  */
 export declare function defaultSerializer<T>(target: T): string;

 /**
  * **`detectBrowser`**: It detects used browser or return __"No detection"__. [See demo](https://react-tools.ndria.dev/#/utils/detectBrowser)
  * @returns {"chrome"|"firefox"|"safari"|"opera"|"edge"|"No detection"} result
  */
 export declare function detectBrowser(): "chrome" | "firefox" | "safari" | "opera" | "edge" | "No detection";

 /**
  * **`getBase64`**: Function to obtain a Base64 from value specified if supported, otherwise throw an Error. [See demo](https://react-tools.ndria.dev/#/utils/getBase64)
  * @param {string | Blob | ArrayBuffer | HTMLCanvasElement | HTMLImageElement | T | T[]} target
  * @param {ToDataURLOptions | UseBase64ObjectOptions<T>} [options]
  * @returns {string}
  */
 export declare function getBase64(target: string, options?: undefined): Promise<string>;

 export declare function getBase64(target: Blob, options?: undefined): Promise<string>;

 export declare function getBase64(target: ArrayBuffer, options?: undefined): Promise<string>;

 export declare function getBase64(target: HTMLCanvasElement, options?: ToDataURLOptions): Promise<string>;

 export declare function getBase64(target: HTMLImageElement, options?: ToDataURLOptions): Promise<string>;

 export declare function getBase64<T extends object>(target: T, options?: UseBase64ObjectOptions<T>): Promise<string>;

 export declare function getBase64<T extends Map<string, unknown>>(target: T, options?: UseBase64ObjectOptions<T>): Promise<string>;

 export declare function getBase64<T extends Set<unknown>>(target: T, options?: UseBase64ObjectOptions<T>): Promise<string>;

 export declare function getBase64<T>(target: T[], options?: UseBase64ObjectOptions<T[]>): Promise<string>;

 /**
  * **`getKeyObjectFromValue`**: Function that given an object and a value, returns the corrispondent key of this value or undefined. [See demo](https://react-tools.ndria.dev/#/utils/getKeyObjectFromValue)
  * @param {Record<string,unknown>} object - object from which get key by a value.
  * @param {unknown} value - value of the object
  * @returns {keyof Record<string,unknown>|undefined} key - object key for the given value.
  */
 export declare function getKeyObjectFromValue<T extends Record<string, unknown>, E extends string | number | symbol = keyof T>(object: T, value?: unknown): E | undefined;

 /**
  * **`getObjectFromDottedString`**: Function that, given a path, a value and an optional object, returns an object with as many properties as there are in the path, assigning the value passed to the last one specified. [See demo](https://react-tools.ndria.dev/#/utils/getObjectFromDottedString)
  * @param {string} path - string value separated by dot, indicating that path where assign the passed value.
  * @param {unknown} value - value to assign to the property specified in path.
  * @param {Record<string,unknown>} [object] - optional object that will be used as start object.
  * @returns {Record<string, unknown>} result - object create by path and value indicated.
  */
 export declare function getObjectFromDottedString<T, E extends Record<string, unknown>>(path: string, value: T, object?: E): E;

 /**
  * **`hotKeyHandler`**: utility function for _onKeyDown_ and _onKeyUp_ events handler that supports keys combination. [See demo](https://react-tools.ndria.dev/#/utils/hotKeyHandler)
  * @param {`${string}` | `${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${string}` | `${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${string}`} hotKeys - hotKey string: _ctrlCommand_ indicates to listen __Ctrl__ (on Windows) or __Command__ (on Mac) keys.
  * @param {(evt: KeyboardEvent|React.KeyboardEvent<HTMLElement>) => void | Promise<void>} listener - listener to be executed on specified event
  * @returns {(evt: KeyboardEvent|React.KeyboardEvent<HTMLElement>) => void}
  */
 export declare const hotKeyHandler: (hotKeys: `${string}` | `${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${string}` | `${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${'alt' | 'ctrl' | 'meta' | 'shift' | 'ctrlCommand'}+${string}`, listener: (evt: KeyboardEvent | KeyboardEvent_2<HTMLElement>) => void | Promise<void>) => (evt: KeyboardEvent | KeyboardEvent_2<HTMLElement>) => void;

 /**
  * **`isAsync`**: It detects if a function is asynchronous. [See demo](https://react-tools.ndria.dev/#/utils/isAsync)
  * @param {(...args: unknown[])=> unknown | Promise<unknown>} fn
  * @returns {boolean} result
  */
 export declare const isAsync: <T extends unknown[], E = unknown>(fn: E | Promise<E> | ((...args: T) => E | Promise<E>)) => boolean;

 /**
  * **`isClient`**: It detects if code is running on client. [See demo](https://react-tools.ndria.dev/#/utils/isClient)
  * @returns {boolean} result
  */
 export declare const isClient: () => boolean;

 /**
  * __`isDeepEqual`__: It returns true if the params are equal in depth. [See demo](https://react-tools.ndria.dev/#/utils/isDeepEqual)
  * @param {unknown} objA
  * @param {unknown} objB
  * @param {WeakMap} [map=new WeakMap()]
  * @returns {boolean} result
  */
 export declare const isDeepEqual: (objA: unknown, objB: unknown, map?: WeakMap<WeakKey, any>) => boolean;

 /**
  * __`isMouseEvent`__: It returns true if the event param is of MouseEvent type. [See demo](https://react-tools.ndria.dev/#/utils/isMouseEvent)
  * @param {SyntheticEvent} event
  * @returns {boolean} result
  */
 export declare const isMouseEvent: (event: SyntheticEvent) => boolean;

 /**
  * **`isShallowEqual`**: It returns true if the params are equal until first level depth. [See demo](https://react-tools.ndria.dev/#/utils/isShallowEqual)
  * @param {unknown} objA
  * @param {unknown} objB
  * @returns {boolean} result
  */
 export declare const isShallowEqual: (objA: unknown, objB: unknown) => boolean;

 /**
  * __`isTouchEvent`__: It returns true if the event param is of TouchEvent type. [See demo](https://react-tools.ndria.dev/#/utils/isTouchEvent)
  * @param {SyntheticEvent} event
  * @returns {boolean} result
  */
 export declare const isTouchEvent: (event: SyntheticEvent | Event) => boolean;

 /**
  * Utility type for __`Keyboard Event Code`__
  */
 declare type KeyboardEventCode = "Escape" | "Digit1" | "Digit2" | "Digit3" | "Digit4" | "Digit5" | "Digit6" | "Digit7" | "Digit8" | "Digit9" | "Digit0" | "Minus" | "Equal" | "Backspace" | "Tab" | "KeyQ" | "KeyW" | "KeyE" | "KeyR" | "KeyT" | "KeyY" | "KeyU" | "KeyI" | "KeyO" | "KeyP" | "BracketLeft" | "BracketRight" | "Enter" | "ControlLeft" | "KeyA" | "KeyS" | "KeyD" | "KeyF" | "KeyG" | "KeyH" | "KeyJ" | "KeyK" | "KeyL" | "Semicolon" | "Quote" | "Backquote" | "ShiftLeft" | "Backslash" | "KeyZ" | "KeyX" | "KeyC" | "KeyV" | "KeyB" | "KeyN" | "KeyM" | "Comma" | "Period" | "Slash" | "ShiftRight" | "NumpadMultiply" | "AltLeft" | "Space" | "CapsLock" | "F1" | "F2" | "F3" | "F4" | "F5" | "F6" | "F7" | "F8" | "F9" | "F10" | "Pause" | "ScrollLock" | "Numpad7" | "Numpad8" | "Numpad9" | "NumpadSubtract" | "Numpad4" | "Numpad5" | "Numpad6" | "NumpadAdd" | "Numpad1" | "Numpad2" | "Numpad3" | "Numpad0" | "NumpadDecimal" | "IntlBackslash" | "F11" | "F12" | "NumpadEqual" | "F13" | "F14" | "F15" | "F16" | "F17" | "F18" | "F19" | "F20" | "F21" | "F22" | "F23" | "KanaMode" | "Lang2" | "Lang1" | "IntlRo" | "F24" | "Lang4" | "Lang3" | "Convert" | "NonConvert" | "IntlYen" | "NumpadComma" | "MediaTrackPrevious" | "MediaTrackNext" | "NumpadEnter" | "ControlRight" | "AudioVolumeMute" | "LaunchApp2" | "MediaPlayPause" | "MediaStop" | "VolumeDown" | "AudioVolumeDown" | "VolumeUp" | "AudioVolumeUp" | "BrowserHome" | "NumpadDivide" | "PrintScreen" | "AltRight" | "NumLock" | "Pause" | "Home" | "ArrowUp" | "PageUp" | "ArrowLeft" | "ArrowRight" | "End" | "ArrowDown" | "PageDown" | "Insert" | "Delete" | "MetaLeft" | "OSLeft" | "MetaRight" | "MetaRight" | "ContextMenu" | "Power" | "BrowserSearch" | "BrowserFavorites" | "BrowserRefresh" | "BrowserStop" | "BrowserForward" | "BrowserBack" | "LaunchApp1" | "LaunchMail" | "MediaSelect";

 /**
  * **`lazy`**: Wrapper around _React.lazy_ that works also with component without default export and with possibility to execute a function before and after component loading. [See demo](https://react-tools.ndria.dev/#/utils/lazy)
  * @param {() => Promise<{ [k:string]: T }>} load - function that returns a Promise or another thenable.
  * @param {Object} [opts] - optional settings.
  * @param {string} [opts.componentName] - name of the of the module to load lazy. If it is missing, and the _load_ execution result not have a default property, the first key in res is returned as result.
  * @param {()=> void} [opts.beforeLoad] - function that will be executed before load component.
  * @param {()=> void} [opts.afterLoad] - function that will be executed after load component.
  * @returns {LazyExoticComponent<T>} result - a React component you can render in your tree.
  */
 export declare const lazy: <T extends ComponentType<unknown>>(load: () => Promise<{
     [k: string]: T;
 }>, opts?: {
     componentName?: string;
     beforeLoad?: () => void;
     afterLoad?: () => void;
 }) => LazyExoticComponent<T>;

 /**
  * **`mergeObjects`**: Function that, given two objects version, merges them into a single one. Via an optional parameter _forceUndefinedValue_ you can define how undefined values are treated. [See demo](https://react-tools.ndria.dev/#/utils/mergeObjects)
  * @param {object} oldObj - previous object version.
  * @param {RecursivePartial<object>} newObj - new object version.
  * @param {boolean} [forceUndefinedValue=false] - boolean to indicate how treat undefined value.
  * @returns {Record<string, any>} result - mergedObject
  */
 export declare function mergeObjects<T extends object>(oldObj: T, newObj: RecursivePartial<T>, forceUndefinedValue?: boolean): T;

 /**
  * Utility type that works like __Partial__ but set nested properties to optional also.
  */
 declare type RecursivePartial<T extends object> = {
     [K in keyof T]?: T[K] extends object ? RecursivePartial<T[K]> : Partial<T[K]>;
 };

 /**
  * **`removePropertiesFromArrayObjects`**: Function that, given an array of objects and a property or an array of properties, return a new array without specified properties. [See demo](https://react-tools.ndria.dev/#/utils/removePropertiesFromArrayObjects)
  * @param {T[]} array - array of object.
  * @param {keyof T| (keyof T)[]} property - a property object or an array of properties inside objects of the given array.
  * @returns {Omit<T,E>[]} array - a new array without targeted properites.
  */
 export declare function removePropertiesFromArrayObjects<T, E extends string | number | symbol = keyof T>(array: T[], property: E | E[]): Omit<T, E>[];

 declare interface ToDataURLOptions {
     /**MIME type*/
     type?: string | undefined;
     /**A Number between 0 and 1 indicating the image quality to be used when creating images*/
     quality?: number;
 }

 /**
  * **`uniqueElementsArray`**: Function that given one or more array of object, returns a single array with unique elements by a specified property, an array of properties or _none_. [See demo](https://react-tools.ndria.dev/#/utils/uniqueElementsArray)
  * @param {keyof T | (keyof T)[] | "none"} property - propertyo or array of properties of the arrays, or _none_. If elements of the arrays aren't objects, _none_ is required.
  * @param {(T[])[]} args - arrays from which remove duplicated.
  * @returns {T[]} result - array
  */
 export declare function uniqueElementsArray<T extends string | number | boolean | ((...args: unknown[]) => unknown) | bigint>(property: "none", ...args: (T[])[]): T[];

 export declare function uniqueElementsArray<T extends object>(property: keyof T | (keyof T)[] | "none", ...args: (T[])[]): T[];

 declare interface UseBase64ObjectOptions<T> {
     serializer: (v: T) => string;
 }

 export { }