@tanstack/vue-query-devtools 5.17.9 → 5.17.11

package/dist/cjs/devtools.vue.cjs

@@ -0,0 +1,52 @@
+"use strict";
+const vue = require("vue");
+const vueQuery = require("@tanstack/vue-query");
+const queryDevtools = require("@tanstack/query-devtools");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "devtools",
+  props: {
+    initialIsOpen: { type: Boolean },
+    buttonPosition: {},
+    position: {},
+    client: {},
+    errorTypes: {},
+    styleNonce: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const div = vue.ref();
+    const client = props.client || vueQuery.useQueryClient();
+    const devtools = new queryDevtools.TanstackQueryDevtools({
+      client,
+      queryFlavor: "Vue Query",
+      version: "5",
+      onlineManager: vueQuery.onlineManager,
+      buttonPosition: props.buttonPosition,
+      position: props.position,
+      initialIsOpen: props.initialIsOpen,
+      errorTypes: props.errorTypes,
+      styleNonce: props.styleNonce
+    });
+    vue.watchEffect(() => {
+      devtools.setButtonPosition(props.buttonPosition || "bottom-left");
+      devtools.setPosition(props.position || "bottom");
+      devtools.setInitialIsOpen(props.initialIsOpen);
+      devtools.setErrorTypes(props.errorTypes || []);
+    });
+    vue.onMounted(() => {
+      devtools.mount(div.value);
+    });
+    vue.onScopeDispose(() => {
+      devtools.unmount();
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        className: "tsqd-parent-container",
+        ref_key: "div",
+        ref: div
+      }, null, 512);
+    };
+  }
+});
+module.exports = _sfc_main;
+//# sourceMappingURL=devtools.vue.cjs.map

package/dist/cjs/devtools.vue.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.vue.cjs","sources":["../../src/devtools.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onScopeDispose, watchEffect, ref } from 'vue'\nimport { onlineManager, useQueryClient } from '@tanstack/vue-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type { DevtoolsOptions } from './types'\n\nconst props = defineProps<DevtoolsOptions>()\n\nconst div = ref<HTMLElement>()\nconst client = props.client || useQueryClient()\nconst devtools = new TanstackQueryDevtools({\n  client,\n  queryFlavor: 'Vue Query',\n  version: '5',\n  onlineManager,\n  buttonPosition: props.buttonPosition,\n  position: props.position,\n  initialIsOpen: props.initialIsOpen,\n  errorTypes: props.errorTypes,\n  styleNonce: props.styleNonce,\n})\n\nwatchEffect(() => {\n  devtools.setButtonPosition(props.buttonPosition || 'bottom-left')\n  devtools.setPosition(props.position || 'bottom')\n  devtools.setInitialIsOpen(props.initialIsOpen)\n  devtools.setErrorTypes(props.errorTypes || [])\n})\n\nonMounted(() => {\n  devtools.mount(div.value as HTMLElement)\n})\n\nonScopeDispose(() => {\n  devtools.unmount()\n})\n</script>\n\n<template>\n  <div className=\"tsqd-parent-container\" ref=\"div\"></div>\n</template>\n"],"names":["ref","useQueryClient","TanstackQueryDevtools","onlineManager","watchEffect","onMounted","onScopeDispose"],"mappings":";;;;;;;;;;;;;;;;AAQA,UAAM,MAAMA,IAAAA;AACN,UAAA,SAAS,MAAM,UAAUC,SAAe,eAAA;AACxC,UAAA,WAAW,IAAIC,oCAAsB;AAAA,MACzC;AAAA,MACA,aAAa;AAAA,MACb,SAAS;AAAA,MAAA,eACTC,SAAA;AAAA,MACA,gBAAgB,MAAM;AAAA,MACtB,UAAU,MAAM;AAAA,MAChB,eAAe,MAAM;AAAA,MACrB,YAAY,MAAM;AAAA,MAClB,YAAY,MAAM;AAAA,IAAA,CACnB;AAEDC,QAAAA,YAAY,MAAM;AACP,eAAA,kBAAkB,MAAM,kBAAkB,aAAa;AACvD,eAAA,YAAY,MAAM,YAAY,QAAQ;AACtC,eAAA,iBAAiB,MAAM,aAAa;AAC7C,eAAS,cAAc,MAAM,cAAc,CAAE,CAAA;AAAA,IAAA,CAC9C;AAEDC,QAAAA,UAAU,MAAM;AACL,eAAA,MAAM,IAAI,KAAoB;AAAA,IAAA,CACxC;AAEDC,QAAAA,eAAe,MAAM;AACnB,eAAS,QAAQ;AAAA,IAAA,CAClB;;;;;;;;;;;"}

package/dist/cjs/devtools.vue2.cjs

@@ -0,0 +1,4 @@
+"use strict";
+const devtools_vue_vue_type_script_setup_true_lang = require("./devtools.vue.cjs");
+module.exports = devtools_vue_vue_type_script_setup_true_lang;
+//# sourceMappingURL=devtools.vue2.cjs.map

