@tanstack/pacer-devtools 1.1.3 → 1.1.4

package/dist/components/Shell.js

@@ -1,107 +0,0 @@
-import { usePacerDevtoolsState } from "../PacerContextProvider.js";
-import { useStyles } from "../styles/use-styles.js";
-import { UTIL_GROUPS } from "./util-groups.js";
-import { UtilList } from "./UtilList.js";
-import { DetailsPanel } from "./DetailsPanel.js";
-import { createMemo, createSignal, onCleanup, onMount } from "solid-js";
-import { className, createComponent, delegateEvents, effect, insert, setStyleProperty, template } from "solid-js/web";
-import { Header, HeaderLogo, MainPanel } from "@tanstack/devtools-ui";
-
-//#region src/components/Shell.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div><div style=min-width:150px;max-width:800px></div><div></div><div style=flex:1><div>Details`);
-function Shell() {
-	const styles = useStyles();
-	const state = usePacerDevtoolsState();
-	const utilState = () => state;
-	const [selectedKey, setSelectedKey] = createSignal(null);
-	const [leftPanelWidth, setLeftPanelWidth] = createSignal(300);
-	const [isDragging, setIsDragging] = createSignal(false);
-	const selectedInstance = createMemo(() => {
-		const key = selectedKey();
-		if (!key) return null;
-		for (const group of UTIL_GROUPS) {
-			const instance = utilState()[group.key].find((inst) => inst.key === key);
-			if (instance) return {
-				instance,
-				type: group.displayName
-			};
-		}
-		return null;
-	});
-	let dragStartX = 0;
-	let dragStartWidth = 0;
-	const handleMouseDown = (e) => {
-		e.preventDefault();
-		e.stopPropagation();
-		setIsDragging(true);
-		document.body.style.cursor = "col-resize";
-		document.body.style.userSelect = "none";
-		dragStartX = e.clientX;
-		dragStartWidth = leftPanelWidth();
-	};
-	const handleMouseMove = (e) => {
-		if (!isDragging()) return;
-		e.preventDefault();
-		const deltaX = e.clientX - dragStartX;
-		setLeftPanelWidth(Math.max(150, Math.min(800, dragStartWidth + deltaX)));
-	};
-	const handleMouseUp = () => {
-		setIsDragging(false);
-		document.body.style.cursor = "";
-		document.body.style.userSelect = "";
-	};
-	onMount(() => {
-		document.addEventListener("mousemove", handleMouseMove);
-		document.addEventListener("mouseup", handleMouseUp);
-	});
-	onCleanup(() => {
-		document.removeEventListener("mousemove", handleMouseMove);
-		document.removeEventListener("mouseup", handleMouseUp);
-	});
-	return createComponent(MainPanel, { get children() {
-		return [createComponent(Header, { get children() {
-			return createComponent(HeaderLogo, {
-				flavor: {
-					light: "#84cc16",
-					dark: "#84cc16"
-				},
-				children: "TanStack Pacer"
-			});
-		} }), (() => {
-			var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.nextSibling, _el$5 = _el$4.firstChild;
-			insert(_el$2, createComponent(UtilList, {
-				selectedKey,
-				setSelectedKey,
-				utilState
-			}));
-			_el$3.$$mousedown = handleMouseDown;
-			insert(_el$4, createComponent(DetailsPanel, {
-				selectedInstance,
-				utilState
-			}), null);
-			effect((_p$) => {
-				var _v$ = styles().mainContainer, _v$2 = styles().leftPanel, _v$3 = `${leftPanelWidth()}px`, _v$4 = `${styles().dragHandle} ${isDragging() ? "dragging" : ""}`, _v$5 = styles().rightPanel, _v$6 = styles().panelHeader;
-				_v$ !== _p$.e && className(_el$, _p$.e = _v$);
-				_v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
-				_v$3 !== _p$.a && setStyleProperty(_el$2, "width", _p$.a = _v$3);
-				_v$4 !== _p$.o && className(_el$3, _p$.o = _v$4);
-				_v$5 !== _p$.i && className(_el$4, _p$.i = _v$5);
-				_v$6 !== _p$.n && className(_el$5, _p$.n = _v$6);
-				return _p$;
-			}, {
-				e: void 0,
-				t: void 0,
-				a: void 0,
-				o: void 0,
-				i: void 0,
-				n: void 0
-			});
-			return _el$;
-		})()];
-	} });
-}
-delegateEvents(["mousedown"]);
-
-//#endregion
-export { Shell };
-//# sourceMappingURL=Shell.js.map

