@tanstack/svelte-devtools - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

dist/esm/ComponentHost.js

+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/ComponentHost.svelte
+function ComponentHost($$anchor, $$props) {
+	$.push($$props, true);
+	let CurrentComponent = $.prop($$props, "component", 7), currentComponentProps = $.prop($$props, "componentProps", 7);
+	function update(component, componentProps) {
+		CurrentComponent(component);
+		currentComponentProps(componentProps);
+	}
+	var $$exports = { update };
+	var fragment = $.comment();
+	var node = $.first_child(fragment);
+	$.component(node, CurrentComponent, ($$anchor, CurrentComponent_1) => {
+		CurrentComponent_1($$anchor, $.spread_props(currentComponentProps));
+	});
+	$.append($$anchor, fragment);
+	return $.pop($$exports);
+}
+//#endregion
+export { ComponentHost as default };
+
+//# sourceMappingURL=ComponentHost.js.map

dist/esm/ComponentHost.js.map

+{"version":3,"file":"ComponentHost.js","names":[],"sources":["../../src/ComponentHost.svelte"],"sourcesContent":["<script lang=\"ts\">\n  import type { Component } from 'svelte'\n\n  interface Props {\n    component: Component<any>\n    componentProps: Record<string, unknown>\n  }\n\n  let {\n    component: CurrentComponent,\n    componentProps: currentComponentProps,\n  }: Props = $props()\n\n  export function update(\n    component: Component<any>,\n    componentProps: Record<string, unknown>,\n  ) {\n    CurrentComponent = component\n    currentComponentProps = componentProps\n  }\n</script>\n\n<CurrentComponent {...currentComponentProps} />\n"],"mappings":";;;0CAAA;;CAQE,IAAI,mBACyB,EAAA,KAAA,SAAA,aAAA,EAAA,EACX,wBAAqB,EAAA,KAAA,SAAA,kBAAA,EAAA;CAGhC,SAAS,OACd,WACA,gBACA;EACA,iBAAmB,UAAA;EACnB,sBAAwB,eAAA;;;;;;EAI3B,mBAAgB,UAAA,EAAA,aAAK,sBAAqB,CAAA"}

dist/esm/ComponentHost.svelte.d.ts

+export { SvelteComponent as default } from 'svelte';

src/ComponentHost.svelte

+<script lang="ts">
+  import type { Component } from 'svelte'
+
+  interface Props {
+    component: Component<any>
+    componentProps: Record<string, unknown>
+  }
+
+  let {
+    component: CurrentComponent,
+    componentProps: currentComponentProps,
+  }: Props = $props()
+
+  export function update(
+    component: Component<any>,
+    componentProps: Record<string, unknown>,
+  ) {
+    CurrentComponent = component
+    currentComponentProps = componentProps
+  }
+</script>
+
+<CurrentComponent {...currentComponentProps} />

dist/esm/devtools.svelte.d.ts

@@ -11,4 +11,4 @@ import { TanStackDevtoolsSvelteInit } from './types.js';
     private renderComponent;
-    private destroyComponentsInContainer;
+    private destroyComponentInContainer;
     private destroyAllComponents;
 }

dist/esm/devtools.svelte.js

@@ -0,4 +1,5 @@
+import ComponentHost from "./ComponentHost.js";
 import "svelte/internal/client";
-import { mount, unmount } from "svelte";
-import { PLUGIN_CONTAINER_ID, TanStackDevtoolsCore } from "@tanstack/devtools";
+import { flushSync, mount, unmount } from "svelte";
+import { TanStackDevtoolsCore } from "@tanstack/devtools";
 //#region src/devtools.svelte.ts
@@ -8,3 +9,3 @@ var TanStackDevtoolsSvelteAdapter = class {
 		this.devtools = null;
-		this.mountedComponents = [];
+		this.mountedComponents = /* @__PURE__ */ new Map();
 	}
