@tanstack/devtools 0.8.0 → 0.8.2

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.
Files changed (9) hide show
  1. package/dist/dev.js +1 -1
  2. package/dist/devtools/{MYTOQ6G4.js → GGWR254Q.js} +9 -1
  3. package/dist/devtools/{RHZRAMXS.js → I7ZVYS6Q.js} +9 -1
  4. package/dist/index.d.ts +1 -0
  5. package/dist/index.js +1 -1
  6. package/package.json +1 -1
  7. package/src/components/source-inspector.tsx +7 -3
  8. package/src/context/devtools-context.tsx +2 -0
  9. package/src/context/use-devtools-context.ts +8 -0
package/dist/dev.js CHANGED
@@ -30,7 +30,7 @@ var TanStackDevtoolsCore = class {
30
30
  const mountTo = el;
31
31
  const dispose = render(() => {
32
32
  const _self$ = this;
33
- this.#Component = lazy(() => import('./devtools/MYTOQ6G4.js'));
33
+ this.#Component = lazy(() => import('./devtools/GGWR254Q.js'));
34
34
  const Devtools = this.#Component;
35
35
  this.#eventBus = new ClientEventBus(this.#eventBusConfig);
36
36
  this.#eventBus.start();
package/dist/devtools/{MYTOQ6G4.js → GGWR254Q.js} RENAMED
@@ -93,6 +93,12 @@ var usePlugins = () => {
93
93
  const toggleActivePlugins = (pluginId) => {
94
94
  setStore((prev) => {
95
95
  const isActive = prev.state.activePlugins.includes(pluginId);
96
+ const currentPlugin = store.plugins?.find(
97
+ (plugin) => plugin.id === pluginId
98
+ );
99
+ if (currentPlugin?.destroy && isActive) {
100
+ currentPlugin.destroy(pluginId);
101
+ }
96
102
  const updatedPlugins = isActive ? prev.state.activePlugins.filter((id) => id !== pluginId) : [...prev.state.activePlugins, pluginId];
97
103
  if (updatedPlugins.length > MAX_ACTIVE_PLUGINS) return prev;
98
104
  return {
@@ -4035,7 +4041,9 @@ var SourceInspector = () => {
4035
4041
  window.getSelection()?.removeAllRanges();
4036
4042
  e.preventDefault();
4037
4043
  e.stopPropagation();
4038
- fetch(`${location.origin}/__tsd/open-source?source=${encodeURIComponent(highlightState.dataSource)}`).catch(() => {
4044
+ const baseUrl = new URL(import.meta.env?.BASE_URL ?? "/", location.origin);
4045
+ const url = new URL(`__tsd/open-source?source=${encodeURIComponent(highlightState.dataSource)}`, baseUrl);
4046
+ fetch(url).catch(() => {
4039
4047
  });
4040
4048
  });
4041
4049
  const currentElementBoxStyles = createMemo(() => {
package/dist/devtools/{RHZRAMXS.js → I7ZVYS6Q.js} RENAMED
@@ -93,6 +93,12 @@ var usePlugins = () => {
93
93
  const toggleActivePlugins = (pluginId) => {
94
94
  setStore((prev) => {
95
95
  const isActive = prev.state.activePlugins.includes(pluginId);
96
+ const currentPlugin = store.plugins?.find(
97
+ (plugin) => plugin.id === pluginId
98
+ );
99
+ if (currentPlugin?.destroy && isActive) {
100
+ currentPlugin.destroy(pluginId);
101
+ }
96
102
  const updatedPlugins = isActive ? prev.state.activePlugins.filter((id) => id !== pluginId) : [...prev.state.activePlugins, pluginId];
97
103
  if (updatedPlugins.length > MAX_ACTIVE_PLUGINS) return prev;
98
104
  return {
@@ -3498,7 +3504,9 @@ var SourceInspector = () => {
3498
3504
  window.getSelection()?.removeAllRanges();
3499
3505
  e.preventDefault();
3500
3506
  e.stopPropagation();
3501
- fetch(`${location.origin}/__tsd/open-source?source=${encodeURIComponent(highlightState.dataSource)}`).catch(() => {
3507
+ const baseUrl = new URL(import.meta.env?.BASE_URL ?? "/", location.origin);
3508
+ const url = new URL(`__tsd/open-source?source=${encodeURIComponent(highlightState.dataSource)}`, baseUrl);
3509
+ fetch(url).catch(() => {
3502
3510
  });
3503
3511
  });
3504
3512
  const currentElementBoxStyles = createMemo(() => {
package/dist/index.d.ts CHANGED
@@ -144,6 +144,7 @@ interface TanStackDevtoolsPlugin {
144
144
  * ```
145
145
  */
146
146
  render: (el: HTMLDivElement, theme: DevtoolsStore['settings']['theme']) => void;
147
+ destroy?: (pluginId: string) => void;
147
148
  }
148
149
  type TanStackDevtoolsConfig = DevtoolsStore['settings'];
149
150
 
package/dist/index.js CHANGED
@@ -30,7 +30,7 @@ var TanStackDevtoolsCore = class {
30
30
  const mountTo = el;
31
31
  const dispose = render(() => {
32
32
  const _self$ = this;
33
- this.#Component = lazy(() => import('./devtools/MYTOQ6G4.js'));
33
+ this.#Component = lazy(() => import('./devtools/GGWR254Q.js'));
34
34
  const Devtools = this.#Component;
35
35
  this.#eventBus = new ClientEventBus(this.#eventBusConfig);
36
36
  this.#eventBus.start();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/devtools",
3
- "version": "0.8.0",
3
+ "version": "0.8.2",
4
4
  "description": "TanStack Devtools is a set of tools for building advanced devtools for your application.",
5
5
  "author": "Tanner Linsley",
6
6
  "license": "MIT",
package/src/components/source-inspector.tsx CHANGED
@@ -78,11 +78,15 @@ export const SourceInspector = () => {
78
78
  e.preventDefault()
79
79
  e.stopPropagation()
80
80
 
81
- fetch(
82
- `${location.origin}/__tsd/open-source?source=${encodeURIComponent(
81
+ // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
82
+ const baseUrl = new URL(import.meta.env?.BASE_URL ?? '/', location.origin)
83
+ const url = new URL(
84
+ `__tsd/open-source?source=${encodeURIComponent(
83
85
  highlightState.dataSource,
84
86
  )}`,
85
- ).catch(() => {})
87
+ baseUrl,
88
+ )
89
+ fetch(url).catch(() => {})
86
90
  })
87
91
 
88
92
  const currentElementBoxStyles = createMemo(() => {
package/src/context/devtools-context.tsx CHANGED
@@ -73,6 +73,8 @@ export interface TanStackDevtoolsPlugin {
73
73
  el: HTMLDivElement,
74
74
  theme: DevtoolsStore['settings']['theme'],
75
75
  ) => void
76
+
77
+ destroy?: (pluginId: string) => void
76
78
  }
77
79
  export const DevtoolsContext = createContext<{
78
80
  store: DevtoolsStore
package/src/context/use-devtools-context.ts CHANGED
@@ -48,6 +48,14 @@ export const usePlugins = () => {
48
48
  setStore((prev) => {
49
49
  const isActive = prev.state.activePlugins.includes(pluginId)
50
50
 
51
+ const currentPlugin = store.plugins?.find(
52
+ (plugin) => plugin.id === pluginId,
53
+ )
54
+
55
+ if (currentPlugin?.destroy && isActive) {
56
+ currentPlugin.destroy(pluginId)
57
+ }
58
+
51
59
  const updatedPlugins = isActive
52
60
  ? prev.state.activePlugins.filter((id) => id !== pluginId)
53
61
  : [...prev.state.activePlugins, pluginId]