package/dist/components/Shell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Shell.js","names":["createMemo","createSignal","onCleanup","onMount","Header","HeaderLogo","MainPanel","useStyles","usePacerDevtoolsState","UTIL_GROUPS","UtilList","DetailsPanel","StateKey","Shell","styles","state","utilState","selectedKey","setSelectedKey","leftPanelWidth","setLeftPanelWidth","isDragging","setIsDragging","selectedInstance","key","group","instance","Record","Array","find","inst","type","displayName","dragStartX","dragStartWidth","handleMouseDown","e","MouseEvent","preventDefault","stopPropagation","document","body","style","cursor","userSelect","clientX","handleMouseMove","deltaX","newWidth","Math","max","min","handleMouseUp","addEventListener","removeEventListener","_$createComponent","children","flavor","light","dark","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_el$5","_$insert","$$mousedown","_$effect","_p$","_v$","mainContainer","_v$2","leftPanel","_v$3","_v$4","dragHandle","_v$5","rightPanel","_v$6","panelHeader","_$className","t","a","_$setStyleProperty","o","i","n","undefined","_$delegateEvents"],"sources":["../../src/components/Shell.tsx"],"sourcesContent":["import { createMemo, createSignal, onCleanup, onMount } from 'solid-js'\nimport { Header, HeaderLogo, MainPanel } from '@tanstack/devtools-ui'\nimport { useStyles } from '../styles/use-styles'\nimport { usePacerDevtoolsState } from '../PacerContextProvider'\nimport { UTIL_GROUPS } from './util-groups'\nimport { UtilList } from './UtilList'\nimport { DetailsPanel } from './DetailsPanel'\nimport type { StateKey } from './util-groups'\n\nexport function Shell() {\n  const styles = useStyles()\n  const state = usePacerDevtoolsState()\n  const utilState = () => state\n  const [selectedKey, setSelectedKey] = createSignal<string | null>(null)\n  const [leftPanelWidth, setLeftPanelWidth] = createSignal(300)\n  const [isDragging, setIsDragging] = createSignal(false)\n\n  const selectedInstance = createMemo(() => {\n    const key = selectedKey()\n    if (!key) return null\n    for (const group of UTIL_GROUPS) {\n      const instance = (utilState() as unknown as Record<StateKey, Array<any>>)[\n        group.key\n      ].find((inst) => inst.key === key)\n      if (instance) return { instance, type: group.displayName }\n    }\n    return null\n  })\n\n  let dragStartX = 0\n  let dragStartWidth = 0\n\n  const handleMouseDown = (e: MouseEvent) => {\n    e.preventDefault()\n    e.stopPropagation()\n    setIsDragging(true)\n    document.body.style.cursor = 'col-resize'\n    document.body.style.userSelect = 'none'\n    dragStartX = e.clientX\n    dragStartWidth = leftPanelWidth()\n  }\n\n  const handleMouseMove = (e: MouseEvent) => {\n    if (!isDragging()) return\n\n    e.preventDefault()\n    const deltaX = e.clientX - dragStartX\n    const newWidth = Math.max(150, Math.min(800, dragStartWidth + deltaX))\n    setLeftPanelWidth(newWidth)\n  }\n\n  const handleMouseUp = () => {\n    setIsDragging(false)\n    document.body.style.cursor = ''\n    document.body.style.userSelect = ''\n  }\n\n  onMount(() => {\n    document.addEventListener('mousemove', handleMouseMove)\n    document.addEventListener('mouseup', handleMouseUp)\n  })\n\n  onCleanup(() => {\n    document.removeEventListener('mousemove', handleMouseMove)\n    document.removeEventListener('mouseup', handleMouseUp)\n  })\n\n  return (\n    <MainPanel>\n      <Header>\n        <HeaderLogo flavor={{ light: '#84cc16', dark: '#84cc16' }}>\n          TanStack Pacer\n        </HeaderLogo>\n      </Header>\n\n      <div class={styles().mainContainer}>\n        <div\n          class={styles().leftPanel}\n          style={{\n            width: `${leftPanelWidth()}px`,\n            'min-width': '150px',\n            'max-width': '800px',\n          }}\n        >\n          <UtilList\n            selectedKey={selectedKey}\n            setSelectedKey={setSelectedKey}\n            utilState={utilState}\n          />\n        </div>\n\n        <div\n          class={`${styles().dragHandle} ${isDragging() ? 'dragging' : ''}`}\n          onMouseDown={handleMouseDown}\n        />\n\n        <div class={styles().rightPanel} style={{ flex: 1 }}>\n          <div class={styles().panelHeader}>Details</div>\n          <DetailsPanel\n            selectedInstance={selectedInstance}\n            utilState={utilState}\n          />\n        </div>\n      </div>\n    </MainPanel>\n  )\n}\n"],"mappings":";;;;;;;;;;;AASA,SAAgBa,QAAQ;CACtB,MAAMC,SAASP,WAAW;CAC1B,MAAMQ,QAAQP,uBAAuB;CACrC,MAAMQ,kBAAkBD;CACxB,MAAM,CAACE,aAAaC,kBAAkBjB,aAA4B,KAAK;CACvE,MAAM,CAACkB,gBAAgBC,qBAAqBnB,aAAa,IAAI;CAC7D,MAAM,CAACoB,YAAYC,iBAAiBrB,aAAa,MAAM;CAEvD,MAAMsB,mBAAmBvB,iBAAiB;EACxC,MAAMwB,MAAMP,aAAa;AACzB,MAAI,CAACO,IAAK,QAAO;AACjB,OAAK,MAAMC,SAAShB,aAAa;GAC/B,MAAMiB,WAAYV,WAAW,CAC3BS,MAAMD,KACNK,MAAMC,SAASA,KAAKN,QAAQA,IAAI;AAClC,OAAIE,SAAU,QAAO;IAAEA;IAAUK,MAAMN,MAAMO;IAAa;;AAE5D,SAAO;GACP;CAEF,IAAIC,aAAa;CACjB,IAAIC,iBAAiB;CAErB,MAAMC,mBAAmBC,MAAkB;AACzCA,IAAEE,gBAAgB;AAClBF,IAAEG,iBAAiB;AACnBjB,gBAAc,KAAK;AACnBkB,WAASC,KAAKC,MAAMC,SAAS;AAC7BH,WAASC,KAAKC,MAAME,aAAa;AACjCX,eAAaG,EAAES;AACfX,mBAAiBf,gBAAgB;;CAGnC,MAAM2B,mBAAmBV,MAAkB;AACzC,MAAI,CAACf,YAAY,CAAE;AAEnBe,IAAEE,gBAAgB;EAClB,MAAMS,SAASX,EAAES,UAAUZ;AAE3Bb,oBADiB6B,KAAKC,IAAI,KAAKD,KAAKE,IAAI,KAAKjB,iBAAiBa,OAAO,CAAC,CAC3C;;CAG7B,MAAMK,sBAAsB;AAC1B9B,gBAAc,MAAM;AACpBkB,WAASC,KAAKC,MAAMC,SAAS;AAC7BH,WAASC,KAAKC,MAAME,aAAa;;AAGnCzC,eAAc;AACZqC,WAASa,iBAAiB,aAAaP,gBAAgB;AACvDN,WAASa,iBAAiB,WAAWD,cAAc;GACnD;AAEFlD,iBAAgB;AACdsC,WAASc,oBAAoB,aAAaR,gBAAgB;AAC1DN,WAASc,oBAAoB,WAAWF,cAAc;GACtD;AAEF,QAAAG,gBACGjD,WAAS,EAAA,IAAAkD,WAAA;AAAA,SAAA,CAAAD,gBACPnD,QAAM,EAAA,IAAAoD,WAAA;AAAA,UAAAD,gBACJlD,YAAU;IAACoD,QAAQ;KAAEC,OAAO;KAAWC,MAAM;KAAW;IAAAH,UAAA;IAAA,CAAA;KAAA,CAAA,SAAA;GAAA,IAAAI,OAAAC,QAAA,EAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAG,aAAAC,QAAAF,MAAAC,aAAAE,QAAAD,MAAAH;AAAAK,UAAAN,OAAAP,gBActD7C,UAAQ;IACMO;IACGC;IACLF;IAAS,CAAA,CAAA;AAAAgD,SAAAK,cAMTlC;AAAeiC,UAAAF,OAAAX,gBAK3B5C,cAAY;IACOY;IACPP;IAAS,CAAA,EAAA,KAAA;AAAAsD,WAAAC,QAAA;IAAA,IAAAC,MAzBd1D,QAAQ,CAAC2D,eAAaC,OAEvB5D,QAAQ,CAAC6D,WAASC,OAEhB,GAAGzD,gBAAgB,CAAA,KAAI0D,OAazB,GAAG/D,QAAQ,CAACgE,WAAU,GAAIzD,YAAY,GAAG,aAAa,MAAI0D,OAIvDjE,QAAQ,CAACkE,YAAUC,OACjBnE,QAAQ,CAACoE;AAAWV,YAAAD,IAAAnC,KAAA+C,UAAAvB,MAAAW,IAAAnC,IAAAoC,IAAA;AAAAE,aAAAH,IAAAa,KAAAD,UAAArB,OAAAS,IAAAa,IAAAV,KAAA;AAAAE,aAAAL,IAAAc,KAAAC,iBAAAxB,OAAA,SAAAS,IAAAc,IAAAT,KAAA;AAAAC,aAAAN,IAAAgB,KAAAJ,UAAAnB,OAAAO,IAAAgB,IAAAV,KAAA;AAAAE,aAAAR,IAAAiB,KAAAL,UAAAjB,OAAAK,IAAAiB,IAAAT,KAAA;AAAAE,aAAAV,IAAAkB,KAAAN,UAAAhB,OAAAI,IAAAkB,IAAAR,KAAA;AAAA,WAAAV;MAAA;IAAAnC,GAAAsD;IAAAN,GAAAM;IAAAL,GAAAK;IAAAH,GAAAG;IAAAF,GAAAE;IAAAD,GAAAC;IAAA,CAAA;AAAA,UAAA9B;MAAA,CAAA;IAAA,CAAA;;AASzC+B,eAAA,CAAA,YAAA,CAAA"}