package/dist/cjs/devtools.vue2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.vue2.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/cjs/index.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const devtools_vue_vue_type_script_setup_true_lang = require("./devtools.vue.cjs");
+const VueQueryDevtools = process.env.NODE_ENV !== "development" ? function() {
+  return null;
+} : devtools_vue_vue_type_script_setup_true_lang;
+exports.VueQueryDevtools = VueQueryDevtools;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/index.ts"],"sourcesContent":["import devtools from './devtools.vue'\nimport type { DefineComponent } from 'vue'\nimport type { DevtoolsOptions } from './types'\n\nexport const VueQueryDevtools = (\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools\n) as DefineComponent<DevtoolsOptions, {}, unknown>\n"],"names":["devtools"],"mappings":";;;AAIO,MAAM,mBACX,QAAQ,IAAI,aAAa,gBACrB,WAAY;AACH,SAAA;AACT,IACAA;;"}

package/dist/cjs/production.cjs

@@ -0,0 +1,4 @@
+"use strict";
+const devtools_vue_vue_type_script_setup_true_lang = require("./devtools.vue.cjs");
+module.exports = devtools_vue_vue_type_script_setup_true_lang;
+//# sourceMappingURL=production.cjs.map

package/dist/cjs/production.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"production.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/devtools.vue.d.ts

@@ -0,0 +1,12 @@
+import type { DevtoolsOptions } from './types';
+declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<DevtoolsOptions>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<DevtoolsOptions>>>, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/esm/devtools.vue.js

@@ -0,0 +1,53 @@
+import { defineComponent, ref, watchEffect, onMounted, onScopeDispose, openBlock, createElementBlock } from "vue";
+import { useQueryClient, onlineManager } from "@tanstack/vue-query";
+import { TanstackQueryDevtools } from "@tanstack/query-devtools";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "devtools",
+  props: {
+    initialIsOpen: { type: Boolean },
+    buttonPosition: {},
+    position: {},
+    client: {},
+    errorTypes: {},
+    styleNonce: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const div = ref();
+    const client = props.client || useQueryClient();
+    const devtools = new TanstackQueryDevtools({
+      client,
+      queryFlavor: "Vue Query",
+      version: "5",
+      onlineManager,
+      buttonPosition: props.buttonPosition,
+      position: props.position,
+      initialIsOpen: props.initialIsOpen,
+      errorTypes: props.errorTypes,
+      styleNonce: props.styleNonce
+    });
+    watchEffect(() => {
+      devtools.setButtonPosition(props.buttonPosition || "bottom-left");
+      devtools.setPosition(props.position || "bottom");
+      devtools.setInitialIsOpen(props.initialIsOpen);
+      devtools.setErrorTypes(props.errorTypes || []);
+    });
+    onMounted(() => {
+      devtools.mount(div.value);
+    });
+    onScopeDispose(() => {
+      devtools.unmount();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        className: "tsqd-parent-container",
+        ref_key: "div",
+        ref: div
+      }, null, 512);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=devtools.vue.js.map

package/dist/esm/devtools.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.vue.js","sources":["../../src/devtools.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onScopeDispose, watchEffect, ref } from 'vue'\nimport { onlineManager, useQueryClient } from '@tanstack/vue-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type { DevtoolsOptions } from './types'\n\nconst props = defineProps<DevtoolsOptions>()\n\nconst div = ref<HTMLElement>()\nconst client = props.client || useQueryClient()\nconst devtools = new TanstackQueryDevtools({\n  client,\n  queryFlavor: 'Vue Query',\n  version: '5',\n  onlineManager,\n  buttonPosition: props.buttonPosition,\n  position: props.position,\n  initialIsOpen: props.initialIsOpen,\n  errorTypes: props.errorTypes,\n  styleNonce: props.styleNonce,\n})\n\nwatchEffect(() => {\n  devtools.setButtonPosition(props.buttonPosition || 'bottom-left')\n  devtools.setPosition(props.position || 'bottom')\n  devtools.setInitialIsOpen(props.initialIsOpen)\n  devtools.setErrorTypes(props.errorTypes || [])\n})\n\nonMounted(() => {\n  devtools.mount(div.value as HTMLElement)\n})\n\nonScopeDispose(() => {\n  devtools.unmount()\n})\n</script>\n\n<template>\n  <div className=\"tsqd-parent-container\" ref=\"div\"></div>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAQA,UAAM,MAAM;AACN,UAAA,SAAS,MAAM,UAAU,eAAe;AACxC,UAAA,WAAW,IAAI,sBAAsB;AAAA,MACzC;AAAA,MACA,aAAa;AAAA,MACb,SAAS;AAAA,MACT;AAAA,MACA,gBAAgB,MAAM;AAAA,MACtB,UAAU,MAAM;AAAA,MAChB,eAAe,MAAM;AAAA,MACrB,YAAY,MAAM;AAAA,MAClB,YAAY,MAAM;AAAA,IAAA,CACnB;AAED,gBAAY,MAAM;AACP,eAAA,kBAAkB,MAAM,kBAAkB,aAAa;AACvD,eAAA,YAAY,MAAM,YAAY,QAAQ;AACtC,eAAA,iBAAiB,MAAM,aAAa;AAC7C,eAAS,cAAc,MAAM,cAAc,CAAE,CAAA;AAAA,IAAA,CAC9C;AAED,cAAU,MAAM;AACL,eAAA,MAAM,IAAI,KAAoB;AAAA,IAAA,CACxC;AAED,mBAAe,MAAM;AACnB,eAAS,QAAQ;AAAA,IAAA,CAClB;;;;;;;;;;"}

