enlace 0.0.0-alpha.4 → 0.0.1-beta.1
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/dist/index.d.mts +82 -106
- package/dist/index.d.ts +82 -106
- package/dist/index.js +323 -91
- package/dist/index.mjs +326 -81
- package/dist/next/hook/index.d.mts +124 -0
- package/dist/next/hook/index.d.ts +124 -0
- package/dist/next/hook/index.js +443 -0
- package/dist/next/hook/index.mjs +444 -0
- package/dist/next/index.d.mts +64 -111
- package/dist/next/index.d.ts +64 -111
- package/dist/next/index.js +42 -122
- package/dist/next/index.mjs +45 -108
- package/package.json +15 -24
package/dist/index.js
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
6
|
var __export = (target, all) => {
|
|
9
7
|
for (var name in all)
|
|
@@ -17,121 +15,355 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
15
|
}
|
|
18
16
|
return to;
|
|
19
17
|
};
|
|
20
|
-
var
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
18
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
28
19
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
20
|
|
|
30
21
|
// src/index.ts
|
|
31
22
|
var src_exports = {};
|
|
32
23
|
__export(src_exports, {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
24
|
+
HTTP_METHODS: () => HTTP_METHODS,
|
|
25
|
+
clearCache: () => clearCache,
|
|
26
|
+
createEnlaceHook: () => createEnlaceHook,
|
|
27
|
+
invalidateTags: () => invalidateTags,
|
|
28
|
+
onRevalidate: () => onRevalidate
|
|
36
29
|
});
|
|
37
30
|
module.exports = __toCommonJS(src_exports);
|
|
31
|
+
__reExport(src_exports, require("enlace-core"), module.exports);
|
|
38
32
|
|
|
39
|
-
// src/
|
|
40
|
-
var
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
33
|
+
// src/react/createEnlaceHook.ts
|
|
34
|
+
var import_enlace_core = require("enlace-core");
|
|
35
|
+
|
|
36
|
+
// src/react/useQueryMode.ts
|
|
37
|
+
var import_react = require("react");
|
|
38
|
+
|
|
39
|
+
// src/react/reducer.ts
|
|
40
|
+
var initialState = {
|
|
41
|
+
loading: false,
|
|
42
|
+
fetching: false,
|
|
43
|
+
ok: void 0,
|
|
44
|
+
data: void 0,
|
|
45
|
+
error: void 0
|
|
46
|
+
};
|
|
47
|
+
function hookReducer(state, action) {
|
|
48
|
+
switch (action.type) {
|
|
49
|
+
case "RESET":
|
|
50
|
+
return action.state;
|
|
51
|
+
case "FETCH_START":
|
|
52
|
+
return {
|
|
53
|
+
...state,
|
|
54
|
+
loading: state.data === void 0,
|
|
55
|
+
fetching: true
|
|
56
|
+
};
|
|
57
|
+
case "FETCH_SUCCESS":
|
|
58
|
+
return {
|
|
59
|
+
loading: false,
|
|
60
|
+
fetching: false,
|
|
61
|
+
ok: true,
|
|
62
|
+
data: action.data,
|
|
63
|
+
error: void 0
|
|
64
|
+
};
|
|
65
|
+
case "FETCH_ERROR":
|
|
66
|
+
return {
|
|
67
|
+
loading: false,
|
|
68
|
+
fetching: false,
|
|
69
|
+
ok: false,
|
|
70
|
+
data: void 0,
|
|
71
|
+
error: action.error
|
|
72
|
+
};
|
|
73
|
+
case "SYNC_CACHE":
|
|
74
|
+
return action.state;
|
|
75
|
+
default:
|
|
76
|
+
return state;
|
|
46
77
|
}
|
|
47
|
-
return url.toString();
|
|
48
78
|
}
|
|
49
79
|
|
|
50
|
-
// src/utils/
|
|
51
|
-
function
|
|
52
|
-
|
|
53
|
-
if (body instanceof FormData) return false;
|
|
54
|
-
if (body instanceof Blob) return false;
|
|
55
|
-
if (body instanceof ArrayBuffer) return false;
|
|
56
|
-
if (body instanceof URLSearchParams) return false;
|
|
57
|
-
if (body instanceof ReadableStream) return false;
|
|
58
|
-
if (typeof body === "string") return false;
|
|
59
|
-
return typeof body === "object";
|
|
80
|
+
// src/utils/generateTags.ts
|
|
81
|
+
function generateTags(path) {
|
|
82
|
+
return path.map((_, i) => path.slice(0, i + 1).join("/"));
|
|
60
83
|
}
|
|
61
84
|
|
|
62
|
-
// src/utils/
|
|
63
|
-
function
|
|
64
|
-
if (
|
|
65
|
-
if (
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
85
|
+
// src/utils/sortObjectKeys.ts
|
|
86
|
+
function sortObjectKeys(obj) {
|
|
87
|
+
if (obj === null || typeof obj !== "object") return obj;
|
|
88
|
+
if (Array.isArray(obj)) return obj.map(sortObjectKeys);
|
|
89
|
+
return Object.keys(obj).sort().reduce(
|
|
90
|
+
(sorted, key) => {
|
|
91
|
+
sorted[key] = sortObjectKeys(obj[key]);
|
|
92
|
+
return sorted;
|
|
93
|
+
},
|
|
94
|
+
{}
|
|
95
|
+
);
|
|
71
96
|
}
|
|
72
97
|
|
|
73
|
-
// src/
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
98
|
+
// src/react/cache.ts
|
|
99
|
+
var cache = /* @__PURE__ */ new Map();
|
|
100
|
+
function createQueryKey(tracked) {
|
|
101
|
+
return JSON.stringify(
|
|
102
|
+
sortObjectKeys({
|
|
103
|
+
path: tracked.path,
|
|
104
|
+
method: tracked.method,
|
|
105
|
+
options: tracked.options
|
|
106
|
+
})
|
|
107
|
+
);
|
|
108
|
+
}
|
|
109
|
+
function getCache(key) {
|
|
110
|
+
return cache.get(key);
|
|
111
|
+
}
|
|
112
|
+
function setCache(key, entry) {
|
|
113
|
+
const existing = cache.get(key);
|
|
114
|
+
if (existing) {
|
|
115
|
+
if ("ok" in entry) {
|
|
116
|
+
delete existing.promise;
|
|
117
|
+
}
|
|
118
|
+
Object.assign(existing, entry);
|
|
119
|
+
existing.subscribers.forEach((cb) => cb());
|
|
120
|
+
} else {
|
|
121
|
+
cache.set(key, {
|
|
122
|
+
data: void 0,
|
|
123
|
+
error: void 0,
|
|
124
|
+
ok: void 0,
|
|
125
|
+
timestamp: 0,
|
|
126
|
+
tags: [],
|
|
127
|
+
subscribers: /* @__PURE__ */ new Set(),
|
|
128
|
+
...entry
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
function subscribeCache(key, callback) {
|
|
133
|
+
let entry = cache.get(key);
|
|
134
|
+
if (!entry) {
|
|
135
|
+
cache.set(key, {
|
|
136
|
+
data: void 0,
|
|
137
|
+
error: void 0,
|
|
138
|
+
ok: void 0,
|
|
139
|
+
timestamp: 0,
|
|
140
|
+
tags: [],
|
|
141
|
+
subscribers: /* @__PURE__ */ new Set()
|
|
142
|
+
});
|
|
143
|
+
entry = cache.get(key);
|
|
144
|
+
}
|
|
145
|
+
entry.subscribers.add(callback);
|
|
146
|
+
return () => {
|
|
147
|
+
entry.subscribers.delete(callback);
|
|
80
148
|
};
|
|
81
|
-
|
|
82
|
-
|
|
149
|
+
}
|
|
150
|
+
function isStale(key, staleTime) {
|
|
151
|
+
const entry = cache.get(key);
|
|
152
|
+
if (!entry) return true;
|
|
153
|
+
return Date.now() - entry.timestamp > staleTime;
|
|
154
|
+
}
|
|
155
|
+
function clearCache(key) {
|
|
156
|
+
if (key) {
|
|
157
|
+
cache.delete(key);
|
|
158
|
+
} else {
|
|
159
|
+
cache.clear();
|
|
83
160
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
161
|
+
}
|
|
162
|
+
function clearCacheByTags(tags) {
|
|
163
|
+
cache.forEach((entry) => {
|
|
164
|
+
const hasMatch = entry.tags.some((tag) => tags.includes(tag));
|
|
165
|
+
if (hasMatch) {
|
|
166
|
+
entry.data = void 0;
|
|
167
|
+
entry.error = void 0;
|
|
168
|
+
entry.ok = void 0;
|
|
169
|
+
entry.timestamp = 0;
|
|
170
|
+
delete entry.promise;
|
|
171
|
+
}
|
|
172
|
+
});
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// src/react/revalidator.ts
|
|
176
|
+
var listeners = /* @__PURE__ */ new Set();
|
|
177
|
+
function invalidateTags(tags) {
|
|
178
|
+
clearCacheByTags(tags);
|
|
179
|
+
listeners.forEach((listener) => listener(tags));
|
|
180
|
+
}
|
|
181
|
+
function onRevalidate(callback) {
|
|
182
|
+
listeners.add(callback);
|
|
183
|
+
return () => listeners.delete(callback);
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
// src/react/useQueryMode.ts
|
|
187
|
+
function useQueryMode(api, trackedCall, options) {
|
|
188
|
+
const { autoGenerateTags, staleTime } = options;
|
|
189
|
+
const queryKey = createQueryKey(trackedCall);
|
|
190
|
+
const requestOptions = trackedCall.options;
|
|
191
|
+
const queryTags = requestOptions?.tags ?? (autoGenerateTags ? generateTags(trackedCall.path) : []);
|
|
192
|
+
const getCacheState = (includeNeedsFetch = false) => {
|
|
193
|
+
const cached = getCache(queryKey);
|
|
194
|
+
const hasCachedData = cached?.data !== void 0;
|
|
195
|
+
const isFetching = !!cached?.promise;
|
|
196
|
+
const needsFetch = includeNeedsFetch && (!hasCachedData || isStale(queryKey, staleTime));
|
|
197
|
+
return {
|
|
198
|
+
loading: !hasCachedData && (isFetching || needsFetch),
|
|
199
|
+
fetching: isFetching || needsFetch,
|
|
200
|
+
ok: cached?.ok,
|
|
201
|
+
data: cached?.data,
|
|
202
|
+
error: cached?.error
|
|
203
|
+
};
|
|
204
|
+
};
|
|
205
|
+
const [state, dispatch] = (0, import_react.useReducer)(hookReducer, null, () => getCacheState(true));
|
|
206
|
+
const mountedRef = (0, import_react.useRef)(true);
|
|
207
|
+
const fetchRef = (0, import_react.useRef)(null);
|
|
208
|
+
(0, import_react.useEffect)(() => {
|
|
209
|
+
mountedRef.current = true;
|
|
210
|
+
dispatch({ type: "RESET", state: getCacheState(true) });
|
|
211
|
+
const unsubscribe = subscribeCache(queryKey, () => {
|
|
212
|
+
if (mountedRef.current) {
|
|
213
|
+
dispatch({ type: "SYNC_CACHE", state: getCacheState() });
|
|
214
|
+
}
|
|
215
|
+
});
|
|
216
|
+
const doFetch = () => {
|
|
217
|
+
const cached2 = getCache(queryKey);
|
|
218
|
+
if (cached2?.promise) {
|
|
219
|
+
return;
|
|
90
220
|
}
|
|
221
|
+
dispatch({ type: "FETCH_START" });
|
|
222
|
+
let current = api;
|
|
223
|
+
for (const segment of trackedCall.path) {
|
|
224
|
+
current = current[segment];
|
|
225
|
+
}
|
|
226
|
+
const method = current[trackedCall.method];
|
|
227
|
+
const fetchPromise = method(trackedCall.options).then((res) => {
|
|
228
|
+
if (mountedRef.current) {
|
|
229
|
+
setCache(queryKey, {
|
|
230
|
+
data: res.ok ? res.data : void 0,
|
|
231
|
+
error: res.ok ? void 0 : res.error,
|
|
232
|
+
ok: res.ok,
|
|
233
|
+
timestamp: Date.now(),
|
|
234
|
+
tags: queryTags
|
|
235
|
+
});
|
|
236
|
+
}
|
|
237
|
+
});
|
|
238
|
+
setCache(queryKey, {
|
|
239
|
+
promise: fetchPromise,
|
|
240
|
+
tags: queryTags
|
|
241
|
+
});
|
|
242
|
+
};
|
|
243
|
+
fetchRef.current = doFetch;
|
|
244
|
+
const cached = getCache(queryKey);
|
|
245
|
+
if (cached?.data !== void 0 && !isStale(queryKey, staleTime)) {
|
|
246
|
+
dispatch({ type: "SYNC_CACHE", state: getCacheState() });
|
|
91
247
|
} else {
|
|
92
|
-
|
|
248
|
+
doFetch();
|
|
93
249
|
}
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
if (response.ok) {
|
|
99
|
-
return {
|
|
100
|
-
ok: true,
|
|
101
|
-
status: response.status,
|
|
102
|
-
data: isJson ? await response.json() : response
|
|
250
|
+
return () => {
|
|
251
|
+
mountedRef.current = false;
|
|
252
|
+
fetchRef.current = null;
|
|
253
|
+
unsubscribe();
|
|
103
254
|
};
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
255
|
+
}, [queryKey]);
|
|
256
|
+
(0, import_react.useEffect)(() => {
|
|
257
|
+
if (queryTags.length === 0) return;
|
|
258
|
+
return onRevalidate((invalidatedTags) => {
|
|
259
|
+
const hasMatch = invalidatedTags.some((tag) => queryTags.includes(tag));
|
|
260
|
+
if (hasMatch && mountedRef.current && fetchRef.current) {
|
|
261
|
+
fetchRef.current();
|
|
262
|
+
}
|
|
263
|
+
});
|
|
264
|
+
}, [JSON.stringify(queryTags)]);
|
|
265
|
+
return state;
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
// src/react/types.ts
|
|
269
|
+
var HTTP_METHODS = ["get", "post", "put", "patch", "delete"];
|
|
270
|
+
|
|
271
|
+
// src/react/trackingProxy.ts
|
|
272
|
+
function createTrackingProxy(onTrack) {
|
|
273
|
+
const createProxy = (path = []) => {
|
|
274
|
+
return new Proxy(() => {
|
|
275
|
+
}, {
|
|
276
|
+
get(_, prop) {
|
|
277
|
+
if (HTTP_METHODS.includes(prop)) {
|
|
278
|
+
const methodFn = (options) => {
|
|
279
|
+
onTrack({
|
|
280
|
+
trackedCall: { path, method: prop, options },
|
|
281
|
+
selectorPath: null,
|
|
282
|
+
selectorMethod: null
|
|
283
|
+
});
|
|
284
|
+
return Promise.resolve({ ok: true, data: void 0 });
|
|
285
|
+
};
|
|
286
|
+
onTrack({
|
|
287
|
+
trackedCall: null,
|
|
288
|
+
selectorPath: path,
|
|
289
|
+
selectorMethod: prop
|
|
290
|
+
});
|
|
291
|
+
return methodFn;
|
|
292
|
+
}
|
|
293
|
+
return createProxy([...path, prop]);
|
|
294
|
+
}
|
|
295
|
+
});
|
|
109
296
|
};
|
|
297
|
+
return createProxy();
|
|
110
298
|
}
|
|
111
299
|
|
|
112
|
-
// src/
|
|
113
|
-
var
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
300
|
+
// src/react/useSelectorMode.ts
|
|
301
|
+
var import_react2 = require("react");
|
|
302
|
+
function useSelectorMode(method, path, autoRevalidateTags) {
|
|
303
|
+
const [state, dispatch] = (0, import_react2.useReducer)(hookReducer, initialState);
|
|
304
|
+
const methodRef = (0, import_react2.useRef)(method);
|
|
305
|
+
const triggerRef = (0, import_react2.useRef)(null);
|
|
306
|
+
const pathRef = (0, import_react2.useRef)(path);
|
|
307
|
+
const autoRevalidateRef = (0, import_react2.useRef)(autoRevalidateTags);
|
|
308
|
+
methodRef.current = method;
|
|
309
|
+
pathRef.current = path;
|
|
310
|
+
autoRevalidateRef.current = autoRevalidateTags;
|
|
311
|
+
if (!triggerRef.current) {
|
|
312
|
+
triggerRef.current = (async (...args) => {
|
|
313
|
+
dispatch({ type: "FETCH_START" });
|
|
314
|
+
const res = await methodRef.current(...args);
|
|
315
|
+
if (res.ok) {
|
|
316
|
+
dispatch({ type: "FETCH_SUCCESS", data: res.data });
|
|
317
|
+
const options = args[0];
|
|
318
|
+
const tagsToInvalidate = options?.revalidateTags ?? (autoRevalidateRef.current ? generateTags(pathRef.current) : []);
|
|
319
|
+
if (tagsToInvalidate.length > 0) {
|
|
320
|
+
invalidateTags(tagsToInvalidate);
|
|
321
|
+
}
|
|
322
|
+
} else {
|
|
323
|
+
dispatch({ type: "FETCH_ERROR", error: res.error });
|
|
127
324
|
}
|
|
128
|
-
return
|
|
129
|
-
}
|
|
325
|
+
return res;
|
|
326
|
+
});
|
|
327
|
+
}
|
|
328
|
+
return {
|
|
329
|
+
trigger: triggerRef.current,
|
|
330
|
+
...state
|
|
130
331
|
};
|
|
131
|
-
return new Proxy({}, handler);
|
|
132
332
|
}
|
|
133
333
|
|
|
134
|
-
// src/
|
|
135
|
-
function
|
|
136
|
-
|
|
334
|
+
// src/react/createEnlaceHook.ts
|
|
335
|
+
function createEnlaceHook(baseUrl, defaultOptions = {}, hookOptions = {}) {
|
|
336
|
+
const api = (0, import_enlace_core.createEnlace)(baseUrl, defaultOptions);
|
|
337
|
+
const {
|
|
338
|
+
autoGenerateTags = true,
|
|
339
|
+
autoRevalidateTags = true,
|
|
340
|
+
staleTime = 0
|
|
341
|
+
} = hookOptions;
|
|
342
|
+
function useEnlaceHook(selectorOrQuery) {
|
|
343
|
+
let trackingResult = {
|
|
344
|
+
trackedCall: null,
|
|
345
|
+
selectorPath: null,
|
|
346
|
+
selectorMethod: null
|
|
347
|
+
};
|
|
348
|
+
const trackingProxy = createTrackingProxy((result2) => {
|
|
349
|
+
trackingResult = result2;
|
|
350
|
+
});
|
|
351
|
+
const result = selectorOrQuery(
|
|
352
|
+
trackingProxy
|
|
353
|
+
);
|
|
354
|
+
if (typeof result === "function") {
|
|
355
|
+
const actualResult = selectorOrQuery(api);
|
|
356
|
+
return useSelectorMode(
|
|
357
|
+
actualResult,
|
|
358
|
+
trackingResult.selectorPath ?? [],
|
|
359
|
+
autoRevalidateTags
|
|
360
|
+
);
|
|
361
|
+
}
|
|
362
|
+
return useQueryMode(
|
|
363
|
+
api,
|
|
364
|
+
trackingResult.trackedCall,
|
|
365
|
+
{ autoGenerateTags, staleTime }
|
|
366
|
+
);
|
|
367
|
+
}
|
|
368
|
+
return useEnlaceHook;
|
|
137
369
|
}
|