package/dist/components/StateHeader.js

@@ -1,85 +0,0 @@
-import { useStyles } from "../styles/use-styles.js";
-import { createSignal, onCleanup, onMount } from "solid-js";
-import { className, effect, insert, template } from "solid-js/web";
-import dayjs from "dayjs";
-import relativeTime from "dayjs/plugin/relativeTime.js";
-
-//#region src/components/StateHeader.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div><div></div><div style=display:flex;align-items:center;gap:16px><div><div>Key</div><div></div><div>Last Updated</div><div> (<!>)</div></div><div style=margin-left:auto;font-weight:bold>% reduction`);
-dayjs.extend(relativeTime);
-function StateHeader(props) {
-	const styles = useStyles();
-	const [now, setNow] = createSignal(Date.now());
-	onMount(() => {
-		const interval = setInterval(() => {
-			setNow(Date.now());
-		}, 1e3);
-		onCleanup(() => {
-			clearInterval(interval);
-		});
-	});
-	const entry = props.selectedInstance();
-	if (!entry) return null;
-	const key = entry.instance.key;
-	const updatedAt = props.utilState().lastUpdatedByKey[key] ?? Date.now();
-	const getRelativeTime = () => {
-		const diffMs = now() - updatedAt;
-		const diffSeconds = Math.floor(diffMs / 1e3);
-		if (diffSeconds < 60) return `${diffSeconds} second${diffSeconds !== 1 ? "s" : ""} ago`;
-		return dayjs(updatedAt).fromNow();
-	};
-	const getReductionPercentage = () => {
-		const state = entry.instance.store?.state || entry.instance.state;
-		if (!state) return 0;
-		const completedExecutions = entry.type.toLowerCase().includes("async") ? state.settleCount || 0 : state.executionCount || 0;
-		if (entry.type.toLowerCase().includes("batcher")) {
-			const totalItemsProcessed = state.totalItemsProcessed || 0;
-			if (totalItemsProcessed === 0) return 0;
-			return Math.round((totalItemsProcessed - completedExecutions) / totalItemsProcessed * 100);
-		}
-		let requestCount = 0;
-		if (state.maybeExecuteCount !== void 0) requestCount = state.maybeExecuteCount;
-		else if (state.addItemCount !== void 0) requestCount = state.addItemCount;
-		else return 0;
-		if (requestCount === 0) return 0;
-		const reduction = requestCount - completedExecutions;
-		return Math.round(reduction / requestCount * 100);
-	};
-	const reductionPercentage = getReductionPercentage();
-	return (() => {
-		var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$4 = _el$2.nextSibling.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling, _el$8 = _el$7.nextSibling, _el$9 = _el$8.firstChild, _el$1 = _el$9.nextSibling;
-		_el$1.nextSibling;
-		var _el$10 = _el$4.nextSibling, _el$11 = _el$10.firstChild;
-		insert(_el$2, () => entry.type);
-		insert(_el$6, key);
-		insert(_el$8, () => new Date(updatedAt).toLocaleTimeString(), _el$9);
-		insert(_el$8, getRelativeTime, _el$1);
-		insert(_el$10, reductionPercentage, _el$11);
-		effect((_p$) => {
-			var _v$ = styles().stateHeader, _v$2 = styles().stateTitle, _v$3 = styles().infoGrid, _v$4 = styles().infoLabel, _v$5 = styles().infoValueMono, _v$6 = styles().infoLabel, _v$7 = styles().infoValueMono, _v$8 = styles().infoValueMono;
-			_v$ !== _p$.e && className(_el$, _p$.e = _v$);
-			_v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
-			_v$3 !== _p$.a && className(_el$4, _p$.a = _v$3);
-			_v$4 !== _p$.o && className(_el$5, _p$.o = _v$4);
-			_v$5 !== _p$.i && className(_el$6, _p$.i = _v$5);
-			_v$6 !== _p$.n && className(_el$7, _p$.n = _v$6);
-			_v$7 !== _p$.s && className(_el$8, _p$.s = _v$7);
-			_v$8 !== _p$.h && className(_el$10, _p$.h = _v$8);
-			return _p$;
-		}, {
-			e: void 0,
-			t: void 0,
-			a: void 0,
-			o: void 0,
-			i: void 0,
-			n: void 0,
-			s: void 0,
-			h: void 0
-		});
-		return _el$;
-	})();
-}
-
-//#endregion
-export { StateHeader };
-//# sourceMappingURL=StateHeader.js.map

