@perch33/react-usefilter-hook 1.0.1 β 1.0.3
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 +23 -14
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,6 +3,11 @@
|
|
|
3
3
|
A lightweight and reusable React hook for filtering lists with accent normalization, punctuation removal, and TypeScript support.
|
|
4
4
|
Ideal for search bars, dynamic lists, admin dashboards, e-commerce filters, etc.
|
|
5
5
|
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
6
11
|
---
|
|
7
12
|
|
|
8
13
|
## π₯ Features
|
|
@@ -27,7 +32,6 @@ or
|
|
|
27
32
|
|
|
28
33
|
```sh
|
|
29
34
|
yarn add @perch33/react-usefilter-hook
|
|
30
|
-
|
|
31
35
|
```
|
|
32
36
|
|
|
33
37
|
## π Usage Example (Basic)
|
|
@@ -116,31 +120,37 @@ useFilter<T>(data, key, errorComponent);
|
|
|
116
120
|
### βοΈ How filtering works
|
|
117
121
|
|
|
118
122
|
- This hook automatically:
|
|
119
|
-
|
|
120
123
|
- Converts text to lowercase
|
|
121
|
-
|
|
122
124
|
- Removes accents (ÑéΓΓ³ΓΊ β aeiou)
|
|
123
|
-
|
|
124
125
|
- Removes punctuation and special characters
|
|
125
|
-
|
|
126
126
|
- Performs a normalized comparison
|
|
127
|
-
|
|
128
127
|
- Filters in real time as the user types
|
|
129
128
|
|
|
129
|
+
---
|
|
130
|
+
|
|
131
|
+
## π Used in Production (Real Examples)
|
|
132
|
+
|
|
133
|
+
This hook is currently used in my personal website:
|
|
134
|
+
|
|
135
|
+
- πΌ **Music Scores / Partituras**
|
|
136
|
+
Live search using `useFilter` to filter music scores dynamically.
|
|
137
|
+
π https://www.percychuzon.com/partituras
|
|
138
|
+
|
|
139
|
+
- βοΈ **Blog**
|
|
140
|
+
Used to filter blog posts instantly with accent-insensitive matching.
|
|
141
|
+
π https://www.percychuzon.com/blog
|
|
142
|
+
|
|
143
|
+
These sections demonstrate real-world usage of the hook with dynamic content,
|
|
144
|
+
search inputs, and accent-normalized filtering.
|
|
145
|
+
|
|
130
146
|
### π‘ When to use this hook?
|
|
131
147
|
|
|
132
148
|
- Product search inputs
|
|
133
|
-
|
|
134
149
|
- Admin panel filters
|
|
135
|
-
|
|
136
150
|
- Searchable dropdowns
|
|
137
|
-
|
|
138
151
|
- User lists
|
|
139
|
-
|
|
140
152
|
- Blog post search
|
|
141
|
-
|
|
142
153
|
- Table filtering
|
|
143
|
-
|
|
144
154
|
- Autocomplete components
|
|
145
155
|
|
|
146
156
|
## π Project Structure
|
|
@@ -148,7 +158,6 @@ useFilter<T>(data, key, errorComponent);
|
|
|
148
158
|
Your installation will contain:
|
|
149
159
|
|
|
150
160
|
```
|
|
151
|
-
|
|
152
161
|
dist/
|
|
153
162
|
ββ cjs/
|
|
154
163
|
ββ esm/
|
|
@@ -161,4 +170,4 @@ README.md
|
|
|
161
170
|
|
|
162
171
|
**Percy Chuzon**
|
|
163
172
|
π§ [contacto@percychuzon.com](mailto:contacto@percychuzon.com)
|
|
164
|
-
π [https://
|
|
173
|
+
π [https://www.percychuzon.com](https://www.percychuzon.com)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@perch33/react-usefilter-hook",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "A lightweight and reusable React hook for filtering lists with accent normalization, punctuation removal and TypeScript support.",
|
|
5
5
|
"main": "dist/cjs/index.min.js",
|
|
6
6
|
"module": "dist/esm/index.min.js",
|