@tanstack/vue-router-ssr-query 0.0.1 → 1.140.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/LICENSE +21 -0
- package/README.md +15 -37
- package/dist/esm/index.d.ts +6 -0
- package/dist/esm/index.js +34 -0
- package/dist/esm/index.js.map +1 -0
- package/package.json +73 -7
- package/src/index.tsx +46 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2021-present Tanner Linsley
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,45 +1,23 @@
|
|
|
1
1
|
# @tanstack/vue-router-ssr-query
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
SSR Query integration for TanStack Vue Router.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
## Installation
|
|
6
6
|
|
|
7
|
-
|
|
7
|
+
```bash
|
|
8
|
+
npm install @tanstack/vue-router-ssr-query
|
|
9
|
+
```
|
|
8
10
|
|
|
9
|
-
##
|
|
11
|
+
## Usage
|
|
10
12
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
3. Establish provenance for packages published under this name
|
|
13
|
+
```ts
|
|
14
|
+
import { setupRouterSsrQueryIntegration } from '@tanstack/vue-router-ssr-query'
|
|
15
|
+
import { QueryClient } from '@tanstack/vue-query'
|
|
15
16
|
|
|
16
|
-
|
|
17
|
+
const queryClient = new QueryClient()
|
|
17
18
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
1. Go to [npmjs.com](https://www.npmjs.com/) and navigate to your package settings
|
|
25
|
-
2. Configure the trusted publisher (e.g., GitHub Actions)
|
|
26
|
-
3. Specify the repository and workflow that should be allowed to publish
|
|
27
|
-
4. Use the configured workflow to publish your actual package
|
|
28
|
-
|
|
29
|
-
## DO NOT USE THIS PACKAGE
|
|
30
|
-
|
|
31
|
-
This package is a placeholder for OIDC configuration only. It:
|
|
32
|
-
- Contains no executable code
|
|
33
|
-
- Provides no functionality
|
|
34
|
-
- Should not be installed as a dependency
|
|
35
|
-
- Exists only for administrative purposes
|
|
36
|
-
|
|
37
|
-
## More Information
|
|
38
|
-
|
|
39
|
-
For more details about npm's trusted publishing feature, see:
|
|
40
|
-
- [npm Trusted Publishing Documentation](https://docs.npmjs.com/generating-provenance-statements)
|
|
41
|
-
- [GitHub Actions OIDC Documentation](https://docs.github.com/en/actions/deployment/security-hardening-your-deployments/about-security-hardening-with-openid-connect)
|
|
42
|
-
|
|
43
|
-
---
|
|
44
|
-
|
|
45
|
-
**Maintained for OIDC setup purposes only**
|
|
19
|
+
setupRouterSsrQueryIntegration({
|
|
20
|
+
router,
|
|
21
|
+
queryClient,
|
|
22
|
+
})
|
|
23
|
+
```
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { RouterSsrQueryOptions } from '@tanstack/router-ssr-query-core';
|
|
2
|
+
import { AnyRouter } from '@tanstack/vue-router';
|
|
3
|
+
export type Options<TRouter extends AnyRouter> = RouterSsrQueryOptions<TRouter> & {
|
|
4
|
+
wrapQueryClient?: boolean;
|
|
5
|
+
};
|
|
6
|
+
export declare function setupRouterSsrQueryIntegration<TRouter extends AnyRouter>(opts: Options<TRouter>): void;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as Vue from "vue";
|
|
2
|
+
import { setupCoreRouterSsrQueryIntegration } from "@tanstack/router-ssr-query-core";
|
|
3
|
+
const VUE_QUERY_CLIENT = "VUE_QUERY_CLIENT";
|
|
4
|
+
function setupRouterSsrQueryIntegration(opts) {
|
|
5
|
+
setupCoreRouterSsrQueryIntegration(opts);
|
|
6
|
+
if (opts.wrapQueryClient === false) {
|
|
7
|
+
return;
|
|
8
|
+
}
|
|
9
|
+
const OGWrap = opts.router.options.Wrap || ((props) => props.children);
|
|
10
|
+
opts.router.options.Wrap = (props) => {
|
|
11
|
+
return Vue.h(QueryClientProvider, {
|
|
12
|
+
client: opts.queryClient
|
|
13
|
+
}, () => Vue.h(OGWrap, null, () => props.children));
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
const QueryClientProvider = Vue.defineComponent({
|
|
17
|
+
name: "QueryClientProvider",
|
|
18
|
+
props: {
|
|
19
|
+
client: {
|
|
20
|
+
type: Object,
|
|
21
|
+
required: true
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
setup(props, {
|
|
25
|
+
slots
|
|
26
|
+
}) {
|
|
27
|
+
Vue.provide(VUE_QUERY_CLIENT, props.client);
|
|
28
|
+
return () => slots.default?.();
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
export {
|
|
32
|
+
setupRouterSsrQueryIntegration
|
|
33
|
+
};
|
|
34
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport { setupCoreRouterSsrQueryIntegration } from '@tanstack/router-ssr-query-core'\nimport type { RouterSsrQueryOptions } from '@tanstack/router-ssr-query-core'\nimport type { AnyRouter } from '@tanstack/vue-router'\nimport type { QueryClient } from '@tanstack/query-core'\n\n// Vue Query uses this string as the injection key\nconst VUE_QUERY_CLIENT = 'VUE_QUERY_CLIENT'\n\nexport type Options<TRouter extends AnyRouter> =\n RouterSsrQueryOptions<TRouter> & {\n wrapQueryClient?: boolean\n }\n\nexport function setupRouterSsrQueryIntegration<TRouter extends AnyRouter>(\n opts: Options<TRouter>,\n) {\n setupCoreRouterSsrQueryIntegration(opts)\n\n if (opts.wrapQueryClient === false) {\n return\n }\n\n const OGWrap =\n opts.router.options.Wrap || ((props: { children: any }) => props.children)\n\n opts.router.options.Wrap = (props) => {\n return Vue.h(QueryClientProvider, { client: opts.queryClient }, () =>\n Vue.h(OGWrap, null, () => props.children),\n )\n }\n}\n\nconst QueryClientProvider = Vue.defineComponent({\n name: 'QueryClientProvider',\n props: {\n client: {\n type: Object as () => QueryClient,\n required: true,\n },\n },\n setup(props, { slots }) {\n Vue.provide(VUE_QUERY_CLIENT, props.client)\n return () => slots.default?.()\n },\n})\n"],"names":["VUE_QUERY_CLIENT","setupRouterSsrQueryIntegration","opts","setupCoreRouterSsrQueryIntegration","wrapQueryClient","OGWrap","router","options","Wrap","props","children","Vue","h","QueryClientProvider","client","queryClient","defineComponent","name","type","Object","required","setup","slots","provide","default"],"mappings":";;AAOA,MAAMA,mBAAmB;AAOlB,SAASC,+BACdC,MACA;AACAC,qCAAmCD,IAAI;AAEvC,MAAIA,KAAKE,oBAAoB,OAAO;AAClC;AAAA,EACF;AAEA,QAAMC,SACJH,KAAKI,OAAOC,QAAQC,SAAUC,WAA6BA,MAAMC;AAEnER,OAAKI,OAAOC,QAAQC,OAAQC,WAAU;AACpC,WAAOE,IAAIC,EAAEC,qBAAqB;AAAA,MAAEC,QAAQZ,KAAKa;AAAAA,IAAY,GAAG,MAC9DJ,IAAIC,EAAEP,QAAQ,MAAM,MAAMI,MAAMC,QAAQ,CAC1C;AAAA,EACF;AACF;AAEA,MAAMG,sBAAsBF,IAAIK,gBAAgB;AAAA,EAC9CC,MAAM;AAAA,EACNR,OAAO;AAAA,IACLK,QAAQ;AAAA,MACNI,MAAMC;AAAAA,MACNC,UAAU;AAAA,IACZ;AAAA;EAEFC,MAAMZ,OAAO;AAAA,IAAEa;AAAAA,EAAM,GAAG;AACtBX,QAAIY,QAAQvB,kBAAkBS,MAAMK,MAAM;AAC1C,WAAO,MAAMQ,MAAME,UAAO;AAAA,EAC5B;AACF,CAAC;"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,76 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/vue-router-ssr-query",
|
|
3
|
-
"version": "
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "1.140.1",
|
|
4
|
+
"description": "Modern and scalable routing for Vue applications",
|
|
5
|
+
"author": "Tanner Linsley",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/TanStack/router.git",
|
|
10
|
+
"directory": "packages/vue-router-ssr-query"
|
|
11
|
+
},
|
|
12
|
+
"homepage": "https://tanstack.com/router",
|
|
13
|
+
"funding": {
|
|
14
|
+
"type": "github",
|
|
15
|
+
"url": "https://github.com/sponsors/tannerlinsley"
|
|
16
|
+
},
|
|
5
17
|
"keywords": [
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
|
|
10
|
-
|
|
18
|
+
"vue",
|
|
19
|
+
"location",
|
|
20
|
+
"router",
|
|
21
|
+
"routing",
|
|
22
|
+
"async",
|
|
23
|
+
"async router",
|
|
24
|
+
"typescript"
|
|
25
|
+
],
|
|
26
|
+
"type": "module",
|
|
27
|
+
"types": "dist/esm/index.d.ts",
|
|
28
|
+
"module": "dist/esm/index.js",
|
|
29
|
+
"exports": {
|
|
30
|
+
".": {
|
|
31
|
+
"import": {
|
|
32
|
+
"types": "./dist/esm/index.d.ts",
|
|
33
|
+
"default": "./dist/esm/index.js"
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
"./package.json": "./package.json"
|
|
37
|
+
},
|
|
38
|
+
"sideEffects": false,
|
|
39
|
+
"files": [
|
|
40
|
+
"dist",
|
|
41
|
+
"src"
|
|
42
|
+
],
|
|
43
|
+
"engines": {
|
|
44
|
+
"node": ">=12"
|
|
45
|
+
},
|
|
46
|
+
"dependencies": {
|
|
47
|
+
"@tanstack/router-ssr-query-core": "1.140.1"
|
|
48
|
+
},
|
|
49
|
+
"devDependencies": {
|
|
50
|
+
"@tanstack/vue-query": "^5.92.0",
|
|
51
|
+
"@vitejs/plugin-vue-jsx": "^4.1.2",
|
|
52
|
+
"vue": "^3.5.25",
|
|
53
|
+
"@tanstack/vue-router": "1.140.1"
|
|
54
|
+
},
|
|
55
|
+
"peerDependencies": {
|
|
56
|
+
"@tanstack/query-core": ">=5.90.0",
|
|
57
|
+
"@tanstack/vue-query": ">=5.90.0",
|
|
58
|
+
"@tanstack/vue-router": ">=1.127.0",
|
|
59
|
+
"vue": "^3.3.0"
|
|
60
|
+
},
|
|
61
|
+
"scripts": {
|
|
62
|
+
"clean": "rimraf ./dist && rimraf ./coverage",
|
|
63
|
+
"test:eslint": "eslint ./src",
|
|
64
|
+
"test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
|
|
65
|
+
"test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js",
|
|
66
|
+
"test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js",
|
|
67
|
+
"test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js",
|
|
68
|
+
"test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js",
|
|
69
|
+
"test:types:ts58": "node ../../node_modules/typescript58/lib/tsc.js",
|
|
70
|
+
"test:types:ts59": "tsc",
|
|
71
|
+
"test:unit": "exit 0; vitest",
|
|
72
|
+
"test:unit:dev": "pnpm run test:unit --watch",
|
|
73
|
+
"test:build": "publint --strict && attw --ignore-rules no-resolution --pack .",
|
|
74
|
+
"build": "vite build"
|
|
75
|
+
}
|
|
76
|
+
}
|
package/src/index.tsx
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import * as Vue from 'vue'
|
|
2
|
+
import { setupCoreRouterSsrQueryIntegration } from '@tanstack/router-ssr-query-core'
|
|
3
|
+
import type { RouterSsrQueryOptions } from '@tanstack/router-ssr-query-core'
|
|
4
|
+
import type { AnyRouter } from '@tanstack/vue-router'
|
|
5
|
+
import type { QueryClient } from '@tanstack/query-core'
|
|
6
|
+
|
|
7
|
+
// Vue Query uses this string as the injection key
|
|
8
|
+
const VUE_QUERY_CLIENT = 'VUE_QUERY_CLIENT'
|
|
9
|
+
|
|
10
|
+
export type Options<TRouter extends AnyRouter> =
|
|
11
|
+
RouterSsrQueryOptions<TRouter> & {
|
|
12
|
+
wrapQueryClient?: boolean
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
export function setupRouterSsrQueryIntegration<TRouter extends AnyRouter>(
|
|
16
|
+
opts: Options<TRouter>,
|
|
17
|
+
) {
|
|
18
|
+
setupCoreRouterSsrQueryIntegration(opts)
|
|
19
|
+
|
|
20
|
+
if (opts.wrapQueryClient === false) {
|
|
21
|
+
return
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
const OGWrap =
|
|
25
|
+
opts.router.options.Wrap || ((props: { children: any }) => props.children)
|
|
26
|
+
|
|
27
|
+
opts.router.options.Wrap = (props) => {
|
|
28
|
+
return Vue.h(QueryClientProvider, { client: opts.queryClient }, () =>
|
|
29
|
+
Vue.h(OGWrap, null, () => props.children),
|
|
30
|
+
)
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
const QueryClientProvider = Vue.defineComponent({
|
|
35
|
+
name: 'QueryClientProvider',
|
|
36
|
+
props: {
|
|
37
|
+
client: {
|
|
38
|
+
type: Object as () => QueryClient,
|
|
39
|
+
required: true,
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
setup(props, { slots }) {
|
|
43
|
+
Vue.provide(VUE_QUERY_CLIENT, props.client)
|
|
44
|
+
return () => slots.default?.()
|
|
45
|
+
},
|
|
46
|
+
})
|