package/dist/components/StateHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"StateHeader.js","names":["dayjs","relativeTime","createSignal","onCleanup","onMount","useStyles","extend","StateHeaderProps","selectedInstance","instance","type","utilState","lastUpdatedByKey","Record","StateHeader","props","styles","now","setNow","Date","interval","setInterval","clearInterval","entry","key","updatedAt","getRelativeTime","diffMs","diffSeconds","Math","floor","fromNow","getReductionPercentage","state","store","isAsync","toLowerCase","includes","completedExecutions","settleCount","executionCount","totalItemsProcessed","round","requestCount","maybeExecuteCount","undefined","addItemCount","reduction","reductionPercentage","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","_el$5","_el$6","_el$7","_el$8","_el$9","_el$1","_el$0","_el$10","_el$11","_$insert","toLocaleTimeString","_$effect","_p$","_v$","stateHeader","_v$2","stateTitle","_v$3","infoGrid","_v$4","infoLabel","_v$5","infoValueMono","_v$6","_v$7","_v$8","e","_$className","t","a","o","i","n","s","h"],"sources":["../../src/components/StateHeader.tsx"],"sourcesContent":["import dayjs from 'dayjs'\nimport relativeTime from 'dayjs/plugin/relativeTime.js'\nimport { createSignal, onCleanup, onMount } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\ndayjs.extend(relativeTime)\n\ntype StateHeaderProps = {\n  selectedInstance: () => { instance: any; type: string } | null\n  utilState: () => { lastUpdatedByKey: Record<string, number> }\n}\n\nexport function StateHeader(props: StateHeaderProps) {\n  const styles = useStyles()\n  const [now, setNow] = createSignal(Date.now())\n\n  onMount(() => {\n    const interval = setInterval(() => {\n      setNow(Date.now())\n    }, 1000)\n\n    onCleanup(() => {\n      clearInterval(interval)\n    })\n  })\n\n  const entry = props.selectedInstance()\n  if (!entry) return null\n\n  const key = entry.instance.key as string\n  const updatedAt = props.utilState().lastUpdatedByKey[key] ?? Date.now()\n\n  const getRelativeTime = () => {\n    const diffMs = now() - updatedAt\n    const diffSeconds = Math.floor(diffMs / 1000)\n\n    if (diffSeconds < 60) {\n      return `${diffSeconds} second${diffSeconds !== 1 ? 's' : ''} ago`\n    }\n\n    return dayjs(updatedAt).fromNow()\n  }\n\n  const getReductionPercentage = () => {\n    const state = entry.instance.store?.state || entry.instance.state\n\n    if (!state) return 0\n\n    // Use settleCount for async utilities, executionCount for sync utilities\n    const isAsync = entry.type.toLowerCase().includes('async')\n    const completedExecutions = isAsync\n      ? state.settleCount || 0\n      : state.executionCount || 0\n\n    // For batchers, calculate reduction based on items processed vs executions\n    if (entry.type.toLowerCase().includes('batcher')) {\n      const totalItemsProcessed = state.totalItemsProcessed || 0\n      if (totalItemsProcessed === 0) return 0\n      return Math.round(\n        ((totalItemsProcessed - completedExecutions) / totalItemsProcessed) *\n          100,\n      )\n    }\n\n    // For other utilities, calculate reduction based on request tracking\n    let requestCount = 0\n\n    if (state.maybeExecuteCount !== undefined) {\n      requestCount = state.maybeExecuteCount\n    } else if (state.addItemCount !== undefined) {\n      requestCount = state.addItemCount\n    } else {\n      // For utilities that don't track requests, show 0%\n      return 0\n    }\n\n    if (requestCount === 0) return 0\n\n    const reduction = requestCount - completedExecutions\n    return Math.round((reduction / requestCount) * 100)\n  }\n\n  const reductionPercentage = getReductionPercentage()\n\n  return (\n    <div class={styles().stateHeader}>\n      <div class={styles().stateTitle}>{entry.type}</div>\n      <div style={{ display: 'flex', 'align-items': 'center', gap: '16px' }}>\n        <div class={styles().infoGrid}>\n          <div class={styles().infoLabel}>Key</div>\n          <div class={styles().infoValueMono}>{key}</div>\n          <div class={styles().infoLabel}>Last Updated</div>\n          <div class={styles().infoValueMono}>\n            {new Date(updatedAt).toLocaleTimeString()} ({getRelativeTime()})\n          </div>\n        </div>\n        <div\n          class={styles().infoValueMono}\n          style={{ 'margin-left': 'auto', 'font-weight': 'bold' }}\n        >\n          {reductionPercentage}% reduction\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/components/UtilList.js

@@ -1,72 +0,0 @@
-import { useStyles } from "../styles/use-styles.js";
-import { UTIL_GROUPS } from "./util-groups.js";
-import { For } from "solid-js";
-import { className, createComponent, delegateEvents, effect, insert, memo, template } from "solid-js/web";
-import { useStore } from "@tanstack/solid-store";
-import clsx from "clsx";
-
-//#region src/components/UtilList.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div>`), _tmpl$2 = /* @__PURE__ */ template(`<div><div>`), _tmpl$3 = /* @__PURE__ */ template(`<div><div></div><div>`);
-function UtilList(props) {
-	const styles = useStyles();
-	return (() => {
-		var _el$ = _tmpl$();
-		insert(_el$, createComponent(For, {
-			each: UTIL_GROUPS,
-			children: (group) => memo(() => memo(() => props.utilState()[group.key].length > 0)() && (() => {
-				var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild;
-				insert(_el$3, () => group.label);
-				insert(_el$2, createComponent(For, {
-					get each() {
-						return props.utilState()[group.key];
-					},
-					children: (instance) => {
-						const status = (() => {
-							try {
-								const statusAccessor = useStore(instance.store, (s) => s.status);
-								return () => statusAccessor() ?? "unknown";
-							} catch {
-								return () => "unknown";
-							}
-						})();
-						return (() => {
-							var _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling;
-							_el$4.$$click = () => props.setSelectedKey(instance.key ?? null);
-							insert(_el$5, () => instance.key);
-							insert(_el$6, status);
-							effect((_p$) => {
-								var _v$3 = clsx(styles().utilRow, props.selectedKey() === instance.key && styles().utilRowSelected), _v$4 = styles().utilKey, _v$5 = styles().utilStatus;
-								_v$3 !== _p$.e && className(_el$4, _p$.e = _v$3);
-								_v$4 !== _p$.t && className(_el$5, _p$.t = _v$4);
-								_v$5 !== _p$.a && className(_el$6, _p$.a = _v$5);
-								return _p$;
-							}, {
-								e: void 0,
-								t: void 0,
-								a: void 0
-							});
-							return _el$4;
-						})();
-					}
-				}), null);
-				effect((_p$) => {
-					var _v$ = styles().utilGroup, _v$2 = styles().utilGroupHeader;
-					_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
-					_v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
-					return _p$;
-				}, {
-					e: void 0,
-					t: void 0
-				});
-				return _el$2;
-			})())
-		}));
-		effect(() => className(_el$, styles().utilList));
-		return _el$;
-	})();
-}
-delegateEvents(["click"]);
-
-//#endregion
-export { UtilList };
-//# sourceMappingURL=UtilList.js.map

package/dist/components/UtilList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"UtilList.js","names":["For","useStore","clsx","useStyles","UTIL_GROUPS","StateKey","UtilListProps","selectedKey","setSelectedKey","key","utilState","Record","Array","UtilList","props","styles","_el$","_tmpl$","_$insert","_$createComponent","each","children","group","_$memo","length","_el$2","_tmpl$2","_el$3","firstChild","label","instance","status","statusAccessor","store","s","_el$4","_tmpl$3","_el$5","_el$6","nextSibling","$$click","_$effect","_p$","_v$3","utilRow","utilRowSelected","_v$4","utilKey","_v$5","utilStatus","e","_$className","t","a","undefined","_v$","utilGroup","_v$2","utilGroupHeader","utilList","_$delegateEvents"],"sources":["../../src/components/UtilList.tsx"],"sourcesContent":["import { For } from 'solid-js'\nimport { useStore } from '@tanstack/solid-store'\nimport clsx from 'clsx'\nimport { useStyles } from '../styles/use-styles'\nimport { UTIL_GROUPS } from './util-groups'\nimport type { StateKey } from './util-groups'\n\ntype UtilListProps = {\n  selectedKey: () => string | null\n  setSelectedKey: (key: string | null) => void\n  utilState: () => Record<StateKey, Array<any>>\n}\n\nexport function UtilList(props: UtilListProps) {\n  const styles = useStyles()\n\n  return (\n    <div class={styles().utilList}>\n      <For each={UTIL_GROUPS}>\n        {(group) => (\n          <>\n            {props.utilState()[group.key].length > 0 && (\n              <div class={styles().utilGroup}>\n                <div class={styles().utilGroupHeader}>{group.label}</div>\n                <For each={props.utilState()[group.key]}>\n                  {(instance) => {\n                    const status = (() => {\n                      try {\n                        const statusAccessor = useStore(\n                          instance.store,\n                          (s: any) => s.status,\n                        )\n                        return () => statusAccessor() ?? 'unknown'\n                      } catch {\n                        return () => 'unknown'\n                      }\n                    })()\n                    return (\n                      <div\n                        class={clsx(\n                          styles().utilRow,\n                          props.selectedKey() === instance.key &&\n                            styles().utilRowSelected,\n                        )}\n                        onClick={() =>\n                          props.setSelectedKey(instance.key ?? null)\n                        }\n                      >\n                        <div class={styles().utilKey}>{instance.key}</div>\n                        <div class={styles().utilStatus}>{status()}</div>\n                      </div>\n                    )\n                  }}\n                </For>\n              </div>\n            )}\n          </>\n        )}\n      </For>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;AAaA,SAAgBa,SAASC,OAAsB;CAC7C,MAAMC,SAASZ,WAAW;AAE1B,eAAA;EAAA,IAAAa,OAAAC,QAAA;AAAAC,SAAAF,MAAAG,gBAEKnB,KAAG;GAACoB,MAAMhB;GAAWiB,WAClBC,UAAKC,WAEFA,WAAAT,MAAMJ,WAAW,CAACY,MAAMb,KAAKe,SAAS,EAAC,EAAA,WAAA;IAAA,IAAAC,QAAAC,SAAA,EAAAC,QAAAF,MAAAG;AAAAV,WAAAS,aAEGL,MAAMO,MAAK;AAAAX,WAAAO,OAAAN,gBACjDnB,KAAG;KAAA,IAACoB,OAAI;AAAA,aAAEN,MAAMJ,WAAW,CAACY,MAAMb;;KAAIY,WACnCS,aAAa;MACb,MAAMC,gBAAgB;AACpB,WAAI;QACF,MAAMC,iBAAiB/B,SACrB6B,SAASG,QACRC,MAAWA,EAAEH,OACf;AACD,qBAAaC,gBAAgB,IAAI;eAC3B;AACN,qBAAa;;UAEb;AACJ,oBAAA;OAAA,IAAAG,QAAAC,SAAA,EAAAC,QAAAF,MAAAP,YAAAU,QAAAD,MAAAE;AAAAJ,aAAAK,gBAQM1B,MAAMN,eAAesB,SAASrB,OAAO,KAAK;AAAAS,cAAAmB,aAGbP,SAASrB,IAAG;AAAAS,cAAAoB,OACTP,OAAM;AAAAU,eAAAC,QAAA;QAAA,IAAAC,OAVjCzC,KACLa,QAAQ,CAAC6B,SACT9B,MAAMP,aAAa,KAAKuB,SAASrB,OAC/BM,QAAQ,CAAC8B,gBACZ,EAAAC,OAKW/B,QAAQ,CAACgC,SAAOC,OAChBjC,QAAQ,CAACkC;AAAUN,iBAAAD,IAAAQ,KAAAC,UAAAhB,OAAAO,IAAAQ,IAAAP,KAAA;AAAAG,iBAAAJ,IAAAU,KAAAD,UAAAd,OAAAK,IAAAU,IAAAN,KAAA;AAAAE,iBAAAN,IAAAW,KAAAF,UAAAb,OAAAI,IAAAW,IAAAL,KAAA;AAAA,eAAAN;UAAA;QAAAQ,GAAAI;QAAAF,GAAAE;QAAAD,GAAAC;QAAA,CAAA;AAAA,cAAAnB;UAAA;;KAGpC,CAAA,EAAA,KAAA;AAAAM,YAAAC,QAAA;KAAA,IAAAa,MA9BOxC,QAAQ,CAACyC,WAASC,OAChB1C,QAAQ,CAAC2C;AAAeH,aAAAb,IAAAQ,KAAAC,UAAA1B,OAAAiB,IAAAQ,IAAAK,IAAA;AAAAE,cAAAf,IAAAU,KAAAD,UAAAxB,OAAAe,IAAAU,IAAAK,KAAA;AAAA,YAAAf;OAAA;KAAAQ,GAAAI;KAAAF,GAAAE;KAAA,CAAA;AAAA,WAAA7B;OAgCvC,CAAA;GAEJ,CAAA,CAAA;AAAAgB,eAAAU,UAAAnC,MAxCOD,QAAQ,CAAC4C,SAAQ,CAAA;AAAA,SAAA3C;KAAA;;AA4ChC4C,eAAA,CAAA,QAAA,CAAA"}

package/dist/components/util-groups.js

@@ -1,57 +0,0 @@
-//#region src/components/util-groups.ts
-const UTIL_GROUPS = [
-	{
-		key: "debouncers",
-		label: "Debouncers",
-		displayName: "Debouncer"
-	},
-	{
-		key: "throttlers",
-		label: "Throttlers",
-		displayName: "Throttler"
-	},
-	{
-		key: "batchers",
-		label: "Batchers",
-		displayName: "Batcher"
-	},
-	{
-		key: "queuers",
-		label: "Queuers",
-		displayName: "Queuer"
-	},
-	{
-		key: "rateLimiters",
-		label: "Rate Limiters",
-		displayName: "Rate Limiter"
-	},
-	{
-		key: "asyncDebouncers",
-		label: "Async Debouncers",
-		displayName: "Async Debouncer"
-	},
-	{
-		key: "asyncThrottlers",
-		label: "Async Throttlers",
-		displayName: "Async Throttler"
-	},
-	{
-		key: "asyncBatchers",
-		label: "Async Batchers",
-		displayName: "Async Batcher"
-	},
-	{
-		key: "asyncQueuers",
-		label: "Async Queuers",
-		displayName: "Async Queuer"
-	},
-	{
-		key: "asyncRateLimiters",
-		label: "Async Rate Limiters",
-		displayName: "Async Rate Limiter"
-	}
-];
-
-//#endregion
-export { UTIL_GROUPS };
-//# sourceMappingURL=util-groups.js.map

package/dist/components/util-groups.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"util-groups.js","names":[],"sources":["../../src/components/util-groups.ts"],"sourcesContent":["export type StateKey =\n  | 'asyncBatchers'\n  | 'asyncDebouncers'\n  | 'asyncQueuers'\n  | 'asyncRateLimiters'\n  | 'asyncThrottlers'\n  | 'batchers'\n  | 'debouncers'\n  | 'queuers'\n  | 'rateLimiters'\n  | 'throttlers'\n\ntype UtilGroup = {\n  key: StateKey\n  label: string\n  displayName: string\n}\n\nexport const UTIL_GROUPS: Array<UtilGroup> = [\n  { key: 'debouncers', label: 'Debouncers', displayName: 'Debouncer' },\n  { key: 'throttlers', label: 'Throttlers', displayName: 'Throttler' },\n  { key: 'batchers', label: 'Batchers', displayName: 'Batcher' },\n  { key: 'queuers', label: 'Queuers', displayName: 'Queuer' },\n  {\n    key: 'rateLimiters',\n    label: 'Rate Limiters',\n    displayName: 'Rate Limiter',\n  },\n  {\n    key: 'asyncDebouncers',\n    label: 'Async Debouncers',\n    displayName: 'Async Debouncer',\n  },\n  {\n    key: 'asyncThrottlers',\n    label: 'Async Throttlers',\n    displayName: 'Async Throttler',\n  },\n  {\n    key: 'asyncBatchers',\n    label: 'Async Batchers',\n    displayName: 'Async Batcher',\n  },\n  {\n    key: 'asyncQueuers',\n    label: 'Async Queuers',\n    displayName: 'Async Queuer',\n  },\n  {\n    key: 'asyncRateLimiters',\n    label: 'Async Rate Limiters',\n    displayName: 'Async Rate Limiter',\n  },\n]\n"],"mappings":";AAkBA,MAAa,cAAgC;CAC3C;EAAE,KAAK;EAAc,OAAO;EAAc,aAAa;EAAa;CACpE;EAAE,KAAK;EAAc,OAAO;EAAc,aAAa;EAAa;CACpE;EAAE,KAAK;EAAY,OAAO;EAAY,aAAa;EAAW;CAC9D;EAAE,KAAK;EAAW,OAAO;EAAW,aAAa;EAAU;CAC3D;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACD;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACD;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACD;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACD;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACD;EACE,KAAK;EACL,OAAO;EACP,aAAa;EACd;CACF"}

