@@ -13,7 +13,7 @@ React Hook for syncing [TanStack Table](https://github.com/TanStack/table) state
13
13
14
14
https://github.com/user-attachments/assets/1f1b4a65-fdec-4a80-a5d5-783642befaa3
15
15
16
- # Quick Start
16
+ # 🚀 Quick Start
17
17
18
18
First, install the package.
19
19
@@ -61,21 +61,21 @@ Please refer to the examples below:
61
61
- [ Next.js(App Router)] ( https://github.com/taro-28/tanstack-table-search-params/tree/main/examples/next-app-router/src/app/table.tsx )
62
62
- [ TanStack Router] ( https://github.com/taro-28/tanstack-table-search-params/tree/main/examples/tanstack-router/src/routes/index.tsx )
63
63
64
- # How it works
64
+ # 🔍 How it works
65
65
66
66
The ` useTableSearchParams ` hook primarily does the following two things:
67
67
68
68
- Decode ` query ` (query parameter state) and return it as the ` state ` for Tanstack Table.
69
69
- Return a function like ` onChangeGlobalFilter ` that encodes ` state ` as a query parameter and performs ` push ` (or ` replace ` ).
70
70
71
- # Options
71
+ # ⚙️ Options
72
72
73
- - [ Custom query param name] ( #custom-query-param-name )
74
- - [ Custom encoder/decoder] ( #custom-encoderdecoder )
75
- - [ Custom default value] ( #custom-default-value )
76
- - [ Debounce] ( #debounce )
73
+ - [ 🏷️ Custom query param name] ( #custom-query-param-name )
74
+ - [ 🔢 Custom encoder/decoder] ( #custom-encoderdecoder )
75
+ - [ 🪄 Custom default value] ( #custom-default-value )
76
+ - [ ⏱️ Debounce] ( #debounce )
77
77
78
- ## Custom query param name
78
+ ## 🏷️ Custom query param name \{ #custom-query-param-name \}
79
79
80
80
You can customize a query parameter name.
81
81
@@ -93,7 +93,7 @@ const stateAndOnChanges = useTableSearchParams(router, {
93
93
});
94
94
```
95
95
96
- ## Custom default value
96
+ ## 🔢 Custom default value
97
97
98
98
You can customize the default value of a query parameter.
99
99
@@ -125,7 +125,7 @@ useEffect(() => {
125
125
}, [router .replace ]);
126
126
```
127
127
128
- ## Custom encoder/decoder
128
+ ## 🪄 Custom encoder/decoder
129
129
130
130
You can customize the encoder/decoder for the query parameter.
131
131
@@ -196,7 +196,7 @@ const stateAndOnChanges = useTableSearchParams(router, {
196
196
});
197
197
```
198
198
199
- ## Debounce
199
+ ## ⏱️ Debounce
200
200
201
201
You can debounce the reflection of state changes in the query parameters.
202
202
0 commit comments