package/dist/esm/devtools.vue2.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./devtools.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=devtools.vue2.js.map

package/dist/esm/devtools.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/esm/index.d.ts

@@ -0,0 +1,3 @@
+import type { DefineComponent } from 'vue';
+import type { DevtoolsOptions } from './types';
+export declare const VueQueryDevtools: DefineComponent<DevtoolsOptions, {}, unknown>;

package/dist/esm/index.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./devtools.vue.js";
+const VueQueryDevtools = process.env.NODE_ENV !== "development" ? function() {
+  return null;
+} : _sfc_main;
+export {
+  VueQueryDevtools
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["import devtools from './devtools.vue'\nimport type { DefineComponent } from 'vue'\nimport type { DevtoolsOptions } from './types'\n\nexport const VueQueryDevtools = (\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools\n) as DefineComponent<DevtoolsOptions, {}, unknown>\n"],"names":["devtools"],"mappings":";AAIO,MAAM,mBACX,QAAQ,IAAI,aAAa,gBACrB,WAAY;AACH,SAAA;AACT,IACAA;"}

package/dist/esm/production.d.ts

@@ -0,0 +1,2 @@
+import devtools from './devtools.vue';
+export default devtools;

package/dist/esm/production.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./devtools.vue.js";
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=production.js.map

package/dist/esm/production.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"production.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/esm/types.d.ts

@@ -0,0 +1,32 @@
+import type { DevToolsErrorType, DevtoolsButtonPosition, DevtoolsPosition } from '@tanstack/query-devtools';
+import type { QueryClient } from '@tanstack/vue-query';
+export interface DevtoolsOptions {
+    /**
+     * Set this true if you want the dev tools to default to being open
+     */
+    initialIsOpen?: boolean;
+    /**
+     * The position of the React Query logo to open and close the devtools panel.
+     * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
+     * Defaults to 'bottom-left'.
+     */
+    buttonPosition?: DevtoolsButtonPosition;
+    /**
+     * The position of the React Query devtools panel.
+     * 'top' | 'bottom' | 'left' | 'right'
+     * Defaults to 'bottom'.
+     */
+    position?: DevtoolsPosition;
+    /**
+     * Custom instance of QueryClient
+     */
+    client?: QueryClient;
+    /**
+     * Use this so you can define custom errors that can be shown in the devtools.
+     */
+    errorTypes?: Array<DevToolsErrorType>;
+    /**
+     * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles.
+     */
+    styleNonce?: string;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/vue-query-devtools",
-  "version": "5.17.9",
+  "version": "5.17.11",
   "description": "Developer tools to interact with and visualize the TanStack/vue-query cache",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -15,21 +15,21 @@
     "url": "https://github.com/sponsors/tannerlinsley"
   },
   "type": "module",
-  "types": "dist/index.d.ts",
-  "module": "dist/index.js",
-  "main": "dist/index.js",
+  "types": "dist/esm/index.d.ts",
+  "module": "dist/esm/index.js",
+  "main": "dist/esm/index.js",
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "default": "./dist/index.js"
+      "types": "./dist/esm/index.d.ts",
+      "default": "./dist/esm/index.js"
     },
     "./production": {
-      "types": "./dist/production.d.ts",
-      "default": "./dist/production.js"
+      "types": "./dist/esm/production.d.ts",
+      "default": "./dist/esm/production.js"
     },
     "./dist/production.js": {
-      "types": "./dist/production.d.ts",
-      "default": "./dist/production.js"
+      "types": "./dist/esm/production.d.ts",
+      "default": "./dist/esm/production.js"
     },
     "./package.json": "./package.json"
   },
@@ -46,17 +46,17 @@
     "vite": "^5.0.10",
     "vue": "^3.3.0",
     "vue-tsc": "^1.8.26",
-    "@tanstack/vue-query": "5.17.9"
+    "@tanstack/vue-query": "5.17.11"
   },
   "peerDependencies": {
     "vue": "^3.3.0",
-    "@tanstack/vue-query": "^5.17.9"
+    "@tanstack/vue-query": "^5.17.11"
   },
   "scripts": {
     "clean": "rimraf ./build && rimraf ./coverage",
     "test:eslint": "eslint --ext .ts,.tsx ./src",
     "test:types": "vue-tsc",
     "test:build": "publint --strict",
-    "build": "vite build && vue-tsc"
+    "build": "vite build"
   }
 }