@triplit/svelte 0.1.1
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +7 -0
- package/README.md +3 -0
- package/dist/index.d.ts +11 -0
- package/dist/index.js +79 -0
- package/package.json +39 -0
package/CHANGELOG.md
ADDED
package/README.md
ADDED
package/dist/index.d.ts
ADDED
@@ -0,0 +1,11 @@
|
|
1
|
+
import type { ClientFetchResult, ClientQuery, ClientQueryBuilder, CollectionNameFromModels, Models, SubscriptionOptions, TriplitClient } from '@triplit/client';
|
2
|
+
export declare function useQuery<M extends Models<any, any> | undefined, CN extends CollectionNameFromModels<M>>(client: TriplitClient<any>, query: ClientQueryBuilder<M, CN>, options?: Partial<SubscriptionOptions>): {
|
3
|
+
fetching: boolean;
|
4
|
+
fetchingRemote: boolean;
|
5
|
+
results: ClientFetchResult<ClientQuery<M, CN>> | undefined;
|
6
|
+
error: any;
|
7
|
+
updateQuery: (query: ClientQueryBuilder<M, CN>) => void;
|
8
|
+
};
|
9
|
+
export declare function useConnectionStatus(client: TriplitClient<any>): {
|
10
|
+
readonly status: any;
|
11
|
+
};
|
package/dist/index.js
ADDED
@@ -0,0 +1,79 @@
|
|
1
|
+
export function useQuery(client, query, options) {
|
2
|
+
let results = $state(undefined);
|
3
|
+
let fetching = $state(false);
|
4
|
+
let fetchingRemote = $state(client.syncEngine.connectionStatus === 'OPEN');
|
5
|
+
let error = $state(undefined);
|
6
|
+
let hasResponseFromServer = false;
|
7
|
+
let builtQuery = $state(query && query.build());
|
8
|
+
function updateQuery(query) {
|
9
|
+
builtQuery = query.build();
|
10
|
+
results = undefined;
|
11
|
+
fetching = true;
|
12
|
+
hasResponseFromServer = false;
|
13
|
+
}
|
14
|
+
$effect(() => {
|
15
|
+
const unsub = client.syncEngine.onConnectionStatusChange((status) => {
|
16
|
+
if (status === 'CLOSING' || status === 'CLOSED') {
|
17
|
+
fetchingRemote = false;
|
18
|
+
return;
|
19
|
+
}
|
20
|
+
if (status === 'OPEN' && hasResponseFromServer === false) {
|
21
|
+
fetchingRemote = true;
|
22
|
+
return;
|
23
|
+
}
|
24
|
+
}, true);
|
25
|
+
return () => {
|
26
|
+
unsub();
|
27
|
+
};
|
28
|
+
});
|
29
|
+
$effect(() => {
|
30
|
+
const unsubscribe = client.subscribe(builtQuery, (localResults) => {
|
31
|
+
fetching = false;
|
32
|
+
error = undefined;
|
33
|
+
results = new Map(localResults);
|
34
|
+
}, (error) => {
|
35
|
+
fetching = false;
|
36
|
+
error = error;
|
37
|
+
}, {
|
38
|
+
...(options ?? {}),
|
39
|
+
onRemoteFulfilled: () => {
|
40
|
+
hasResponseFromServer = true;
|
41
|
+
fetchingRemote = false;
|
42
|
+
},
|
43
|
+
});
|
44
|
+
return () => {
|
45
|
+
unsubscribe();
|
46
|
+
};
|
47
|
+
});
|
48
|
+
return {
|
49
|
+
get fetching() {
|
50
|
+
return fetching;
|
51
|
+
},
|
52
|
+
get fetchingRemote() {
|
53
|
+
return fetchingRemote;
|
54
|
+
},
|
55
|
+
get results() {
|
56
|
+
return results;
|
57
|
+
},
|
58
|
+
get error() {
|
59
|
+
return error;
|
60
|
+
},
|
61
|
+
updateQuery,
|
62
|
+
};
|
63
|
+
}
|
64
|
+
export function useConnectionStatus(client) {
|
65
|
+
let status = $state(client.syncEngine.connectionStatus);
|
66
|
+
$effect(() => {
|
67
|
+
const unsub = client.syncEngine.onConnectionStatusChange((newStatus) => {
|
68
|
+
status = newStatus;
|
69
|
+
}, true);
|
70
|
+
return () => {
|
71
|
+
unsub();
|
72
|
+
};
|
73
|
+
});
|
74
|
+
return {
|
75
|
+
get status() {
|
76
|
+
return status;
|
77
|
+
},
|
78
|
+
};
|
79
|
+
}
|
package/package.json
ADDED
@@ -0,0 +1,39 @@
|
|
1
|
+
{
|
2
|
+
"name": "@triplit/svelte",
|
3
|
+
"packageManager": "yarn@3.4.1",
|
4
|
+
"version": "0.1.1",
|
5
|
+
"source": "./src/index.ts",
|
6
|
+
"main": "./dist/index.js",
|
7
|
+
"module": "./dist/index.js",
|
8
|
+
"types": "./dist/index.d.ts",
|
9
|
+
"type": "module",
|
10
|
+
"exports": {
|
11
|
+
".": {
|
12
|
+
"types": "./dist/index.d.ts",
|
13
|
+
"require": "./dist/index.js",
|
14
|
+
"import": "./dist/index.js",
|
15
|
+
"default": "./dist/index.js",
|
16
|
+
"svelte": "./dist/index.js"
|
17
|
+
}
|
18
|
+
},
|
19
|
+
"scripts": {
|
20
|
+
"build": "svelte-package -t=false && tsc",
|
21
|
+
"build:watch": "svelte-package -w",
|
22
|
+
"lint:build": "npx publint",
|
23
|
+
"publish-pkg": "node ../../scripts/npm-check-version-and-publish.js",
|
24
|
+
"check": "svelte-check --tsconfig ./tsconfig.json"
|
25
|
+
},
|
26
|
+
"files": [
|
27
|
+
"/dist"
|
28
|
+
],
|
29
|
+
"dependencies": {
|
30
|
+
"@triplit/client": "^0.3.33"
|
31
|
+
},
|
32
|
+
"devDependencies": {
|
33
|
+
"@sveltejs/package": "^2.3.0",
|
34
|
+
"@tsconfig/svelte": "^5.0.2",
|
35
|
+
"svelte": "^5.0.0-next.90",
|
36
|
+
"svelte-check": "^3.6.7",
|
37
|
+
"typescript": "^5.2.2"
|
38
|
+
}
|
39
|
+
}
|