package/dist/core.d.ts

@@ -1,24 +0,0 @@
-//#region src/core.d.ts
-interface PacerDevtoolsInit {}
-declare const PacerDevtoolsCore: new () => {
-    "__#private@#isMounted": boolean;
-    "__#private@#isMounting": boolean;
-    "__#private@#mountCb": (() => void) | null;
-    "__#private@#dispose"?: () => void;
-    "__#private@#Component": any;
-    "__#private@#ThemeProvider": any;
-    mount<T extends HTMLElement>(el: T, theme: "light" | "dark"): Promise<void>;
-    unmount(): void;
-  }, PacerDevtoolsCoreNoOp: new () => {
-    mount<T extends HTMLElement>(_el: T, _theme: "light" | "dark"): Promise<void>;
-    unmount(): void;
-    "__#private@#isMounted": boolean;
-    "__#private@#isMounting": boolean;
-    "__#private@#mountCb": (() => void) | null;
-    "__#private@#dispose"?: () => void;
-    "__#private@#Component": any;
-    "__#private@#ThemeProvider": any;
-  };
-//#endregion
-export { PacerDevtoolsCore, PacerDevtoolsInit };
-//# sourceMappingURL=core.d.ts.map

package/dist/core.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"core.js","names":["constructCoreClass","lazy","Component","PacerDevtoolsInit","PacerDevtoolsCore","PacerDevtoolsCoreNoOp"],"sources":["../src/core.tsx"],"sourcesContent":["import { constructCoreClass } from '@tanstack/devtools-utils/solid'\nimport { lazy } from 'solid-js'\n\nconst Component = lazy(() => import('./PacerDevtools'))\n\nexport interface PacerDevtoolsInit {}\n\nconst [PacerDevtoolsCore, PacerDevtoolsCoreNoOp] = constructCoreClass(Component)\n\nexport { PacerDevtoolsCore, PacerDevtoolsCoreNoOp }\n"],"mappings":";;;;AAOA,MAAM,CAACI,mBAAmBC,yBAAyBL,mBAJjCC,WAAW,OAAO,sBAAmB,CAIyB"}

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["Devtools.PacerDevtoolsCoreNoOp","Devtools.PacerDevtoolsCore"],"sources":["../src/index.ts"],"sourcesContent":["'use client'\n\nimport * as Devtools from './core'\n\nexport const PacerDevtoolsCore =\n  process.env.NODE_ENV !== 'development'\n    ? Devtools.PacerDevtoolsCoreNoOp\n    : Devtools.PacerDevtoolsCore\n\nexport type { PacerDevtoolsInit } from './core'\n"],"mappings":";;;;;AAIA,MAAa,oBACX,QAAQ,IAAI,aAAa,gBACrBA,wBACAC"}

package/dist/production.d.ts

@@ -1,2 +0,0 @@
-import { PacerDevtoolsCore, PacerDevtoolsInit } from "./core.js";
-export { PacerDevtoolsCore, type PacerDevtoolsInit };

package/dist/production.js

@@ -1,5 +0,0 @@
-'use client';
-
-import { PacerDevtoolsCore } from "./core.js";
-
-export { PacerDevtoolsCore };