@appello/common
Version:
Common package with many useful features for web and mobile development
112 lines (93 loc) • 13.9 kB
Markdown
# Common frontend library of components for web and mobile environmental
## How to use it
Install package from npm:
#### `npm i /common`
Import modules you need in your code:
#### `import { useInterval, isNill } from '@appello/common';`
## Development guide
### For developers
Each new functionality must be added to the folder and exported from the root! This is necessary to simplify
the import of the necessary functionality:
#### `import { useInterval, isFunction, ... } from '@appello/common';`
If you need to create a new module, remember to add index.ts with exports.
## Hooks
| Hook Name | Description | File Path |
| --------------------- | ---------------------------------------------------------- | ---------------------------------------------------------------------- |
| useCodeTimer | Timer functionality for verification codes | [`useCodeTimer`](./src/hooks/useCodeTimer/useCodeTimer.md) |
| useCombinedRef | Combining multiple refs | [`useCombinedRef`](./src/hooks/useCombinedRef/useCombinedRef.md) |
| useDebounce | Two files: useDebounceCallback.md and useDebounceEffect.md | [`useDebounce`](./src/hooks/useDebounce) |
| useDefault | State with fallback values | [`useDefault`](./src/hooks/useDefault/useDefault.md) |
| useFirstMountState | Detecting first render | [`useFirstMountState`](src/hooks/useFirstMountState) |
| useHookFormPersist | Form persistence in storage | [`useHookFormPersist`](./src/hooks/useHookFormPersist) |
| useInterval | Interval management | [`useInterval`](./src/hooks/useInterval/useInterval.md) |
| useIsClient | Client-side detection | [`useIsClient`](./src/hooks/useIsClient/useIsClient.md) |
| useIsMounted | Mount state checking (typo now fixed) | [`useIsMounted`](./src/hooks/useIsMounted/useIsMounted.md) |
| useLatest | Latest value reference | [`useLatest`](./src/hooks/useLatest/useLatest.md) |
| useManualUpdate | Force re-renders | [`useManualUpdate`](./src/hooks/useManualUpdate/useManualUpdate.md) |
| useMemoCallback | Stable callback references | [`useMemoCallback`](./src/hooks/useMemoCallback) |
| useMountEffect | Mount-only effects | [`useMountEffect`](./src/hooks/useMountEffect/useMountEffect.md) |
| usePrevious | Previous value tracking | [`usePrevious`](./src/hooks/usePrevious/usePrevious) |
| useQueryParamsBuilder | Query parameter management | [`useQueryParamsBuilder`](./src/hooks/useQueryParamsBuilder) |
| useSelectOptions | React-select compatibility | [`useSelectOptions`](./src/hooks/useSelectOptions/useSelectOptions.md) |
| useStateObject | Object state management | [`useStateObject`](./src/hooks/useStateObject/useStateObject.md) |
| useStep | Step counter management | [`useStep`](./src/hooks/useStep/useStep.md) |
| useSwitchValue | Boolean toggle management | [`useSwitchValue`](./src/hooks/useSwitchValue/useSwitchValue.md) |
| useUnmountEffect | Unmount-only effects | [`useUnmountEffect`](./src/hooks/useUnmountEffect/useUnmountEffect.md) |
| useUpdateEffect | Update-only effects | [`useUpdateEffect`](./src/hooks/useUpdateEffect/useUpdateEffect.md) |
---
## Types:
### [`typesDocs`](./src//types/index.ts)
## Utilities
| Utility Name | Description | File Path |
| -------------------- | ----------------------------------------------------------------------- | ---------------------------------------------------------------------------------- |
| checkIsServer | Server-side environment detection | [`checkIsServer`](./src/utils/checkIsServer/checkIsServer.md) |
| checkNavigator | Navigator object availability check | [`checkNavigator`](./src/utils/checkNavigator/checkNavigator.md) |
| debounce | Function execution delay utility | [`debounce`](./src/utils/debounce/debounce.md) |
| deepMergeObjects | Deep object merging with immutability | [`deepMergeObjects`](./src/utils/deepMergeObjects/deepMergeObjects.md) |
| entries | Type-safe Object.entries wrapper | [`entries`](./src/utils/entries/entries.md) |
| getDirtyValues | Extract modified form fields | [`getDirtyValues`](./src/utils/getDirtyValues/getDirtyValues.md) |
| getFileExtension | File extension extraction utility | [`getFileExtension`](./src/utils/getFileExtension/getFileExtension.md) |
| getProto | Reliable type detection using Object.prototype.toString | [`getProto`](./src/utils/getProto/getProto.md) |
| getWeekdaysNames | Localized weekday names generation | [`getWeekdaysNames`](./src/utils/getWeekdaysNames/getWeekdaysNames.md) |
| isArray | Array type checking utility | [`isArray`](./src/utils/isArray/isArray.md) |
| isDate | Date object type checking | [`isDate`](./src/utils/isDate/isDate.md) |
| isEmpty | Empty value detection for multiple types | [`isEmpty`](./src/utils/isEmpty/isEmpty.md) |
| isFloat | Floating-point number detection | [`isFloat`](./src/utils/isFloat/isFloat.md) |
| isFunction | Function type checking utility | [`isFunction`](./src/utils/isFunction/isFunction.md) |
| isInt | Integer type checking utility | [`isInt`](./src/utils/isInt/isInt.md) |
| isNil | Null and undefined detection | [`isNil`](./src/utils/isNil/isNil.md) |
| isNumber | Number type checking utility | [`isNumber`](./src/utils/isNumber/isNumber.md) |
| isObject | Plain object type checking | [`isObject`](./src/utils/isObject/isObject.md) |
| isPrimitive | Primitive type detection | [`isPrimitive`](./src/utils/isPrimitive/isPrimitive.md) |
| isPromise | Promise and thenable object detection | [`isPromise`](./src/utils/isPromise/isPromise.md) |
| isString | String type checking utility | [`isString`](./src/utils/isString/isString.md) |
| isSymbol | Symbol type checking utility | [`isSymbol`](./src/utils/isSymbol/isSymbol.md) |
| keys | Type-safe Object.keys wrapper | [`keys`](./src/utils/keys/keys.md) |
| makeFormData | Object to FormData conversion | [`makeFormData`](./src/utils/makeFormData/makeFormData.md) |
| makeQueryString | URL query string generation | [`makeQueryString`](./src/utils/makeQueryString/makeQueryString.md) |
| mapFormData | FormData transformation utility | [`mapFormData`](./src/utils/mapFormData/mapFormData.md) |
| mergeCollectionByKey | Array merging by specified key | [`mergeCollectionByKey`](./src/utils/mergeCollectionByKey/mergeCollectionByKey.md) |
| noop | No-operation function placeholder | [`noop`](./src/utils/noop/noop.md) |
| omit | Object property exclusion utility | [`omit`](./src/utils/omit/omit.md) |
| pick | Object property selection utility | [`pick`](./src/utils/pick/pick.md) |
| sleep | Promise-based delay utility | [`sleep`](./src/utils/sleep/sleep.md) |
| throttle | Function execution rate limiting | [`throttle`](./src/utils/throttle/throttle.md) |
| toBase64 | File to base64 string conversion | [`toBase64`](./src/utils/toBase64/toBase64.md) |
| toFinite | Safe finite number conversion | [`toFinite`](./src/utils/toFinite/toFinite.md) |
| isFile | File instance checking utility | [`isFile`](./src/utils/isFile/isFile.md) |
| isBlob | Blob instance checking utility | [`isBlob`](./src/utils/isBlob//isBlob.md) |
| deepEqual | Deep comparison of two values for equality | [`deepEqual`](./src/utils/deepEqual/deepEqual.md) |
| difference | Creates an array of values not included in the other given arrays | [`difference`](./src/utils/difference/difference.md) |
| intersection | Creates an array of unique values that are included in all given arrays | [`intersection`](./src/utils/intersection/intersection.md) |
| uniq | Creates a duplicate-free version of an array | [`uniq`](./src/utils/uniq/uniq.md) |
| compact | Creates an array with all falsy values removed | [`compact`](./src/utils/compact/compact.md) |
| enumKeyToReadable | Converts an enum key into a human-readable format | [`enumKeyToReadable`](./src/utils/enumKeyToReadable/enumKeyToReadable.md) |
| capitalize | Capitalizes the first character of a string | [`capitalize`](./src/utils/capitalize/capitalize.md) |
| truncate | Truncates a string to the specified length | [`truncate`](./src/utils/truncate/truncate.md) |
| pluralize | Returns the appropriate word form based on a count | [`pluralize`](./src/utils/pluralize/pluralize.md) |
| formatNumber | Formats a number using thousand separators | [`formatNumber`](./src/utils/formatNumber/formatNumber.md) |
| formatCurrency | Formats a number as currency | [`formatCurrency`](./src/utils/formatCurrency/formatCurrency.md) |
| getFileName | Extracts the filename from a filename or file path | [`getFileName`](./src/utils/getFileName/getFileName.md) |
| enumToSelectOptions | Converts an enum or enum-like object into an array of select options | [`enumToSelectOptions`](./src/utils/enumToSelectOptions/enumToSelectOptions.md) |
| deepKeys | Returns all key paths in an object | [`deepKeys`](./src/utils/deepKeys/deepKeys.md) |
---