@sohanemon/utils 4.1.3 → 4.1.4

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/README.md CHANGED
@@ -0,0 +1,272 @@
1
+ # sohanemon/utils
2
+
3
+ ![npm version](https://img.shields.io/npm/v/@sohanemon/utils)
4
+ ![npm downloads](https://img.shields.io/npm/dm/@sohanemon/utils)
5
+ ![License](https://img.shields.io/npm/l/@sohanemon/utils)
6
+
7
+ ## Description
8
+
9
+ `sohanemon/utils` is a collection of utility functions and hooks designed to simplify common tasks in modern web development. It includes utilities for handling objects, cookies, class name merging, and more. The library is built with TypeScript and is fully typed, ensuring a smooth and error-free development experience.
10
+
11
+ ## Features
12
+
13
+ - **Object Utilities**: Functions to manipulate and access nested object properties.
14
+ - **Cookie Management**: Functions to set, get, delete, and check for cookies.
15
+ - **Class Name Merging**: A utility to merge class names with Tailwind CSS and custom logic.
16
+ - **Responsive Media Queries**: Hooks to detect media queries based on Tailwind CSS breakpoints.
17
+ - **Debounce and Throttle**: Utilities to control the rate of function execution.
18
+ - **Copy to Clipboard**: A hook to copy text to the clipboard and track the copy status.
19
+ - **Local Storage Management**: A hook to persist state in local storage.
20
+ - **URL Parameter Management**: A hook to manage URL parameters as state.
21
+ - **DOM Calculation**: Hooks to calculate dimensions of elements based on viewport and other block dimensions.
22
+
23
+ ## Installation
24
+
25
+ You can install `sohanemon/utils` using npm or yarn:
26
+
27
+ ```bash
28
+ npm install @sohanemon/utils
29
+ ```
30
+
31
+ or
32
+
33
+ ```bash
34
+ yarn add @sohanemon/utils
35
+ ```
36
+
37
+ ## Usage
38
+
39
+ ### Importing Utilities
40
+
41
+ You can import individual utilities or hooks as needed:
42
+
43
+ ```javascript
44
+ import { cn, getObjectValue, setClientSideCookie } from '@sohanemon/utils';
45
+ ```
46
+
47
+ ### Examples
48
+
49
+ #### Class Name Merging
50
+
51
+ ```javascript
52
+ import { cn } from '@sohanemon/utils';
53
+
54
+ const className = cn('bg-blue-500', 'text-white', 'p-4', 'rounded-lg');
55
+ ```
56
+
57
+ #### Object Utilities
58
+
59
+ ```javascript
60
+ import { getObjectValue } from '@sohanemon/utils';
61
+
62
+ const obj = { a: { b: { c: 1 } } };
63
+ const value = getObjectValue(obj, 'a.b.c'); // 1
64
+ ```
65
+
66
+ #### Cookie Management
67
+
68
+ ```javascript
69
+ import { setClientSideCookie, getClientSideCookie } from '@sohanemon/utils';
70
+
71
+ setClientSideCookie('username', 'sohanemon', 7);
72
+ const { value } = getClientSideCookie('username'); // 'sohanemon'
73
+ ```
74
+
75
+ #### Responsive Media Queries
76
+
77
+ ```javascript
78
+ import { useMediaQuery } from '@sohanemon/utils';
79
+
80
+ const isMobile = useMediaQuery('sm');
81
+ ```
82
+
83
+ #### Debounce and Throttle
84
+
85
+ ```javascript
86
+ import { debounce, throttle } from '@sohanemon/utils';
87
+
88
+ const debouncedFunction = debounce(() => console.log('Debounced!'), 300);
89
+ const throttledFunction = throttle(() => console.log('Throttled!'), 300);
90
+ ```
91
+
92
+ #### Copy to Clipboard
93
+
94
+ ```javascript
95
+ import { useCopyToClipboard } from '@sohanemon/utils/hooks';
96
+
97
+ const { isCopied, copy } = useCopyToClipboard();
98
+
99
+ return (
100
+ <div>
101
+ <button onClick={() => copy('Hello, World!')}>Copy</button>
102
+ {isCopied && <span>Copied!</span>}
103
+ </div>
104
+ );
105
+ ```
106
+
107
+ #### Local Storage Management
108
+
109
+ ```javascript
110
+ import { useLocalStorage } from '@sohanemon/utils/hooks';
111
+
112
+ const [value, setValue] = useLocalStorage('myKey', 'initialValue');
113
+
114
+ return (
115
+ <div>
116
+ <input
117
+ type="text"
118
+ value={value}
119
+ onChange={(e) => setValue(e.target.value)}
120
+ />
121
+ </div>
122
+ );
123
+ ```
124
+
125
+ #### URL Parameter Management
126
+
127
+ ```javascript
128
+ import { useUrlParams } from '@sohanemon/utils/hooks';
129
+
130
+ const [param, setParam] = useUrlParams('myParam', 'defaultValue');
131
+
132
+ return (
133
+ <div>
134
+ <input
135
+ type="text"
136
+ value={param}
137
+ onChange={(e) => setParam(e.target.value)}
138
+ />
139
+ </div>
140
+ );
141
+ ```
142
+
143
+ #### DOM Calculation
144
+
145
+ ```javascript
146
+ import { useDomCalculation } from '@sohanemon/utils/hooks';
147
+
148
+ const { height, width } = useDomCalculation({
149
+ blockIds: ['header', 'footer'],
150
+ margin: 20,
151
+ substract: true,
152
+ });
153
+
154
+ return (
155
+ <div style={{ height, width }}>
156
+ Content
157
+ </div>
158
+ );
159
+ ```
160
+
161
+ ## API Documentation
162
+
163
+ ### Class Name Merging
164
+
165
+ ```typescript
166
+ cn(...inputs: ClassValue[]): string
167
+ ```
168
+
169
+ ### Object Utilities
170
+
171
+ ```typescript
172
+ getObjectValue<T, K extends Array<string | number>, D>(
173
+ obj: T,
174
+ path: K,
175
+ defaultValue: D
176
+ ): Exclude<GetValue<T, K>, undefined> | D;
177
+
178
+ getObjectValue<T, K extends Array<string | number>>(
179
+ obj: T,
180
+ path: K
181
+ ): GetValue<T, K> | undefined;
182
+
183
+ getObjectValue<T, S extends string, D>(
184
+ obj: T,
185
+ path: S,
186
+ defaultValue: D
187
+ ): Exclude<GetValue<T, SplitPath<S>>, undefined> | D;
188
+
189
+ getObjectValue<T, S extends string>(
190
+ obj: T,
191
+ path: S
192
+ ): GetValue<T, SplitPath<S>> | undefined;
193
+ ```
194
+
195
+ ### Cookie Management
196
+
197
+ ```typescript
198
+ setClientSideCookie(name: string, value: string, days?: number, path?: string): void
199
+ deleteClientSideCookie(name: string, path?: string): void
200
+ hasClientSideCookie(name: string): boolean
201
+ getClientSideCookie(name: string): { value: string | undefined }
202
+ ```
203
+
204
+ ### Responsive Media Queries
205
+
206
+ ```typescript
207
+ useMediaQuery(tailwindBreakpoint: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | `(${string})`): boolean
208
+ ```
209
+
210
+ ### Debounce and Throttle
211
+
212
+ ```typescript
213
+ debounce<F extends (...args: any[]) => any>(
214
+ function_: F,
215
+ wait?: number,
216
+ options?: { immediate?: boolean }
217
+ ): DebouncedFunction<F>
218
+
219
+ throttle<F extends (...args: any[]) => any>(
220
+ function_: F,
221
+ wait?: number,
222
+ options?: { leading?: boolean; trailing?: boolean }
223
+ ): ThrottledFunction<F>
224
+ ```
225
+
226
+ ### Copy to Clipboard
227
+
228
+ ```typescript
229
+ useCopyToClipboard({ timeout?: number }): { isCopied: boolean; copy: (value: string) => void }
230
+ ```
231
+
232
+ ### Local Storage Management
233
+
234
+ ```typescript
235
+ useLocalStorage<T extends Record<string, any>>(key: string, defaultValue: T): LocalStorageValue<T>
236
+ ```
237
+
238
+ ### URL Parameter Management
239
+
240
+ ```typescript
241
+ useUrlParams<T extends string | number | boolean>(key: string, defaultValue: T): [T, (value: T) => void]
242
+ ```
243
+
244
+ ### DOM Calculation
245
+
246
+ ```typescript
247
+ useDomCalculation({
248
+ blockIds: string[];
249
+ dynamic?: boolean | string;
250
+ margin?: number;
251
+ substract?: boolean;
252
+ onChange?: (results: {
253
+ blocksHeight: number;
254
+ blocksWidth: number;
255
+ remainingWidth: number;
256
+ remainingHeight: number;
257
+ }) => void;
258
+ }): { height: number; width: number }
259
+ ```
260
+
261
+ ## Contributing
262
+
263
+ Contributions are welcome! Please read the [CONTRIBUTING.md](CONTRIBUTING.md) file for guidelines on how to contribute to the project.
264
+
265
+ ## License
266
+
267
+ This project is licensed under the ISC License - see the [LICENSE](LICENSE) file for details.
268
+
269
+ ## Contact
270
+
271
+ - **Sohan Emon**: [sohanemon@outlook.com](mailto:sohanemon@outlook.com)
272
+ - **GitHub**: [sohanemon](https://github.com/sohanemon)
@@ -61,6 +61,16 @@ export declare const copyToClipboard: (value: string, onSuccess?: () => void) =>
61
61
  * @returns - Normal Case
62
62
  */
63
63
  export declare function convertToNormalCase(inputString: string): string;
64
+ /**
65
+ * Converts a string to a URL-friendly slug by trimming, converting to lowercase,
66
+ * replacing diacritics, removing invalid characters, and replacing spaces with hyphens.
67
+ * @param {string} [str] - The input string to convert.
68
+ * @returns {string} The generated slug.
69
+ * @example
70
+ * convertToSlug("Hello World!"); // "hello-world"
71
+ * convertToSlug("Déjà Vu"); // "deja-vu"
72
+ */
73
+ export declare const convertToSlug: (str: string) => string;
64
74
  /**
65
75
  * Checks if the code is running in a server-side environment.
66
76
  *
@@ -110,6 +110,38 @@ export function convertToNormalCase(inputString) {
110
110
  const capitalizedWords = words.map((word) => word.charAt(0).toUpperCase() + word.slice(1));
111
111
  return capitalizedWords.join(' ');
112
112
  }
113
+ const from = 'àáãäâèéëêìíïîòóöôùúüûñç·/_,:;';
114
+ const to = 'aaaaaeeeeiiiioooouuuunc------';
115
+ /**
116
+ * Converts a string to a URL-friendly slug by trimming, converting to lowercase,
117
+ * replacing diacritics, removing invalid characters, and replacing spaces with hyphens.
118
+ * @param {string} [str] - The input string to convert.
119
+ * @returns {string} The generated slug.
120
+ * @example
121
+ * convertToSlug("Hello World!"); // "hello-world"
122
+ * convertToSlug("Déjà Vu"); // "deja-vu"
123
+ */
124
+ export const convertToSlug = (str) => {
125
+ if (typeof str !== 'string') {
126
+ throw new TypeError('Input must be a string');
127
+ }
128
+ // Trim the string and convert it to lowercase.
129
+ let slug = str.trim().toLowerCase();
130
+ // Build a mapping of accented characters to their non-accented equivalents.
131
+ const charMap = {};
132
+ for (let i = 0; i < from.length; i++) {
133
+ charMap[from.charAt(i)] = to.charAt(i);
134
+ }
135
+ // Replace all accented characters using the mapping.
136
+ slug = slug.replace(new RegExp(`[${from}]`, 'g'), (match) => charMap[match] || match);
137
+ return (slug
138
+ .replace(/[^a-z0-9 -]/g, '') // Remove invalid characters
139
+ .replace(/\s+/g, '-') // Replace spaces with hyphens
140
+ .replace(/-+/g, '-') // Collapse consecutive hyphens
141
+ .replace(/^-+/, '') // Remove leading hyphens
142
+ .replace(/-+$/, '') || // Remove trailing hyphens
143
+ '');
144
+ };
113
145
  /**
114
146
  * Checks if the code is running in a server-side environment.
115
147
  *
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sohanemon/utils",
3
- "version": "4.1.3",
3
+ "version": "4.1.4",
4
4
  "author": "Sohan Emon <sohanemon@outlook.com>",
5
5
  "description": "",
6
6
  "type": "module",