@@ -21,10 +22,7 @@ mount(target, init) {
 	update(init) {
-		if (this.devtools) {
-			this.destroyAllComponents();
-			this.devtools.setConfig({
-				config: init.config,
-				eventBusConfig: init.eventBusConfig,
-				plugins: this.getPluginsMap(init.plugins)
-			});
-		}
+		if (this.devtools) this.devtools.setConfig({
+			config: init.config,
+			eventBusConfig: init.eventBusConfig,
+			plugins: this.getPluginsMap(init.plugins)
+		});
 	}
@@ -43,19 +41,25 @@ destroy() {
 	convertPlugin(plugin) {
+		let panelContainer;
 		return {
 			id: plugin.id,
 			defaultOpen: plugin.defaultOpen,
-			name: typeof plugin.name === "string" ? plugin.name : (el, theme) => {
+			name: typeof plugin.name === "string" ? plugin.name : (el, props) => {
 				this.renderComponent(plugin.name, el, {
-					theme,
+					...props,
 					...plugin.props ?? {}
 				});
 			},
-			render: (el, theme) => {
+			render: (el, props) => {
+				if (panelContainer && panelContainer !== el) this.destroyComponentInContainer(panelContainer);
+				panelContainer = el;
 				this.renderComponent(plugin.component, el, {
-					theme,
+					...props,
 					...plugin.props ?? {}
 				});
 			},
-			destroy: (pluginId) => {
-				this.destroyComponentsInContainer(`${PLUGIN_CONTAINER_ID}-${pluginId}`);
+			destroy: () => {
+				if (panelContainer) {
+					this.destroyComponentInContainer(panelContainer);
+					panelContainer = void 0;
+				}
 			}
@@ -65,24 +69,27 @@ };
 	renderComponent(component, container, props) {
-		const instance = mount(component, {
+		const mounted = this.mountedComponents.get(container);
+		if (mounted) {
+			flushSync(() => mounted.update(component, props));
+			return;
+		}
+		const instance = mount(ComponentHost, {
 			target: container,
-			props
-		});
-		const containerId = container.id;
-		this.mountedComponents.push({
-			instance,
-			containerId
-		});
-	}
-	destroyComponentsInContainer(containerId) {
-		this.mountedComponents = this.mountedComponents.filter((entry) => {
-			if (entry.containerId === containerId) {
-				unmount(entry.instance);
-				return false;
+			props: {
+				component,
+				componentProps: props
 			}
-			return true;
 		});
+		this.mountedComponents.set(container, instance);
+		flushSync();
 	}
+	destroyComponentInContainer(container) {
+		const instance = this.mountedComponents.get(container);
+		if (!instance) return;
+		this.mountedComponents.delete(container);
+		unmount(instance);
+	}
 	destroyAllComponents() {
-		for (const entry of this.mountedComponents) unmount(entry.instance);
-		this.mountedComponents = [];
+		const instances = [...this.mountedComponents.values()];
+		this.mountedComponents.clear();
+		for (const instance of instances) unmount(instance);
 	}
@@ -89,0 +96,0 @@ };

dist/esm/devtools.svelte.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"devtools.svelte.js","names":[],"sources":["../../src/devtools.svelte.ts"],"sourcesContent":["import { mount, unmount } from 'svelte'\nimport { PLUGIN_CONTAINER_ID, TanStackDevtoolsCore } from '@tanstack/devtools'\nimport type { Component } from 'svelte'\nimport type { TanStackDevtoolsPlugin } from '@tanstack/devtools'\nimport type {\n  TanStackDevtoolsSvelteInit,\n  TanStackDevtoolsSveltePlugin,\n} from './types'\n\ntype MountedComponent = ReturnType<typeof mount>\n\nexport class TanStackDevtoolsSvelteAdapter {\n  private devtools: TanStackDevtoolsCore | null = null\n  private mountedComponents: Array<{\n    instance: MountedComponent\n    containerId: string\n  }> = []\n\n  mount(target: HTMLElement, init: TanStackDevtoolsSvelteInit) {\n    const pluginsMap = this.getPluginsMap(init.plugins)\n\n    this.devtools = new TanStackDevtoolsCore({\n      config: init.config,\n      eventBusConfig: init.eventBusConfig,\n      plugins: pluginsMap,\n    })\n\n    this.devtools.mount(target)\n  }\n\n  update(init: TanStackDevtoolsSvelteInit) {\n    if (this.devtools) {\n      // Tear down the previously mounted plugin components before re-applying\n      // config. The core re-invokes `render`/`name` for the new plugin set, so\n      // without this the old Svelte instances are orphaned and leak.\n      this.destroyAllComponents()\n      this.devtools.setConfig({\n        config: init.config,\n        eventBusConfig: init.eventBusConfig,\n        plugins: this.getPluginsMap(init.plugins),\n      })\n    }\n  }\n\n  destroy() {\n    this.destroyAllComponents()\n    if (this.devtools) {\n      this.devtools.unmount()\n      this.devtools = null\n    }\n  }\n\n  private getPluginsMap(\n    plugins?: Array<TanStackDevtoolsSveltePlugin>,\n  ): Array<TanStackDevtoolsPlugin> {\n    if (!plugins) return []\n    return plugins.map((plugin) => this.convertPlugin(plugin))\n  }\n\n  private convertPlugin(\n    plugin: TanStackDevtoolsSveltePlugin,\n  ): TanStackDevtoolsPlugin {\n    return {\n      id: plugin.id,\n      defaultOpen: plugin.defaultOpen,\n      name:\n        typeof plugin.name === 'string'\n          ? plugin.name\n          : (el, theme) => {\n              this.renderComponent(plugin.name as Component<any>, el, {\n                theme,\n                ...(plugin.props ?? {}),\n              })\n            },\n      render: (el, theme) => {\n        this.renderComponent(plugin.component, el, {\n          theme,\n          ...(plugin.props ?? {}),\n        })\n      },\n      destroy: (pluginId) => {\n        this.destroyComponentsInContainer(`${PLUGIN_CONTAINER_ID}-${pluginId}`)\n      },\n    }\n  }\n\n  private renderComponent(\n    component: Component<any>,\n    container: HTMLElement,\n    props: Record<string, unknown>,\n  ) {\n    const instance = mount(component, {\n      target: container,\n      props,\n    })\n\n    const containerId = container.id\n    this.mountedComponents.push({ instance, containerId })\n  }\n\n  private destroyComponentsInContainer(containerId: string) {\n    this.mountedComponents = this.mountedComponents.filter((entry) => {\n      if (entry.containerId === containerId) {\n        unmount(entry.instance)\n        return false\n      }\n      return true\n    })\n  }\n\n  private destroyAllComponents() {\n    for (const entry of this.mountedComponents) {\n      unmount(entry.instance)\n    }\n    this.mountedComponents = []\n  }\n}\n"],"mappings":";;;;AAWA,IAAa,gCAAb,MAA2C;;kBACO;;;CAMhD,MAAM,QAAqB,MAAkC;EAC3D,MAAM,aAAa,KAAK,cAAc,KAAK,QAAA;EAE3C,KAAK,WAAW,IAAI,qBAAA;GAClB,QAAQ,KAAK;GACb,gBAAgB,KAAK;GACrB,SAAS;;EAGX,KAAK,SAAS,MAAM,OAAA;;CAGtB,OAAO,MAAkC;EACvC,IAAI,KAAK,UAAU;GAIjB,KAAK,sBAAA;GACL,KAAK,SAAS,UAAA;IACZ,QAAQ,KAAK;IACb,gBAAgB,KAAK;IACrB,SAAS,KAAK,cAAc,KAAK,QAAA;;;;CAKvC,UAAU;EACR,KAAK,sBAAA;EACL,IAAI,KAAK,UAAU;GACjB,KAAK,SAAS,SAAA;GACd,KAAK,WAAW;;;CAIpB,cACE,SAC+B;EAC/B,IAAA,CAAK,SAAS,OAAA,EAAA;EACd,OAAO,QAAQ,KAAK,WAAW,KAAK,cAAc,OAAA,CAAA;;CAGpD,cACE,QACwB;EACxB,OAAA;GACE,IAAI,OAAO;GACX,aAAa,OAAO;GACpB,MAAA,OACS,OAAO,SAAS,WACnB,OAAO,QACN,IAAI,UAAU;IACb,KAAK,gBAAgB,OAAO,MAAwB,IAAA;KAClD;KAAA,GACI,OAAO,SAAA,EAAA;KAAA,CAAA;;GAGrB,SAAS,IAAI,UAAU;IACrB,KAAK,gBAAgB,OAAO,WAAW,IAAA;KACrC;KAAA,GACI,OAAO,SAAA,EAAA;KAAA,CAAA;;GAGf,UAAU,aAAa;IACrB,KAAK,6BAAA,GAAgC,oBAAA,GAAuB,WAAA;;;;CAKlE,gBACE,WACA,WACA,OACA;EACA,MAAM,WAAW,MAAM,WAAA;GACrB,QAAQ;GACR;GAAA,CAAA;EAGF,MAAM,cAAc,UAAU;EAC9B,KAAK,kBAAkB,KAAA;GAAO;GAAU;GAAA,CAAA;;CAG1C,6BAAqC,aAAqB;EACxD,KAAK,oBAAoB,KAAK,kBAAkB,QAAQ,UAAU;GAChE,IAAI,MAAM,gBAAgB,aAAa;IACrC,QAAQ,MAAM,SAAA;IACd,OAAO;;GAET,OAAO;;;CAIX,uBAA+B;EAC7B,KAAK,MAAM,SAAS,KAAK,mBACvB,QAAQ,MAAM,SAAA;EAEhB,KAAK,oBAAA,EAAA"}
+{"version":3,"file":"devtools.svelte.js","names":[],"sources":["../../src/devtools.svelte.ts"],"sourcesContent":["import { flushSync, mount, unmount } from 'svelte'\nimport { TanStackDevtoolsCore } from '@tanstack/devtools'\nimport ComponentHost from './ComponentHost.svelte'\nimport type { Component } from 'svelte'\nimport type { TanStackDevtoolsPlugin } from '@tanstack/devtools'\nimport type {\n  TanStackDevtoolsSvelteInit,\n  TanStackDevtoolsSveltePlugin,\n} from './types'\n\ntype MountedComponent = ReturnType<typeof ComponentHost>\n\nexport class TanStackDevtoolsSvelteAdapter {\n  private devtools: TanStackDevtoolsCore | null = null\n  private mountedComponents = new Map<HTMLElement, MountedComponent>()\n\n  mount(target: HTMLElement, init: TanStackDevtoolsSvelteInit) {\n    const pluginsMap = this.getPluginsMap(init.plugins)\n\n    this.devtools = new TanStackDevtoolsCore({\n      config: init.config,\n      eventBusConfig: init.eventBusConfig,\n      plugins: pluginsMap,\n    })\n\n    this.devtools.mount(target)\n  }\n\n  update(init: TanStackDevtoolsSvelteInit) {\n    if (this.devtools) {\n      this.devtools.setConfig({\n        config: init.config,\n        eventBusConfig: init.eventBusConfig,\n        plugins: this.getPluginsMap(init.plugins),\n      })\n    }\n  }\n\n  destroy() {\n    this.destroyAllComponents()\n    if (this.devtools) {\n      this.devtools.unmount()\n      this.devtools = null\n    }\n  }\n\n  private getPluginsMap(\n    plugins?: Array<TanStackDevtoolsSveltePlugin>,\n  ): Array<TanStackDevtoolsPlugin> {\n    if (!plugins) return []\n    return plugins.map((plugin) => this.convertPlugin(plugin))\n  }\n\n  private convertPlugin(\n    plugin: TanStackDevtoolsSveltePlugin,\n  ): TanStackDevtoolsPlugin {\n    let panelContainer: HTMLElement | undefined\n\n    return {\n      id: plugin.id,\n      defaultOpen: plugin.defaultOpen,\n      name:\n        typeof plugin.name === 'string'\n          ? plugin.name\n          : (el, props) => {\n              this.renderComponent(plugin.name as Component<any>, el, {\n                ...props,\n                ...(plugin.props ?? {}),\n              })\n            },\n      render: (el, props) => {\n        if (panelContainer && panelContainer !== el) {\n          this.destroyComponentInContainer(panelContainer)\n        }\n        panelContainer = el\n        this.renderComponent(plugin.component, el, {\n          ...props,\n          ...(plugin.props ?? {}),\n        })\n      },\n      destroy: () => {\n        if (panelContainer) {\n          this.destroyComponentInContainer(panelContainer)\n          panelContainer = undefined\n        }\n      },\n    }\n  }\n\n  private renderComponent(\n    component: Component<any>,\n    container: HTMLElement,\n    props: Record<string, unknown>,\n  ) {\n    const mounted = this.mountedComponents.get(container)\n    if (mounted) {\n      flushSync(() => mounted.update(component, props))\n      return\n    }\n\n    const instance = mount(ComponentHost, {\n      target: container,\n      props: { component, componentProps: props },\n    })\n    this.mountedComponents.set(container, instance)\n    flushSync()\n  }\n\n  private destroyComponentInContainer(container: HTMLElement) {\n    const instance = this.mountedComponents.get(container)\n    if (!instance) return\n\n    this.mountedComponents.delete(container)\n    unmount(instance)\n  }\n\n  private destroyAllComponents() {\n    const instances = [...this.mountedComponents.values()]\n    this.mountedComponents.clear()\n    for (const instance of instances) {\n      unmount(instance)\n    }\n  }\n}\n"],"mappings":";;;;;AAYA,IAAa,gCAAb,MAA2C;;kBACO;2CACpB,IAAI,KAAA;;CAEhC,MAAM,QAAqB,MAAkC;EAC3D,MAAM,aAAa,KAAK,cAAc,KAAK,QAAA;EAE3C,KAAK,WAAW,IAAI,qBAAA;GAClB,QAAQ,KAAK;GACb,gBAAgB,KAAK;GACrB,SAAS;;EAGX,KAAK,SAAS,MAAM,OAAA;;CAGtB,OAAO,MAAkC;EACvC,IAAI,KAAK,UACP,KAAK,SAAS,UAAA;GACZ,QAAQ,KAAK;GACb,gBAAgB,KAAK;GACrB,SAAS,KAAK,cAAc,KAAK,QAAA;;;CAKvC,UAAU;EACR,KAAK,sBAAA;EACL,IAAI,KAAK,UAAU;GACjB,KAAK,SAAS,SAAA;GACd,KAAK,WAAW;;;CAIpB,cACE,SAC+B;EAC/B,IAAA,CAAK,SAAS,OAAA,EAAA;EACd,OAAO,QAAQ,KAAK,WAAW,KAAK,cAAc,OAAA,CAAA;;CAGpD,cACE,QACwB;EACxB,IAAI;EAEJ,OAAA;GACE,IAAI,OAAO;GACX,aAAa,OAAO;GACpB,MAAA,OACS,OAAO,SAAS,WACnB,OAAO,QACN,IAAI,UAAU;IACb,KAAK,gBAAgB,OAAO,MAAwB,IAAA;KAAA,GAC/C;KAAA,GACC,OAAO,SAAA,EAAA;KAAA,CAAA;;GAGrB,SAAS,IAAI,UAAU;IACrB,IAAI,kBAAkB,mBAAmB,IACvC,KAAK,4BAA4B,eAAA;IAEnC,iBAAiB;IACjB,KAAK,gBAAgB,OAAO,WAAW,IAAA;KAAA,GAClC;KAAA,GACC,OAAO,SAAA,EAAA;KAAA,CAAA;;GAGf,eAAe;IACb,IAAI,gBAAgB;KAClB,KAAK,4BAA4B,eAAA;KACjC,iBAAiB,KAAA;;;;;CAMzB,gBACE,WACA,WACA,OACA;EACA,MAAM,UAAU,KAAK,kBAAkB,IAAI,UAAA;EAC3C,IAAI,SAAS;GACX,gBAAgB,QAAQ,OAAO,WAAW,MAAA,CAAA;GAC1C;;EAGF,MAAM,WAAW,MAAM,eAAA;GACrB,QAAQ;GACR,OAAA;IAAS;IAAW,gBAAgB;IAAA;;EAEtC,KAAK,kBAAkB,IAAI,WAAW,SAAA;EACtC,WAAA;;CAGF,4BAAoC,WAAwB;EAC1D,MAAM,WAAW,KAAK,kBAAkB,IAAI,UAAA;EAC5C,IAAA,CAAK,UAAU;EAEf,KAAK,kBAAkB,OAAO,UAAA;EAC9B,QAAQ,SAAA;;CAGV,uBAA+B;EAC7B,MAAM,YAAA,CAAA,GAAgB,KAAK,kBAAkB,QAAA,CAAA;EAC7C,KAAK,kBAAkB,OAAA;EACvB,KAAK,MAAM,YAAY,WACrB,QAAQ,SAAA"}

package.json

 {
   "name": "@tanstack/svelte-devtools",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "TanStack Devtools is a set of tools for building advanced devtools for your Svelte application.",
@@ -43,3 +43,3 @@ "author": "Tanner Linsley",
   "dependencies": {
-    "@tanstack/devtools": "0.14.1"
+    "@tanstack/devtools": "0.14.2"
   },
@@ -46,0 +46,0 @@ "devDependencies": {

src/devtools.svelte.ts

@@ -1,3 +0,4 @@
-import { mount, unmount } from 'svelte'
-import { PLUGIN_CONTAINER_ID, TanStackDevtoolsCore } from '@tanstack/devtools'
+import { flushSync, mount, unmount } from 'svelte'
+import { TanStackDevtoolsCore } from '@tanstack/devtools'
+import ComponentHost from './ComponentHost.svelte'
 import type { Component } from 'svelte'
@@ -10,10 +11,7 @@ import type { TanStackDevtoolsPlugin } from '@tanstack/devtools'
 
-type MountedComponent = ReturnType<typeof mount>
+type MountedComponent = ReturnType<typeof ComponentHost>
 
 export class TanStackDevtoolsSvelteAdapter {
   private devtools: TanStackDevtoolsCore | null = null
-  private mountedComponents: Array<{
-    instance: MountedComponent
-    containerId: string
-  }> = []
+  private mountedComponents = new Map<HTMLElement, MountedComponent>()
 
@@ -34,6 +32,2 @@ mount(target: HTMLElement, init: TanStackDevtoolsSvelteInit) {
     if (this.devtools) {
-      // Tear down the previously mounted plugin components before re-applying
-      // config. The core re-invokes `render`/`name` for the new plugin set, so
-      // without this the old Svelte instances are orphaned and leak.
-      this.destroyAllComponents()
       this.devtools.setConfig({
@@ -65,2 +59,4 @@ config: init.config,
   ): TanStackDevtoolsPlugin {
+    let panelContainer: HTMLElement | undefined
+
     return {
@@ -72,16 +68,23 @@ id: plugin.id,
           ? plugin.name
-          : (el, theme) => {
+          : (el, props) => {
               this.renderComponent(plugin.name as Component<any>, el, {
-                theme,
+                ...props,
                 ...(plugin.props ?? {}),
               })
             },
-      render: (el, theme) => {
+      render: (el, props) => {
+        if (panelContainer && panelContainer !== el) {
+          this.destroyComponentInContainer(panelContainer)
+        }
+        panelContainer = el
         this.renderComponent(plugin.component, el, {
-          theme,
+          ...props,
           ...(plugin.props ?? {}),
         })
       },
-      destroy: (pluginId) => {
-        this.destroyComponentsInContainer(`${PLUGIN_CONTAINER_ID}-${pluginId}`)
+      destroy: () => {
+        if (panelContainer) {
+          this.destroyComponentInContainer(panelContainer)
+          panelContainer = undefined
+        }
       },
@@ -96,27 +99,31 @@ }
   ) {
-    const instance = mount(component, {
+    const mounted = this.mountedComponents.get(container)
+    if (mounted) {
+      flushSync(() => mounted.update(component, props))
+      return
+    }
+
+    const instance = mount(ComponentHost, {
       target: container,
-      props,
+      props: { component, componentProps: props },
     })
-
-    const containerId = container.id
-    this.mountedComponents.push({ instance, containerId })
+    this.mountedComponents.set(container, instance)
+    flushSync()
   }
 
-  private destroyComponentsInContainer(containerId: string) {
-    this.mountedComponents = this.mountedComponents.filter((entry) => {
-      if (entry.containerId === containerId) {
-        unmount(entry.instance)
-        return false
-      }
-      return true
-    })
+  private destroyComponentInContainer(container: HTMLElement) {
+    const instance = this.mountedComponents.get(container)
+    if (!instance) return
+
+    this.mountedComponents.delete(container)
+    unmount(instance)
   }
 
   private destroyAllComponents() {
-    for (const entry of this.mountedComponents) {
-      unmount(entry.instance)
+    const instances = [...this.mountedComponents.values()]
+    this.mountedComponents.clear()
+    for (const instance of instances) {
+      unmount(instance)
     }
-    this.mountedComponents = []
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

21145

17.75%

Number of package files

19

26.67%

Lines of code

313

12.19%

Dependency changes

• + Added

  @tanstack/devtools@0.14.2
  (transitive)

• - Removed

  @tanstack/devtools@0.14.1
  (transitive)

• Updated

  @tanstack/devtools@0.14.2