@solid-devtools/debugger - npm Package Compare versions

Comparing version 0.21.0 to 0.22.0-next.0

./dist/index.js

+import { DEFAULT_WALKER_MODE, LOCATION_ATTRIBUTE_NAME, WINDOW_PROJECTPATH_PROPERTY, UNDEFINED, INFINITY, NEGATIVE_INFINITY, NAN } from './chunks/chunk-S74N7CWV.js';
+import { createGlobalEmitter, createEventBus } from '@solid-primitives/event-bus';
+import { createStaticStore } from '@solid-primitives/static-store';
+import { chain, tryOnCleanup, defer } from '@solid-primitives/utils';
+import { $PROXY, createRoot, getOwner, createMemo, createEffect, createSignal, createComputed, batch, onCleanup, Index, Show, runWithOwner } from 'solid-js';
+import { throttle, scheduleIdle } from '@solid-primitives/scheduled';
+import { trimString, warn, isRecord } from '@solid-devtools/shared/utils';
+import { makeHoverElementListener, untrackedCallback } from '@solid-devtools/shared/primitives';
+import { makeEventListener } from '@solid-primitives/event-listener';
+import { createKeyHold } from '@solid-primitives/keyboard';
+import { createComponent, Portal, mergeProps, insert, effect, className, template } from 'solid-js/web';
+import { createElementBounds } from '@solid-primitives/bounds';
+import { createElementCursor } from '@solid-primitives/cursor';
+import { isWindows } from '@solid-primitives/platform';
+
+// src/main/get-id.ts
+var LastId = 0;
+var getNewSdtId = () => `#${(LastId++).toString(36)}`;
+
+// src/main/id.ts
+var WeakIdMap = /* @__PURE__ */ new WeakMap();
+var RefMapMap = {
+  ["owner" /* Owner */]: /* @__PURE__ */ new Map(),
+  ["element" /* Element */]: /* @__PURE__ */ new Map(),
+  ["signal" /* Signal */]: /* @__PURE__ */ new Map(),
+  ["store" /* Store */]: /* @__PURE__ */ new Map(),
+  ["store-node" /* StoreNode */]: /* @__PURE__ */ new Map()
+};
+var CleanupRegistry = new FinalizationRegistry((data) => {
+  RefMapMap[data.map].delete(data.id);
+});
+function getSdtId(obj, objType) {
+  let id = WeakIdMap.get(obj);
+  if (!id) {
+    id = getNewSdtId();
+    WeakIdMap.set(obj, id);
+    RefMapMap[objType].set(id, new WeakRef(obj));
+    CleanupRegistry.register(obj, { map: objType, id });
+  }
+  return id;
+}
+function getObjectById(id, objType) {
+  const ref = RefMapMap[objType].get(id);
+  return ref?.deref() ?? null;
+}
+
+// src/main/solid-api.ts
+if (!globalThis.SolidDevtools$$) {
+  throw new Error(
+    `[solid-devtools]: Debugger hasn't found the exposed Solid Devtools API. Did you import the setup script?`
+  );
+}
+var SolidApi = globalThis.SolidDevtools$$;
+var solid_api_default = SolidApi;
+
+// src/main/utils.ts
+var $NODE = solid_api_default.STORE_DEV.$NODE;
+var isObject = (o) => typeof o === "object" && !!o;
+var isSolidOwner = (o) => "owned" in o;
+var isSolidComputation = (o) => !!o.fn;
+var isObservableComputation = (o) => !!o.fn && o.context === null;
+var isSolidRoot = (o) => !("fn" in o);
+var isSolidMemo = (o) => "fn" in o && "comparator" in o;
+var isSolidComponent = (o) => "component" in o;
+var isStoreNode = (o) => $NODE in o;
+var isSolidStore = (o) => !("observers" in o) && "value" in o && isObject(o.value) && $PROXY in o.value;
+var isSolidSignal = (o) => "value" in o && "observers" in o && "observerSlots" in o && "comparator" in o;
+function getNodeType(o) {
+  if (isSolidOwner(o))
+    return getOwnerType(o);
+  return isSolidStore(o) ? "store" /* Store */ : "signal" /* Signal */;
+}
+var SOLID_REFRESH_PREFIX = "[solid-refresh]";
+var getOwnerType = (o) => {
+  if (typeof o.sdtType !== "undefined")
+    return o.sdtType;
+  if (!isSolidComputation(o)) {
+    if ("sources" in o)
+      return "catchError" /* CatchError */;
+    return "root" /* Root */;
+  }
+  if (isSolidComponent(o))
+    return "component" /* Component */;
+  if ("comparator" in o) {
+    if (o.owner?.component?.name.startsWith(SOLID_REFRESH_PREFIX)) {
+      return "refresh" /* Refresh */;
+    }
+    return "memo" /* Memo */;
+  }
+  if (o.pure === false) {
+    if (o.user === true)
+      return "effect" /* Effect */;
+    if (o.context !== null)
+      return "context" /* Context */;
+    return "render" /* Render */;
+  }
+  return "computation" /* Computation */;
+};
+var getNodeName = (o) => {
+  if (!o.name)
+    return;
+  let name = o.name;
+  if (name.startsWith(SOLID_REFRESH_PREFIX))
+    name = name.slice(SOLID_REFRESH_PREFIX.length);
+  return trimString(name, 20);
+};
+function markOwnerType(o) {
+  if (o.sdtType !== void 0)
+    return o.sdtType;
+  return o.sdtType = getOwnerType(o);
+}
+function isDisposed(o) {
+  return !!(isSolidComputation(o) ? o.owner && (!o.owner.owned || !o.owner.owned.includes(o)) : o.isDisposed);
+}
+function getComponentRefreshNode(owner) {
+  const { owned } = owner;
+  let refresh;
+  if (owned && owned.length === 1 && markOwnerType(refresh = owned[0]) === "refresh" /* Refresh */) {
+    return refresh;
+  }
+  return null;
+}
+function resolveElements(value) {
+  const resolved = getResolvedElements(value);
+  if (Array.isArray(resolved))
+    return resolved.length ? resolved : null;
+  return resolved ? [resolved] : null;
+}
+function getResolvedElements(value) {
+  if (typeof value === "function" && !value.length && value.name === "bound readSignal")
+    return getResolvedElements(value());
+  if (Array.isArray(value)) {
+    const results = [];
+    for (const item of value) {
+      const result = getResolvedElements(item);
+      if (result)
+        Array.isArray(result) ? results.push.apply(results, result) : results.push(result);
+    }
+    return results;
+  }
+  return value instanceof HTMLElement ? value : null;
+}
+function lookupOwner(owner, predicate) {
+  do {
+    if (predicate(owner))
+      return owner;
+    owner = owner.owner;
+  } while (owner.owner);
+  return null;
+}
+function onOwnerCleanup(owner, fn, prepend = false, symbol) {
+  if (owner.cleanups === null)
+    owner.cleanups = [fn];
+  else {
+    if (symbol) {
+      if (owner.cleanups.some((c) => c[symbol])) {
+        return () => owner.cleanups?.splice(
+          owner.cleanups.findIndex((c) => c[symbol]),
+          1
+        );
+      }
+      fn[symbol] = true;
+    }
+    if (prepend)
+      owner.cleanups.unshift(fn);
+    else
+      owner.cleanups.push(fn);
+  }
+  return () => owner.cleanups?.splice(owner.cleanups.indexOf(fn), 1);
+}
+function onParentCleanup(owner, fn, prepend = false, symbol) {
+  if (owner.owner)
+    return onOwnerCleanup(owner.owner, fn, prepend, symbol);
+  return () => {
+  };
+}
+function onOwnerDispose(owner, fn, prepend = false, symbol) {
+  if (isSolidRoot(owner))
+    return onOwnerCleanup(owner, fn, prepend, symbol);
+  return onParentCleanup(owner, fn, prepend, symbol);
+}
+function createBatchedUpdateEmitter(emit) {
+  const updates = /* @__PURE__ */ new Set();
+  const triggerUpdateEmit = throttle(() => {
+    emit([...updates]);
+    updates.clear();
+  });
+  return (update) => {
+    updates.add(update);
+    triggerUpdateEmit();
+  };
+}
+
+// src/main/component-registry.ts
+var $CLEANUP = Symbol("component-registry-cleanup");
+var ComponentMap = /* @__PURE__ */ new Map();
+var ElementNodeMap = /* @__PURE__ */ new Map();
+function cleanupComponent(nodeID) {
+  const component = ComponentMap.get(nodeID);
+  if (!component)
+    return;
+  component.cleanup();
+  ComponentMap.delete(nodeID);
+  for (const element of component.elementNodes)
+    ElementNodeMap.delete(element);
+}
+function registerComponent(data) {
+  if ("elementId" in data) {
+    const { componentId, elementId, element } = data;
+    const component = ComponentMap.get(componentId);
+    if (!component)
+      return;
+    component.elementNodes.add(elementId);
+    ElementNodeMap.set(elementId, { el: element, component });
+  } else {
+    const { owner, id, name, elements: elementsList } = data;
+    if (!elementsList)
+      return cleanupComponent(id);
+    const set = new Set(elementsList);
+    const existing = ComponentMap.get(id);
+    if (existing) {
+      existing.elements = set;
+      return;
+    }
+    const cleanup = onOwnerCleanup(owner, () => cleanupComponent(id), false, $CLEANUP);
+    ComponentMap.set(id, {
+      id,
+      owner,
+      name,
+      elements: set,
+      cleanup,
+      elementNodes: /* @__PURE__ */ new Set()
+    });
+  }
+}
+function clearComponentRegistry() {
+  for (const component of ComponentMap.values())
+    component.cleanup();
+  ComponentMap.clear();
+  ElementNodeMap.clear();
+}
+function getComponent(id) {
+  const component = ComponentMap.get(id);
+  if (component)
+    return { name: component.name, elements: [...component.elements], id };
+  const elData = ElementNodeMap.get(id);
+  return elData ? { name: elData.component.name, id: elData.component.id, elements: [elData.el] } : null;
+}
+function findComponent(el) {
+  const including = /* @__PURE__ */ new Map();
+  let currEl = el;
+  while (currEl) {
+    for (const component of ComponentMap.values()) {
+      if (component.elements.has(currEl))
+        including.set(component.owner, component);
+    }
+    currEl = including.size === 0 ? currEl.parentElement : null;
+  }
+  if (including.size > 1) {
+    for (const owner of including.keys()) {
+      if (!including.has(owner))
+        continue;
+      let currOwner = owner.owner;
+      while (currOwner) {
+        const deleted = including.delete(currOwner);
+        if (deleted)
+          break;
+        currOwner = currOwner.owner;
+      }
+    }
+  }
+  if (including.size === 0)
+    return null;
+  const { name, id } = including.values().next().value;
+  return { name, id };
+}
+
+// src/main/roots.ts
+var RootMap = /* @__PURE__ */ new Map();
+var getCurrentRoots = () => RootMap.values();
+var OnOwnerNeedsUpdate;
+function setOnOwnerNeedsUpdate(fn) {
+  OnOwnerNeedsUpdate = fn;
+}
+var OnRootRemoved;
+function setOnRootRemoved(fn) {
+  OnRootRemoved = fn;
+}
+function createTopRoot(owner) {
+  const rootId = getSdtId(owner, "owner" /* Owner */);
+  RootMap.set(rootId, owner);
+  OnOwnerNeedsUpdate?.(owner, rootId);
+}
+function cleanupRoot(root) {
+  const rootId = getSdtId(root, "owner" /* Owner */);
+  root.isDisposed = true;
+  changeRootAttachment(root, null);
+  const wasTarcked = RootMap.delete(rootId);
+  if (wasTarcked)
+    OnRootRemoved?.(rootId);
+}
+function changeRootAttachment(root, newParent) {
+  let topRoot;
+  if (root.attachedTo) {
+    root.attachedTo.sdtSubRoots.splice(root.attachedTo.sdtSubRoots.indexOf(root), 1);
+    topRoot = getTopRoot(root.attachedTo);
+    if (topRoot)
+      OnOwnerNeedsUpdate?.(root.attachedTo, getSdtId(topRoot, "owner" /* Owner */));
+  }
+  if (newParent) {
+    root.attachedTo = newParent;
+    if (newParent.sdtSubRoots)
+      newParent.sdtSubRoots.push(root);
+    else
+      newParent.sdtSubRoots = [root];
+    if (topRoot === void 0)
+      topRoot = getTopRoot(newParent);
+    if (topRoot)
+      OnOwnerNeedsUpdate?.(newParent, getSdtId(topRoot, "owner" /* Owner */));
+  } else {
+    delete root.attachedTo;
+  }
+}
+var InternalRootCount = 0;
+function attachDebugger(owner = solid_api_default.getOwner()) {
+  if (InternalRootCount)
+    return;
+  if (!owner)
+    return warn("reatachOwner helper should be called synchronously in a reactive owner.");
+  const roots = [];
+  let isFirstTopLevel = true;
+  while (owner) {
+    if (isSolidRoot(owner)) {
+      if (owner.isInternal || owner.isDisposed)
+        return;
+      if (RootMap.has(getSdtId(owner, "owner" /* Owner */))) {
+        isFirstTopLevel = false;
+        break;
+      }
+      roots.push(owner);
+    }
+    owner = owner.owner;
+  }
+  for (let i = roots.length - 1; i >= 0; i--) {
+    const root = roots[i];
+    root.sdtType = "root" /* Root */;
+    onOwnerCleanup(root, () => cleanupRoot(root), true);
+    const isTopLevel = isFirstTopLevel && i === 0;
+    if (isTopLevel) {
+      createTopRoot(root);
+      return;
+    }
+    let parent = findClosestAliveParent(root);
+    if (!parent.owner)
+      return warn("Parent owner is missing.");
+    changeRootAttachment(root, parent.owner);
+    const onParentCleanup2 = () => {
+      const newParent = findClosestAliveParent(root);
+      changeRootAttachment(root, newParent.owner);
+      if (newParent.owner) {
+        parent = newParent;
+        onOwnerCleanup(parent.root, onParentCleanup2);
+      } else {
+        removeOwnCleanup();
+        createTopRoot(root);
+      }
+    };
+    const removeParentCleanup = onOwnerCleanup(parent.root, onParentCleanup2);
+    const removeOwnCleanup = onOwnerCleanup(root, removeParentCleanup);
+  }
+}
+function unobserveAllRoots() {
+  RootMap.forEach((r) => cleanupRoot(r));
+  clearComponentRegistry();
+}
+var createInternalRoot = (fn, detachedOwner) => {
+  InternalRootCount++;
+  const r = createRoot((dispose) => {
+    getOwner().isInternal = true;
+    return fn(dispose);
+  }, detachedOwner);
+  InternalRootCount--;
+  return r;
+};
+function getTopRoot(owner) {
+  let root = null;
+  do {
+    if (isSolidRoot(owner) && !owner.isInternal && !owner.isDisposed)
+      root = owner;
+    owner = owner.owner;
+  } while (owner);
+  return root;
+}
+function findClosestAliveParent(owner) {
+  let disposed = null;
+  let closestAliveRoot = null;
+  let current = owner;
+  while (current.owner && !closestAliveRoot) {
+    current = current.owner;
+    if (isSolidRoot(current)) {
+      if (current.isDisposed)
+        disposed = current;
+      else
+        closestAliveRoot = current;
+    }
+  }
+  if (!closestAliveRoot)
+    return { owner: null, root: null };
+  return { owner: (disposed ?? owner).owner, root: closestAliveRoot };
+}
+
+// src/main/observe.ts
+for (const e of solid_api_default.getDevEvents()) {
+  switch (e.type) {
+    case "RootCreated" /* RootCreated */:
+      attachDebugger(e.data);
+      break;
+  }
+}
+solid_api_default.DEV.hooks.afterCreateOwner = function(owner) {
+  if (isSolidRoot(owner)) {
+    attachDebugger(owner);
+  }
+};
+var GraphUpdateListeners = /* @__PURE__ */ new Set();
+solid_api_default.DEV.hooks.afterUpdate = chain(GraphUpdateListeners);
+function addSolidUpdateListener(onUpdate) {
+  GraphUpdateListeners.add(onUpdate);
+  return () => GraphUpdateListeners.delete(onUpdate);
+}
+function interceptComputationRerun(owner, onRun) {
+  const _fn = owner.fn;
+  let v;
+  let prev;
+  const fn = () => v = _fn(prev);
+  owner.fn = !!owner.fn.length ? (p) => {
+    onRun(fn, prev = p);
+    return v;
+  } : () => {
+    onRun(fn, void 0);
+    return v;
+  };
+}
+var ComputationUpdateListeners = /* @__PURE__ */ new WeakMap();
+function observeComputationUpdate(owner, onRun, symbol = Symbol()) {
+  let map = ComputationUpdateListeners.get(owner);
+  if (!map)
+    ComputationUpdateListeners.set(owner, map = {});
+  map[symbol] = onRun;
+  interceptComputationRerun(owner, (fn) => {
+    fn();
+    for (const sym of Object.getOwnPropertySymbols(map))
+      map[sym]();
+  });
+}
+function removeComputationUpdateObserver(owner, symbol) {
+  const map = ComputationUpdateListeners.get(owner);
+  if (map)
+    delete map[symbol];
+}
+var SignalUpdateListeners = /* @__PURE__ */ new WeakMap();
+function observeValueUpdate(node, onUpdate, symbol) {
+  let map = SignalUpdateListeners.get(node);
+  if (!map) {
+    SignalUpdateListeners.set(node, map = /* @__PURE__ */ new Map());
+    let value = node.value;
+    Object.defineProperty(node, "value", {
+      get: () => value,
+      set: (newValue) => {
+        for (const fn of map.values())
+          fn(newValue, value);
+        value = newValue;
+      }
+    });
+  }
+  map.set(symbol, onUpdate);
+}
+function removeValueUpdateObserver(node, symbol) {
+  SignalUpdateListeners.get(node)?.delete(symbol);
+}
+function makeValueUpdateListener(node, onUpdate, symbol) {
+  observeValueUpdate(node, onUpdate, symbol);
+  tryOnCleanup(() => removeValueUpdateObserver(node, symbol));
+}
+
+// src/dependency/collect.ts
+var $DGRAPH = Symbol("dependency-graph");
+var Graph;
+var VisitedSources;
+var VisitedObservers;
+var DepthMap;
+var OnNodeUpdate;
+function observeNodeUpdate(node, handler) {
+  if (isSolidOwner(node))
+    observeComputationUpdate(node, handler, $DGRAPH);
+  else
+    observeValueUpdate(node, handler, $DGRAPH);
+}
+function unobserveNodeUpdate(node) {
+  if (isSolidOwner(node))
+    removeComputationUpdateObserver(node, $DGRAPH);
+  else
+    removeValueUpdateObserver(node, $DGRAPH);
+}
+function addNodeToGraph(node) {
+  const isOwner = isSolidOwner(node);
+  const id = getSdtId(node, isOwner ? "owner" /* Owner */ : "signal" /* Signal */);
+  if (Graph[id])
+    return;
+  const onNodeUpdate = OnNodeUpdate;
+  observeNodeUpdate(node, () => onNodeUpdate(id));
+  Graph[id] = {
+    name: getNodeName(node),
+    type: getNodeType(node),
+    depth: lookupDepth(node),
+    sources: "sources" in node && node.sources ? node.sources.map((n) => getSdtId(n, isSolidOwner(n) ? "owner" /* Owner */ : "signal" /* Signal */)) : void 0,
+    observers: "observers" in node && node.observers ? node.observers.map((n) => getSdtId(n, "owner" /* Owner */)) : void 0,
+    graph: !isOwner && node.graph ? getSdtId(node.graph, "owner" /* Owner */) : void 0
+  };
+}
+function visitSources(node) {
+  let n = 0;
+  if ("sources" in node && node.sources) {
+    for (const source of node.sources) {
+      const isOwner = isSolidOwner(source);
+      if (isOwner && getOwnerType(source) === "refresh" /* Refresh */)
+        continue;
+      n++;
+      if (VisitedSources.has(source))
+        continue;
+      VisitedSources.add(source);
+      if (isOwner && visitSources(source) === 0) {
+        n--;
+        continue;
+      }
+      addNodeToGraph(source);
+    }
+  }
+  return n;
+}
+function visitObservers(node) {
+  if ("observers" in node && node.observers) {
+    for (const observer of node.observers) {
+      if (VisitedObservers.has(observer) || getOwnerType(observer) === "refresh" /* Refresh */) {
+        continue;
+      }
+      VisitedObservers.add(observer);
+      addNodeToGraph(observer);
+      visitObservers(observer);
+    }
+  }
+}
+function lookupDepth(node) {
+  const id = getSdtId(node, isSolidOwner(node) ? "owner" /* Owner */ : "signal" /* Signal */);
+  if (id in DepthMap)
+    return DepthMap[id];
+  let owner;
+  if (!("owned" in node))
+    owner = node.graph;
+  else if (!("fn" in node) && !node.owner)
+    return 0;
+  else
+    owner = node.owner;
+  return DepthMap[id] = owner ? lookupDepth(owner) + 1 : 0;
+}
+function collectDependencyGraph(node, config) {
+  const graph = Graph = {};
+  const visitedSources = VisitedSources = /* @__PURE__ */ new Set();
+  const visitedObservers = VisitedObservers = /* @__PURE__ */ new Set();
+  DepthMap = {};
+  OnNodeUpdate = config.onNodeUpdate;
+  addNodeToGraph(node);
+  visitSources(node);
+  visitObservers(node);
+  const clearListeners = () => {
+    visitedSources.forEach(unobserveNodeUpdate);
+    visitedObservers.forEach(unobserveNodeUpdate);
+    unobserveNodeUpdate(node);
+  };
+  Graph = VisitedObservers = VisitedSources = DepthMap = OnNodeUpdate = void 0;
+  return { graph, clearListeners };
+}
+
+// src/dependency/index.ts
+function createDependencyGraph(props) {
+  let clearListeners = null;
+  const onNodeUpdate = (id) => {
+    queueMicrotask(() => {
+      if (!props.enabled())
+        return;
+      props.onNodeUpdate(id);
+      triggerInspect();
+    });
+  };
+  const inspectedNode = createMemo(() => {
+    const state = props.inspectedState();
+    if (state.signalId) {
+      return getObjectById(state.signalId, "signal" /* Signal */);
+    } else if (state.ownerId) {
+      return getObjectById(state.ownerId, "owner" /* Owner */);
+    }
+    return null;
+  });
+  function inspectDGraph() {
+    clearListeners?.();
+    const node = inspectedNode();
+    const type = node && getNodeType(node);
+    if (!props.enabled() || !type || type === "root" /* Root */ || type === "component" /* Component */ || type === "context" /* Context */) {
+      clearListeners = null;
+      props.emit("DgraphUpdate", null);
+      return;
+    }
+    const dgraph = collectDependencyGraph(node, {
+      onNodeUpdate
+    });
+    clearListeners = dgraph.clearListeners;
+    props.emit("DgraphUpdate", dgraph.graph);
+  }
+  const triggerInspect = throttle(inspectDGraph, 200);
+  createEffect(
+    defer([props.enabled, inspectedNode], () => {
+      queueMicrotask(inspectDGraph);
+    })
+  );
+  props.listenToViewChange(() => {
+    inspectDGraph();
+  });
+}
+var _tmpl$ = /* @__PURE__ */ template(`<style>
+.element-overlay {
+  position: fixed;
+  z-index: 9999;
+  top: 0;
+  left: 0;
+  pointer-events: none;
+  transition-duration: 100ms;
+  transition-property: transform, width, height;
+  --color: 14 116 144;
+}
+.border {
+  position: absolute;
+  top: -4px;
+  left: -4px;
+  right: -4px;
+  bottom: -4px;
+  border: 2px solid rgb(var(--color) / 0.8);
+  background-color: rgb(var(--color) / 0.3);
+  border-radius: 0.25rem;
+}
+.name-container {
+  position: absolute;
+  z-index: 10000;
+  left: 0;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  color: white;
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+  font-size: 0.875rem;
+  line-height: 1rem;
+}
+.name-container.bottom {
+  top: 100%;
+}
+.name-container.top {
+  bottom: 100%;
+}
+.name-animated-container {
+  position: relative;
+  margin: 0.5rem auto;
+  padding: 0.25rem 0.5rem;
+}
+.name-background {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgb(var(--color) / 0.8);
+  border-radius: 0.25rem;
+}
+.name-text {
+  position: absolute;
+}
+.name-text span {
+  color: #a5f3fc;
+}
+.name-invisible {
+  visibility: hidden;
+}
+`);
+var _tmpl$2 = /* @__PURE__ */ template(`<div class="element-overlay"><div class="border">`);
+var _tmpl$3 = /* @__PURE__ */ template(`<div><div class="name-animated-container"><div class="name-background"></div><div class="name-text">: <span></span></div><div class="name-invisible">: `);
+function attachElementOverlay(selected) {
+  return createComponent(Portal, {
+    useShadow: true,
+    get children() {
+      return createComponent(Index, {
+        get each() {
+          return selected();
+        },
+        children: (component) => {
+          createElementCursor(() => component().element, "pointer");
+          const bounds = createElementBounds(() => component().element);
+          return createComponent(ElementOverlay, mergeProps(bounds, {
+            get tag() {
+              return component().element.localName;
+            },
+            get name() {
+              return component().name;
+            }
+          }));
+        }
+      });
+    }
+  });
+}
+var ElementOverlay = (props) => {
+  const left = createMemo((prev) => props.left === null ? prev : props.left, 0);
+  const top = createMemo((prev) => props.top === null ? prev : props.top, 0);
+  const width = createMemo((prev) => props.width === null ? prev : props.width, 0);
+  const height = createMemo((prev) => props.height === null ? prev : props.height, 0);
+  const transform = createMemo(() => `translate(${Math.round(left())}px, ${Math.round(top())}px)`);
+  const placeOnTop = createMemo(() => top() > window.innerHeight / 2);
+  return [_tmpl$(), (() => {
+    const _el$2 = _tmpl$2(); _el$2.firstChild;
+    insert(_el$2, createComponent(Show, {
+      get when() {
+        return props.name;
+      },
+      children: (name) => (() => {
+        const _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$10 = _el$7.nextSibling, _el$11 = _el$10.firstChild;
+        insert(_el$7, name, _el$8);
+        insert(_el$9, () => props.tag);
+        insert(_el$10, name, _el$11);
+        insert(_el$10, () => props.tag, null);
+        effect(() => className(_el$4, `name-container ${placeOnTop() ? "top" : "bottom"}`));
+        return _el$4;
+      })()
+    }), null);
+    effect((_p$) => {
+      const _v$ = transform(), _v$2 = width() + "px", _v$3 = height() + "px";
+      _v$ !== _p$._v$ && ((_p$._v$ = _v$) != null ? _el$2.style.setProperty("transform", _v$) : _el$2.style.removeProperty("transform"));
+      _v$2 !== _p$._v$2 && ((_p$._v$2 = _v$2) != null ? _el$2.style.setProperty("width", _v$2) : _el$2.style.removeProperty("width"));
+      _v$3 !== _p$._v$3 && ((_p$._v$3 = _v$3) != null ? _el$2.style.setProperty("height", _v$3) : _el$2.style.removeProperty("height"));
+      return _p$;
+    }, {
+      _v$: void 0,
+      _v$2: void 0,
+      _v$3: void 0
+    });
+    return _el$2;
+  })()];
+};
+var LOC_ATTR_REGEX_WIN = /^((?:\\?[^\s][^/\\:\"\?\*<>\|]+)+):([0-9]+):([0-9]+)$/;
+var LOC_ATTR_REGEX_UNIX = /^((?:(?:\.\/|\.\.\/|\/)?(?:\.?\w+\/)*)(?:\.?\w+\.?\w+)):([0-9]+):([0-9]+)$/;
+var LOC_ATTR_REGEX = isWindows ? LOC_ATTR_REGEX_WIN : LOC_ATTR_REGEX_UNIX;
+function getLocationAttr(element) {
+  const attr = element.getAttribute(LOCATION_ATTRIBUTE_NAME);
+  if (!attr || !LOC_ATTR_REGEX.test(attr))
+    return;
+  return attr;
+}
+var targetIDEMap = {
+  vscode: ({ projectPath, file, line, column }) => `vscode://file/${projectPath}/${file}:${line}:${column}`,
+  "vscode-insiders": ({ projectPath, file: filePath, line, column }) => `vscode-insiders://file/${projectPath}/${filePath}:${line}:${column}`,
+  atom: ({ projectPath, file: filePath, line, column }) => `atom://core/open/file?filename=${projectPath}/${filePath}&line=${line}&column=${column}`,
+  webstorm: ({ projectPath, file: filePath, line, column }) => `webstorm://open?file=${projectPath}/${filePath}&line=${line}&column=${column}`
+};
+function getTargetURL(target, data) {
+  if (typeof target === "function")
+    return target(data);
+  return targetIDEMap[target](data);
+}
+var getProjectPath = () => window[WINDOW_PROJECTPATH_PROPERTY];
+function getSourceCodeData(location, element) {
+  const projectPath = getProjectPath();
+  if (!projectPath)
+    return;
+  const parsed = parseLocationString(location);
+  if (!parsed)
+    return;
+  return { ...parsed, projectPath, element };
+}
+function parseLocationString(location) {
+  let [filePath, line, column] = location.split(":");
+  if (filePath && line && column && typeof filePath === "string" && !isNaN(line = Number(line)) && !isNaN(column = Number(column))) {
+    return { file: filePath, line, column };
+  }
+}
+function openSourceCode(target, data) {
+  const url = getTargetURL(target, data);
+  if (typeof url === "string")
+    window.open(url, "_blank");
+}
+
+// src/locator/index.ts
+function createLocator(props) {
+  const [enabledByPressingSignal, setEnabledByPressingSignal] = createSignal(() => false);
+  props.setLocatorEnabledSignal(createMemo(() => enabledByPressingSignal()()));
+  const [hoverTarget, setHoverTarget] = createSignal(null);
+  const [devtoolsTarget, setDevtoolsTarget] = createSignal(null);
+  const [highlightedComponents, setHighlightedComponents] = createSignal([]);
+  const calcHighlightedComponents = (target) => {
+    if (!target)
+      return [];
+    if ("type" in target && target.type === "element") {
+      const element = getObjectById(target.id, "element" /* Element */);
+      if (!(element instanceof HTMLElement))
+        return [];
+      target = element;
+    }
+    if (target instanceof HTMLElement) {
+      const comp2 = findComponent(target);
+      if (!comp2)
+        return [];
+      return [
+        {
+          location: getLocationAttr(target),
+          element: target,
+          id: comp2.id,
+          name: comp2.name
+        }
+      ];
+    }
+    const comp = getComponent(target.id);
+    if (!comp)
+      return [];
+    return comp.elements.map((element) => ({
+      element,
+      id: comp.id,
+      name: comp.name
+    }));
+  };
+  createEffect(
+    defer(
+      () => hoverTarget() ?? devtoolsTarget(),
+      scheduleIdle((target) => setHighlightedComponents(() => calcHighlightedComponents(target)))
+    )
+  );
+  setTimeout(() => {
+    createInternalRoot(() => attachElementOverlay(highlightedComponents));
+  }, 1e3);
+  createEffect((prev) => {
+    const target = hoverTarget();
+    const comp = target && findComponent(target);
+    if (prev)
+      props.emit("HoveredComponent", { nodeId: prev, state: false });
+    if (comp) {
+      const { id } = comp;
+      props.emit("HoveredComponent", { nodeId: id, state: true });
+      return id;
+    }
+  });
+  let targetIDE;
+  createEffect(() => {
+    if (!props.locatorEnabled())
+      return;
+    makeHoverElementListener((el) => setHoverTarget(el));
+    onCleanup(() => setHoverTarget(null));
+    makeEventListener(
+      window,
+      "click",
+      (e) => {
+        const { target } = e;
+        if (!(target instanceof HTMLElement))
+          return;
+        const highlighted = highlightedComponents();
+        const comp = highlighted.find(({ element }) => target.contains(element)) ?? highlighted[0];
+        if (!comp)
+          return;
+        const sourceCodeData = comp.location && getSourceCodeData(comp.location, comp.element);
+        props.onComponentClick(comp.id, () => {
+          if (!targetIDE || !sourceCodeData)
+            return;
+          e.preventDefault();
+          e.stopPropagation();
+          openSourceCode(targetIDE, sourceCodeData);
+        });
+      },
+      true
+    );
+  });
+  let locatorUsed = false;
+  const owner = getOwner();
+  function useLocator2(options) {
+    runWithOwner(owner, () => {
+      if (locatorUsed)
+        return warn("useLocator can be called only once.");
+      locatorUsed = true;
+      if (options.targetIDE)
+        targetIDE = options.targetIDE;
+      if (options.key !== false) {
+        const isHoldingKey = createKeyHold(options.key ?? "Alt", { preventDefault: true });
+        setEnabledByPressingSignal(() => isHoldingKey);
+      }
+    });
+  }
+  if (solid_api_default.locatorOptions) {
+    useLocator2(solid_api_default.locatorOptions);
+  }
+  return {
+    useLocator: useLocator2,
+    setDevtoolsHighlightTarget(target) {
+      setDevtoolsTarget(target);
+    },
+    openElementSourceCode(location, element) {
+      if (!targetIDE)
+        return warn("Please set `targetIDE` it in useLocator options.");
+      const projectPath = getProjectPath();
+      if (!projectPath)
+        return warn("projectPath is not set.");
+      openSourceCode(targetIDE, {
+        ...location,
+        projectPath,
+        element
+      });
+    }
+  };
+}
+
+// src/inspector/serialize.ts
+var Deep;
+var List;
+var Seen;
+var InStore;
+var HandleStore;
+var IgnoreNextSeen;
+var encodeNonObject = (value) => {
+  switch (typeof value) {
+    case "number":
+      if (value === Infinity)
+        return ["number" /* Number */, INFINITY];
+      if (value === -Infinity)
+        return ["number" /* Number */, NEGATIVE_INFINITY];
+      if (isNaN(value))
+        return ["number" /* Number */, NAN];
+      return ["number" /* Number */, value];
+    case "boolean":
+      return ["boolean" /* Boolean */, value];
+    case "string":
+      return ["string" /* String */, value];
+    case "symbol":
+      return ["symbol" /* Symbol */, value.description || ""];
+    case "function":
+      return ["function" /* Function */, value.name];
+    case "object":
+      return ["null" /* Null */, null];
+    default:
+      return ["null" /* Null */, UNDEFINED];
+  }
+};
+function encode(value) {
+  const ignoreNextStore = IgnoreNextSeen;
+  if (ignoreNextStore)
+    IgnoreNextSeen = false;
+  else {
+    const seen = Seen.get(value);
+    if (seen !== void 0)
+      return seen;
+  }
+  if (!value || typeof value !== "object") {
+    const index2 = List.push(encodeNonObject(value)) - 1;
+    Seen.set(value, index2);
+    return index2;
+  }
+  const encoded = [];
+  const index = List.push(encoded) - 1;
+  ignoreNextStore || Seen.set(value, index);
+  if (value instanceof Element) {
+    encoded[0] = "element" /* Element */;
+    encoded[1] = `${getSdtId(value, "element" /* Element */)}:${value.localName}`;
+  } else if (!ignoreNextStore && isStoreNode(value)) {
+    const node = solid_api_default.unwrap(value);
+    if (node !== value)
+      Seen.set(node, index);
+    const id = getSdtId(node, "store-node" /* StoreNode */);
+    !InStore && HandleStore && HandleStore(node, id);
+    const wasInStore = InStore;
+    InStore = IgnoreNextSeen = true;
+    encoded[0] = "store" /* Store */;
+    encoded[1] = `${id}:${encode(node)}`;
+    InStore = wasInStore;
+  } else if (Array.isArray(value)) {
+    encoded[0] = "array" /* Array */;
+    encoded[1] = Deep ? value.map(encode) : value.length;
+  } else {
+    const name = Object.prototype.toString.call(value).slice(8, -1);
+    if (name === "Object") {
+      encoded[0] = "object" /* Object */;
+      if (Deep) {
+        const data = encoded[1] = {};
+        for (const [key, descriptor] of Object.entries(Object.getOwnPropertyDescriptors(value))) {
+          data[key] = descriptor.get ? -1 : encode(descriptor.value);
+        }
+      } else {
+        encoded[1] = Object.keys(value).length;
+      }
+    } else {
+      encoded[0] = "instance" /* Instance */;
+      encoded[1] = name;
+    }
+  }
+  return index;
+}
+function encodeValue(value, deep, handleStore, inStore = false) {
+  Deep = deep;
+  List = [];
+  Seen = /* @__PURE__ */ new Map();
+  InStore = inStore;
+  HandleStore = handleStore;
+  encode(value);
+  const result = List;
+  Deep = List = Seen = HandleStore = InStore = void 0;
+  return result;
+}
+
+// src/inspector/inspector.ts
+var ValueNode = class {
+  constructor(getValue) {
+    this.getValue = getValue;
+  }
+  trackedStores = [];
+  selected = false;
+  addStoreObserver(unsub) {
+    this.trackedStores.push(unsub);
+  }
+  unsubscribe() {
+    for (const unsub of this.trackedStores)
+      unsub();
+    this.trackedStores = [];
+  }
+  reset() {
+    this.unsubscribe();
+    this.selected = false;
+  }
+  isSelected() {
+    return this.selected;
+  }
+  setSelected(selected) {
+    this.selected = selected;
+    if (!selected)
+      this.unsubscribe();
+  }
+};
+var ValueNodeMap = class {
+  record = {};
+  get(id) {
+    return this.record[id];
+  }
+  add(id, getValue) {
+    this.record[id] = new ValueNode(getValue);
+  }
+  reset() {
+    for (const signal of Object.values(this.record))
+      signal.reset();
+  }
+};
+var $NOT_SET = Symbol("not-set");
+var ObservedProps = class {
+  constructor(props) {
+    this.props = props;
+  }
+  onPropStateChange;
+  onValueUpdate;
+  observedGetters = {};
+  observe(onPropStateChange, onValueUpdate) {
+    this.onPropStateChange = onPropStateChange;
+    this.onValueUpdate = onValueUpdate;
+  }
+  unobserve() {
+    this.onPropStateChange = void 0;
+    this.onValueUpdate = void 0;
+  }
+  observeProp(key, id, get) {
+    if (this.observedGetters[key]) {
+      const o2 = this.observedGetters[key];
+      return { getValue: () => o2.v, isStale: o2.n === 0 };
+    }
+    const self = this;
+    const o = this.observedGetters[key] = {
+      v: $NOT_SET,
+      n: 0
+    };
+    Object.defineProperty(this.props, key, {
+      get() {
+        const value = get();
+        if (solid_api_default.getListener()) {
+          solid_api_default.onCleanup(
+            () => --o.n === 0 && self.onPropStateChange?.(key, "stale" /* Stale */)
+          );
+        }
+        ++o.n === 1 && self.onPropStateChange?.(key, "live" /* Live */);
+        if (value !== o.v)
+          self.onValueUpdate?.(id);
+        return o.v = value;
+      },
+      enumerable: true
+    });
+    return { getValue: () => o.v, isStale: true };
+  }
+};
+var compareProxyPropKeys = (oldKeys, newKeys) => {
+  const added = new Set(newKeys);
+  const removed = [];
+  let changed = false;
+  for (const key of oldKeys) {
+    if (added.has(key))
+      added.delete(key);
+    else {
+      changed = true;
+      removed.push(key);
+    }
+  }
+  if (!changed && !added.size)
+    return null;
+  return { added: Array.from(added), removed };
+};
+function clearOwnerObservers(owner, observedPropsMap) {
+  if (isSolidComputation(owner)) {
+    removeValueUpdateObserver(owner, $INSPECTOR);
+    if (isSolidComponent(owner)) {
+      observedPropsMap.get(owner.props)?.unobserve();
+    }
+  }
+  if (owner.sourceMap) {
+    for (const node of Object.values(owner.sourceMap))
+      removeValueUpdateObserver(node, $INSPECTOR);
+  }
+  if (owner.owned) {
+    for (const node of owner.owned)
+      removeValueUpdateObserver(node, $INSPECTOR);
+  }
+}
+var ValueMap;
+var OnValueUpdate;
+var OnPropStateChange;
+var PropsMap;
+var $INSPECTOR = Symbol("inspector");
+var typeToObjectTypeMap = {
+  ["signal" /* Signal */]: "signal" /* Signal */,
+  ["memo" /* Memo */]: "owner" /* Owner */,
+  ["store" /* Store */]: "store" /* Store */
+};
+function mapSourceValue(node, handler, isMemo) {
+  const type = isMemo ? "memo" /* Memo */ : isSolidStore(node) ? "store" /* Store */ : isSolidSignal(node) ? "signal" /* Signal */ : null;
+  if (!type)
+    return null;
+  const { value } = node, id = getSdtId(node, typeToObjectTypeMap[type]);
+  ValueMap.add(`${"signal" /* Signal */}:${id}`, () => node.value);
+  if (type !== "store" /* Store */)
+    observeValueUpdate(node, (v) => handler(id, v), $INSPECTOR);
+  return {
+    type,
+    name: getNodeName(node),
+    id,
+    value: encodeValue(value, false)
+  };
+}
+function mapProps(props) {
+  const isProxy = !!props[solid_api_default.$PROXY];
+  const record = {};
+  let checkProxyProps;
+  if (isProxy) {
+    let propsKeys = Object.keys(props);
+    for (const key of propsKeys)
+      record[key] = { getter: "stale" /* Stale */, value: null };
+    checkProxyProps = () => {
+      const _oldKeys = propsKeys;
+      return compareProxyPropKeys(_oldKeys, propsKeys = Object.keys(props));
+    };
+  } else {
+    let observed = PropsMap.get(props);
+    if (!observed)
+      PropsMap.set(props, observed = new ObservedProps(props));
+    observed.observe(OnPropStateChange, OnValueUpdate);
+    for (const [key, desc] of Object.entries(Object.getOwnPropertyDescriptors(props))) {
+      const id = `prop:${key}`;
+      if (desc.get) {
+        const { getValue, isStale } = observed.observeProp(key, id, desc.get);
+        ValueMap.add(id, getValue);
+        const lastValue = getValue();
+        record[key] = {
+          getter: isStale ? "stale" /* Stale */ : "live" /* Live */,
+          value: lastValue !== $NOT_SET ? encodeValue(getValue(), false) : null
+        };
+      } else {
+        record[key] = {
+          getter: false,
+          value: encodeValue(desc.value, false)
+        };
+        if (Array.isArray(desc.value) || isRecord(desc.value))
+          ValueMap.add(id, () => desc.value);
+      }
+    }
+  }
+  return { props: { proxy: isProxy, record }, checkProxyProps };
+}
+var collectOwnerDetails = /* @__PURE__ */ untrackedCallback(function(owner, config) {
+  const { onValueUpdate } = config;
+  ValueMap = new ValueNodeMap();
+  OnValueUpdate = onValueUpdate;
+  OnPropStateChange = config.onPropStateChange;
+  PropsMap = config.observedPropsMap;
+  const id = getSdtId(owner, "owner" /* Owner */);
+  const type = markOwnerType(owner);
+  let { sourceMap, owned } = owner;
+  let getValue = () => owner.value;
+  const details = { id, name: getNodeName(owner), type, signals: [] };
+  if (type === "context" /* Context */) {
+    sourceMap = void 0;
+    owned = null;
+    const symbols = Object.getOwnPropertySymbols(owner.context);
+    if (symbols.length !== 1) {
+      throw new Error("Context field has more than one symbol. This is not expected.");
+    } else {
+      const contextValue = owner.context[symbols[0]];
+      getValue = () => contextValue;
+    }
+  }
+  let checkProxyProps;
+  if (isSolidComputation(owner)) {
+    if (isSolidComponent(owner)) {
+      const refresh = getComponentRefreshNode(owner);
+      if (refresh) {
+        sourceMap = refresh.sourceMap;
+        owned = refresh.owned;
+        getValue = () => refresh.value;
+      }
+      ({ checkProxyProps, props: details.props } = mapProps(owner.props));
+      let location = owner.component.location;
+      if (
+        // get location from component.location
+        typeof location === "string" && (location = parseLocationString(location)) || // get location from the babel plugin marks
+        (location = solid_api_default.getOwnerLocation(owner)) && (location = parseLocationString(location))
+      ) {
+        details.location = location;
+      }
+    } else {
+      observeValueUpdate(owner, () => onValueUpdate("value" /* Value */), $INSPECTOR);
+    }
+    details.value = encodeValue(getValue(), false);
+  }
+  const onSignalUpdate = (signalId) => onValueUpdate(`${"signal" /* Signal */}:${signalId}`);
+  if (sourceMap) {
+    for (const signal of sourceMap) {
+      const mapped = mapSourceValue(signal, onSignalUpdate, false);
+      mapped && details.signals.push(mapped);
+    }
+  }
+  if (owned) {
+    for (const node of owned) {
+      if (!isSolidMemo(node))
+        continue;
+      const mapped = mapSourceValue(node, onSignalUpdate, true);
+      mapped && details.signals.push(mapped);
+    }
+  }
+  ValueMap.add("value" /* Value */, getValue);
+  const result = {
+    details,
+    valueMap: ValueMap,
+    checkProxyProps
+  };
+  ValueMap = OnValueUpdate = OnPropStateChange = PropsMap = void 0;
+  return result;
+});
+
+// src/inspector/store.ts
+var { isWrappable } = solid_api_default.STORE_DEV;
+var Nodes = /* @__PURE__ */ new WeakMap();
+var OnNodeUpdate3 = null;
+function setOnStoreNodeUpdate(fn) {
+  OnNodeUpdate3 = fn;
+}
+solid_api_default.STORE_DEV.hooks.onStoreNodeUpdate = (node, property, value, prev) => solid_api_default.untrack(() => {
+  if (!OnNodeUpdate3 || !Nodes.has(node) || typeof property === "symbol")
+    return;
+  property = property.toString();
+  const storeProperty = `${getSdtId(node, "store-node" /* StoreNode */)}:${property}`;
+  if (property === "length" && typeof value === "number" && Array.isArray(node)) {
+    return OnNodeUpdate3(storeProperty, value);
+  }
+  isWrappable(prev) && untrackStore(prev, storeProperty);
+  if (value === void 0) {
+    OnNodeUpdate3(storeProperty, void 0);
+  } else {
+    OnNodeUpdate3(storeProperty, { value });
+    isWrappable(value) && trackStore(value, storeProperty);
+  }
+});
+function observeStoreNode(rootNode) {
+  rootNode = solid_api_default.unwrap(rootNode);
+  const symbol = Symbol("inspect-store");
+  return solid_api_default.untrack(() => {
+    trackStore(rootNode, symbol);
+    return () => untrackStore(rootNode, symbol);
+  });
+}
+function trackStore(node, parent) {
+  const data = Nodes.get(node);
+  if (data)
+    data.add(parent);
+  else {
+    Nodes.set(node, /* @__PURE__ */ new Set([parent]));
+    const id = getSdtId(node, "store-node" /* StoreNode */);
+    forEachStoreProp(node, (key, child) => trackStore(child, `${id}:${key}`));
+  }
+}
+function untrackStore(node, parent) {
+  const data = Nodes.get(node);
+  if (data && data.delete(parent)) {
+    data.size === 0 && Nodes.delete(node);
+    const id = getSdtId(node, "store-node" /* StoreNode */);
+    forEachStoreProp(node, (key, child) => untrackStore(child, `${id}:${key}`));
+  }
+}
+function forEachStoreProp(node, fn) {
+  if (Array.isArray(node)) {
+    for (let i = 0; i < node.length; i++) {
+      const child = node[i];
+      isWrappable(child) && fn(i.toString(), child);
+    }
+  } else {
+    for (const key in node) {
+      const { value, get } = Object.getOwnPropertyDescriptor(node, key);
+      if (!get && isWrappable(value))
+        fn(key, value);
+    }
+  }
+}
+
+// src/inspector/index.ts
+function createInspector(props) {
+  let lastDetails;
+  let inspectedOwner;
+  let valueMap = new ValueNodeMap();
+  const propsMap = /* @__PURE__ */ new WeakMap();
+  let checkProxyProps;
+  const { pushPropState, pushValueUpdate, pushInspectToggle, triggerPropsCheck, clearUpdates } = (() => {
+    const valueUpdates = /* @__PURE__ */ new Map();
+    let storeUpdates = [];
+    let checkProps = false;
+    let propStates = {};
+    const flush = scheduleIdle(() => {
+      const batchedUpdates = [];
+      for (const [id, toggleChange] of valueUpdates) {
+        const node = valueMap.get(id);
+        if (!node || !node.getValue)
+          continue;
+        const selected = node.isSelected();
+        const encoded = encodeValue(
+          node.getValue(),
+          selected,
+          selected && ((storeNode) => node.addStoreObserver(observeStoreNode(storeNode)))
+        );
+        batchedUpdates.push([toggleChange === null ? "value" : "inspectToggle", [id, encoded]]);
+      }
+      valueUpdates.clear();
+      for (const [storeProperty, data] of storeUpdates)
+        batchedUpdates.push([
+          "store",
+          [
+            storeProperty,
+            typeof data === "object" ? encodeValue(data.value, true, void 0, true) : data ?? null
+          ]
+        ]);
+      storeUpdates = [];
+      if (checkProps && checkProxyProps) {
+        const keys = checkProxyProps();
+        if (keys)
+          batchedUpdates.push(["propKeys", keys]);
+        checkProps = false;
+      }
+      if (Object.keys(propStates).length) {
+        batchedUpdates.push(["propState", propStates]);
+        propStates = {};
+      }
+      batchedUpdates.length && props.emit("InspectorUpdate", batchedUpdates);
+    });
+    const flushPropsCheck = throttle(flush, 200);
+    setOnStoreNodeUpdate((...payload) => {
+      storeUpdates.push(payload);
+      flush();
+    });
+    return {
+      pushValueUpdate(id) {
+        valueUpdates.set(id, null);
+        flush();
+      },
+      pushInspectToggle(id, selected) {
+        const current = valueUpdates.get(id);
+        if (current === selected || current === null)
+          return;
+        else if (current === !selected)
+          valueUpdates.delete(id);
+        else
+          valueUpdates.set(id, selected);
+        flush();
+      },
+      triggerPropsCheck() {
+        checkProps = true;
+        flushPropsCheck();
+      },
+      pushPropState(key, state) {
+        propStates[key] = state;
+        flush();
+      },
+      // since the updates are emitten on timeout, we need to make sure that
+      // switching off the debugger or unselecting the owner will clear the updates
+      clearUpdates() {
+        valueUpdates.clear();
+        storeUpdates = [];
+        checkProps = false;
+        flush.clear();
+        flushPropsCheck.clear();
+      }
+    };
+  })();
+  let clearPrevDisposeListener;
+  createEffect(() => {
+    if (!props.enabled())
+      return;
+    const id = props.inspectedOwnerId();
+    queueMicrotask(() => {
+      const owner = id && getObjectById(id, "owner" /* Owner */);
+      inspectedOwner && clearOwnerObservers(inspectedOwner, propsMap);
+      inspectedOwner = owner;
+      valueMap.reset();
+      clearUpdates();
+      if (owner) {
+        const result = collectOwnerDetails(owner, {
+          onValueUpdate: pushValueUpdate,
+          onPropStateChange: pushPropState,
+          observedPropsMap: propsMap
+        });
+        props.emit("InspectedNodeDetails", result.details);
+        valueMap = result.valueMap;
+        lastDetails = result.details;
+        checkProxyProps = result.checkProxyProps || null;
+      } else {
+        lastDetails = void 0;
+        checkProxyProps = null;
+      }
+      clearPrevDisposeListener?.();
+      clearPrevDisposeListener = owner ? onOwnerDispose(owner, props.resetInspectedNode) : void 0;
+    });
+  });
+  createEffect(() => {
+    if (!props.enabled())
+      return;
+    onCleanup(addSolidUpdateListener(() => checkProxyProps && triggerPropsCheck()));
+  });
+  return {
+    getLastDetails: () => lastDetails,
+    toggleValueNode({ id, selected }) {
+      const node = valueMap.get(id);
+      if (!node)
+        return warn("Could not find value node:", id);
+      node.setSelected(selected);
+      pushInspectToggle(id, selected);
+    }
+  };
+}
+var Mode;
+var RootId;
+var OnComputationUpdate;
+var RegisterComponent;
+var ElementsMap = /* @__PURE__ */ new Map();
+var $WALKER = Symbol("tree-walker");
+function observeComputation(owner, attachedData) {
+  let isLeaf = !owner.owned || owner.owned.length === 0;
+  const boundHandler = OnComputationUpdate.bind(
+    void 0,
+    RootId,
+    attachedData,
+    getSdtId(attachedData, "owner" /* Owner */)
+  );
+  const handler = isLeaf && Mode !== "dom" /* DOM */ ? () => {
+    if (isLeaf && (!owner.owned || owner.owned.length === 0)) {
+      boundHandler(false);
+    } else {
+      isLeaf = false;
+      boundHandler(true);
+    }
+  } : boundHandler.bind(void 0, true);
+  observeComputationUpdate(owner, handler, $WALKER);
+}
+function mapChildren(owner, mappedOwner) {
+  const children = [];
+  const rawChildren = owner.owned ? owner.owned.slice() : [];
+  if (owner.sdtSubRoots)
+    rawChildren.push.apply(rawChildren, owner.sdtSubRoots);
+  if (Mode === "owners" /* Owners */) {
+    for (const child of rawChildren) {
+      const mappedChild = mapOwner(child, mappedOwner);
+      if (mappedChild)
+        children.push(mappedChild);
+    }
+  } else {
+    for (const child of rawChildren) {
+      const type = markOwnerType(child);
+      if (type === "component" /* Component */) {
+        const mappedChild = mapOwner(child, mappedOwner);
+        if (mappedChild)
+          children.push(mappedChild);
+      } else {
+        if (isObservableComputation(child))
+          observeComputation(child, owner);
+        children.push.apply(children, mapChildren(child, mappedOwner));
+      }
+    }
+  }
+  return children;
+}
+var MappedOwnerNode;
+var AddedToParentElements = false;
+function mapElements(els, parentChildren) {
+  const r = [];
+  els:
+    for (const el of els) {
+      if (!(el instanceof HTMLElement))
+        continue;
+      if (parentChildren) {
+        const toCheck = [parentChildren];
+        let index = 0;
+        let elNodes = toCheck[index++];
+        while (elNodes) {
+          for (let i = 0; i < elNodes.length; i++) {
+            const elNode = elNodes[i];
+            const elNodeData = ElementsMap.get(elNode);
+            if (elNodeData && elNodeData.el === el) {
+              if (AddedToParentElements) {
+                elNodes.splice(i, 1);
+              } else {
+                elNodes[i] = MappedOwnerNode;
+                AddedToParentElements = true;
+              }
+              r.push(elNode);
+              elNodeData.component = MappedOwnerNode;
+              continue els;
+            }
+            if (elNode.children.length)
+              toCheck.push(elNode.children);
+          }
+          elNodes = toCheck[index++];
+        }
+      }
+      const mappedEl = {
+        id: getSdtId(el, "element" /* Element */),
+        type: "element" /* Element */,
+        name: el.localName,
+        children: []
+      };
+      r.push(mappedEl);
+      ElementsMap.set(mappedEl, { el, component: MappedOwnerNode });
+      if (el.children.length)
+        mappedEl.children = mapElements(el.children, parentChildren);
+    }
+  return r;
+}
+function mapOwner(owner, parent, overwriteType) {
+  const id = getSdtId(owner, "owner" /* Owner */);
+  const type = overwriteType ?? markOwnerType(owner);
+  const name = getNodeName(owner);
+  const mapped = { id, type, name };
+  let resolvedElements;
+  if (type === "component" /* Component */) {
+    let contextNode;
+    if (name === "provider" && owner.owned && owner.owned.length === 1 && markOwnerType(contextNode = owner.owned[0]) === "context" /* Context */) {
+      return mapOwner(contextNode, parent, "context" /* Context */);
+    }
+    RegisterComponent({
+      owner,
+      id,
+      name,
+      elements: resolvedElements = resolveElements(owner.value)
+    });
+    const refresh = getComponentRefreshNode(owner);
+    if (refresh) {
+      mapped.hmr = true;
+      owner = refresh;
+    }
+  } else if (isObservableComputation(owner)) {
+    observeComputation(owner, owner);
+    if (!owner.sources || owner.sources.length === 0)
+      mapped.frozen = true;
+  }
+  const children = [];
+  mapped.children = children;
+  AddedToParentElements = false;
+  MappedOwnerNode = mapped;
+  if (Mode === "dom" /* DOM */ && (resolvedElements = resolvedElements === void 0 ? resolveElements(owner.value) : resolvedElements)) {
+    children.push.apply(
+      children,
+      mapElements(
+        Array.isArray(resolvedElements) ? resolvedElements : [resolvedElements],
+        parent?.children
+      )
+    );
+  }
+  const addedToParent = AddedToParentElements;
+  children.push.apply(children, mapChildren(owner, mapped));
+  return addedToParent ? void 0 : mapped;
+}
+var walkSolidTree = /* @__PURE__ */ untrackedCallback(function(owner, config) {
+  Mode = config.mode;
+  RootId = config.rootId;
+  OnComputationUpdate = config.onComputationUpdate;
+  RegisterComponent = config.registerComponent;
+  const r = mapOwner(owner, null);
+  if (Mode === "dom" /* DOM */) {
+    for (const [elNode, { el, component }] of ElementsMap) {
+      RegisterComponent({
+        element: el,
+        componentId: component.id,
+        elementId: elNode.id
+      });
+    }
+    ElementsMap.clear();
+  }
+  Mode = RootId = OnComputationUpdate = RegisterComponent = void 0;
+  return r;
+});
+
+// src/structure/index.ts
+function getClosestIncludedOwner(owner, mode) {
+  let closest = null;
+  let current = owner;
+  do {
+    if (isDisposed(current))
+      closest = current.owner;
+    current = current.owner;
+  } while (current);
+  owner = closest ?? owner;
+  if (mode === "owners" /* Owners */)
+    return owner;
+  let root = null;
+  do {
+    const type = markOwnerType(owner);
+    if (type === "component" /* Component */ || type === "context" /* Context */)
+      return owner;
+    if (type === "root" /* Root */)
+      root = owner;
+    owner = owner.owner;
+  } while (owner);
+  return root;
+}
+function createStructure(props) {
+  let treeWalkerMode = DEFAULT_WALKER_MODE;
+  const updateQueue = /* @__PURE__ */ new Set();
+  const ownerRoots = /* @__PURE__ */ new Map();
+  const removedRoots = /* @__PURE__ */ new Set();
+  let shouldUpdateAllRoots = false;
+  const onComputationUpdate = (rootId, owner, ownerId, changedStructure) => {
+    queueMicrotask(() => {
+      if (!props.enabled())
+        return;
+      changedStructure && updateOwner(owner, rootId);
+      props.onNodeUpdate(ownerId);
+    });
+  };
+  function forceFlushRootUpdateQueue() {
+    if (props.enabled()) {
+      const updated = {};
+      const partial = !shouldUpdateAllRoots;
+      shouldUpdateAllRoots = false;
+      const [owners, getRootId] = partial ? [updateQueue, (owner) => ownerRoots.get(owner)] : [getCurrentRoots(), (owner) => getSdtId(owner, "owner" /* Owner */)];
+      for (const owner of owners) {
+        const rootId = getRootId(owner);
+        const tree = walkSolidTree(owner, {
+          rootId,
+          mode: treeWalkerMode,
+          onComputationUpdate,
+          registerComponent
+        });
+        const map = updated[rootId];
+        if (map)
+          map[tree.id] = tree;
+        else
+          updated[rootId] = { [tree.id]: tree };
+      }
+      props.onStructureUpdate({ partial, updated, removed: [...removedRoots] });
+    }
+    updateQueue.clear();
+    flushRootUpdateQueue.clear();
+    removedRoots.clear();
+    ownerRoots.clear();
+  }
+  const flushRootUpdateQueue = throttle(forceFlushRootUpdateQueue, 250);
+  function updateOwner(node, topRootId) {
+    updateQueue.add(node);
+    ownerRoots.set(node, topRootId);
+    flushRootUpdateQueue();
+  }
+  setOnOwnerNeedsUpdate((node, topRootId) => {
+    const closestIncludedOwner = getClosestIncludedOwner(node, treeWalkerMode);
+    closestIncludedOwner && updateOwner(closestIncludedOwner, topRootId);
+  });
+  setOnRootRemoved((rootId) => {
+    removedRoots.add(rootId);
+    flushRootUpdateQueue();
+  });
+  props.listenToViewChange((view) => {
+    if (view === "structure" /* Structure */) {
+      updateAllRoots();
+    }
+  });
+  function updateAllRoots() {
+    shouldUpdateAllRoots = true;
+    flushRootUpdateQueue();
+  }
+  function forceUpdateAllRoots() {
+    shouldUpdateAllRoots = true;
+    queueMicrotask(forceFlushRootUpdateQueue);
+  }
+  function setTreeWalkerMode(mode) {
+    treeWalkerMode = mode;
+    updateAllRoots();
+    clearComponentRegistry();
+  }
+  return {
+    updateAllRoots,
+    forceUpdateAllRoots,
+    setTreeWalkerMode,
+    resetTreeWalkerMode: () => setTreeWalkerMode(DEFAULT_WALKER_MODE),
+    getClosestIncludedOwner(owner) {
+      return getClosestIncludedOwner(owner, treeWalkerMode);
+    }
+  };
+}
+
+// src/main/index.ts
+var plugin = createInternalRoot(() => {
+  const hub = {
+    output: createGlobalEmitter(),
+    input: createGlobalEmitter()
+  };
+  const [modules, toggleModules] = createStaticStore({
+    debugger: false,
+    locator: false,
+    dgraph: false,
+    locatorKeyPressSignal: () => false
+  });
+  const debuggerEnabled = createMemo(() => modules.debugger || modules.locatorKeyPressSignal());
+  const dgraphEnabled = createMemo(() => modules.dgraph && debuggerEnabled());
+  const locatorEnabled = createMemo(
+    () => (modules.locatorKeyPressSignal() || modules.locator) && debuggerEnabled()
+  );
+  createEffect(
+    defer(debuggerEnabled, (enabled) => {
+      hub.output.emit("DebuggerEnabled", enabled);
+    })
+  );
+  const viewChange = createEventBus();
+  function setView(view) {
+    batch(() => {
+      viewChange.emit(view);
+    });
+  }
+  function toggleModule(data) {
+    switch (data.module) {
+      case "structure" /* Structure */:
+        break;
+      case "dgraph" /* Dgraph */:
+        toggleModules("dgraph", data.enabled);
+        break;
+      case "locator" /* Locator */:
+        toggleModules("locator", data.enabled);
+        break;
+    }
+  }
+  const INITIAL_INSPECTED_STATE = {
+    ownerId: null,
+    signalId: null,
+    treeWalkerOwnerId: null
+  };
+  const [inspectedState, setInspectedState] = createSignal(INITIAL_INSPECTED_STATE, { equals: false });
+  const inspectedOwnerId = createMemo(() => inspectedState().ownerId);
+  createEffect(() => hub.output.emit("InspectedState", inspectedState()));
+  function getTreeWalkerOwnerId(ownerId) {
+    const owner = ownerId && getObjectById(ownerId, "owner" /* Owner */);
+    const treeWalkerOwner = owner && structure.getClosestIncludedOwner(owner);
+    return treeWalkerOwner ? getSdtId(treeWalkerOwner, "owner" /* Owner */) : null;
+  }
+  function updateInspectedNode() {
+    setInspectedState((p) => ({ ...p, treeWalkerOwnerId: getTreeWalkerOwnerId(p.treeWalkerOwnerId) }));
+  }
+  function resetInspectedNode() {
+    setInspectedState(INITIAL_INSPECTED_STATE);
+  }
+  function setInspectedNode(data) {
+    let { ownerId, signalId } = data ?? { ownerId: null, signalId: null };
+    if (ownerId && !getObjectById(ownerId, "owner" /* Owner */))
+      ownerId = null;
+    if (signalId && !getObjectById(signalId, "signal" /* Signal */))
+      signalId = null;
+    setInspectedState({
+      ownerId,
+      signalId,
+      treeWalkerOwnerId: getTreeWalkerOwnerId(ownerId)
+    });
+  }
+  createComputed(
+    defer(debuggerEnabled, (enabled) => {
+      if (!enabled)
+        resetInspectedNode();
+    })
+  );
+  const pushNodeUpdate = createBatchedUpdateEmitter((updates) => {
+    hub.output.emit("NodeUpdates", updates);
+  });
+  const structure = createStructure({
+    onStructureUpdate(updates) {
+      hub.output.emit("StructureUpdates", updates);
+      updateInspectedNode();
+    },
+    onNodeUpdate: pushNodeUpdate,
+    enabled: debuggerEnabled,
+    listenToViewChange: viewChange.listen
+  });
+  const inspector = createInspector({
+    emit: hub.output.emit,
+    enabled: debuggerEnabled,
+    inspectedOwnerId,
+    resetInspectedNode
+  });
+  createDependencyGraph({
+    emit: hub.output.emit,
+    enabled: dgraphEnabled,
+    listenToViewChange: viewChange.listen,
+    onNodeUpdate: pushNodeUpdate,
+    inspectedState
+  });
+  const locator = createLocator({
+    emit: hub.output.emit,
+    locatorEnabled,
+    setLocatorEnabledSignal: (signal) => toggleModules("locatorKeyPressSignal", () => signal),
+    onComponentClick(componentId, next) {
+      modules.debugger ? hub.output.emit("InspectedComponent", componentId) : next();
+    }
+  });
+  function openInspectedNodeLocation() {
+    const details = inspector.getLastDetails();
+    details?.location && locator.openElementSourceCode(details.location, details.name);
+  }
+  createEffect(
+    defer(modules.locatorKeyPressSignal, (state) => hub.output.emit("LocatorModeChange", state))
+  );
+  hub.input.listen((e) => {
+    switch (e.name) {
+      case "ResetState": {
+        batch(() => {
+          resetInspectedNode();
+          structure.resetTreeWalkerMode();
+          locator.setDevtoolsHighlightTarget(null);
+        });
+        break;
+      }
+      case "HighlightElementChange":
+        return locator.setDevtoolsHighlightTarget(e.details);
+      case "InspectNode":
+        return setInspectedNode(e.details);
+      case "InspectValue":
+        return inspector.toggleValueNode(e.details);
+      case "OpenLocation":
+        return openInspectedNodeLocation();
+      case "TreeViewModeChange":
+        return structure.setTreeWalkerMode(e.details);
+      case "ViewChange":
+        return setView(e.details);
+      case "ToggleModule":
+        return toggleModule(e.details);
+    }
+  });
+  function useDebugger2() {
+    return {
+      meta: {
+        versions: solid_api_default.versions
+      },
+      enabled: debuggerEnabled,
+      toggleEnabled: (enabled) => void toggleModules("debugger", enabled),
+      on: hub.output.on,
+      listen: hub.output.listen,
+      emit: hub.input.emit
+    };
+  }
+  return {
+    useDebugger: useDebugger2,
+    useLocator: locator.useLocator
+  };
+});
+var { useDebugger, useLocator } = plugin;
+
+export { addSolidUpdateListener, attachDebugger, createInternalRoot, getNodeName, getNodeType, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidSignal, isSolidStore, lookupOwner, makeValueUpdateListener, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots, useDebugger, useLocator };

dist/chunks/chunk-S74N7CWV.js

+// src/main/constants.ts
+var DevtoolsMainView = /* @__PURE__ */ ((DevtoolsMainView2) => {
+  DevtoolsMainView2["Structure"] = "structure";
+  return DevtoolsMainView2;
+})(DevtoolsMainView || {});
+var DEFAULT_MAIN_VIEW = "structure" /* Structure */;
+var DebuggerModule = /* @__PURE__ */ ((DebuggerModule2) => {
+  DebuggerModule2["Locator"] = "locator";
+  DebuggerModule2["Structure"] = "structure";
+  DebuggerModule2["Dgraph"] = "dgraph";
+  return DebuggerModule2;
+})(DebuggerModule || {});
+var TreeWalkerMode = /* @__PURE__ */ ((TreeWalkerMode2) => {
+  TreeWalkerMode2["Owners"] = "owners";
+  TreeWalkerMode2["Components"] = "components";
+  TreeWalkerMode2["DOM"] = "dom";
+  return TreeWalkerMode2;
+})(TreeWalkerMode || {});
+var DEFAULT_WALKER_MODE = "components" /* Components */;
+var NodeType = /* @__PURE__ */ ((NodeType2) => {
+  NodeType2["Root"] = "root";
+  NodeType2["Component"] = "component";
+  NodeType2["Element"] = "element";
+  NodeType2["Effect"] = "effect";
+  NodeType2["Render"] = "render";
+  NodeType2["Memo"] = "memo";
+  NodeType2["Computation"] = "computation";
+  NodeType2["Refresh"] = "refresh";
+  NodeType2["Context"] = "context";
+  NodeType2["CatchError"] = "catchError";
+  NodeType2["Signal"] = "signal";
+  NodeType2["Store"] = "store";
+  return NodeType2;
+})(NodeType || {});
+var NODE_TYPE_NAMES = {
+  ["root" /* Root */]: "Root",
+  ["component" /* Component */]: "Component",
+  ["element" /* Element */]: "Element",
+  ["effect" /* Effect */]: "Effect",
+  ["render" /* Render */]: "Render Effect",
+  ["memo" /* Memo */]: "Memo",
+  ["computation" /* Computation */]: "Computation",
+  ["refresh" /* Refresh */]: "Refresh",
+  ["context" /* Context */]: "Context",
+  ["catchError" /* CatchError */]: "CatchError",
+  ["signal" /* Signal */]: "Signal",
+  ["store" /* Store */]: "Store"
+};
+var ValueItemType = /* @__PURE__ */ ((ValueItemType2) => {
+  ValueItemType2["Signal"] = "signal";
+  ValueItemType2["Prop"] = "prop";
+  ValueItemType2["Value"] = "value";
+  return ValueItemType2;
+})(ValueItemType || {});
+var UNKNOWN = "unknown";
+
+// src/inspector/types.ts
+var INFINITY = "Infinity";
+var NEGATIVE_INFINITY = "NegativeInfinity";
+var NAN = "NaN";
+var UNDEFINED = "undefined";
+var ValueType = /* @__PURE__ */ ((ValueType2) => {
+  ValueType2["Number"] = "number";
+  ValueType2["Boolean"] = "boolean";
+  ValueType2["String"] = "string";
+  ValueType2["Null"] = "null";
+  ValueType2["Symbol"] = "symbol";
+  ValueType2["Array"] = "array";
+  ValueType2["Object"] = "object";
+  ValueType2["Function"] = "function";
+  ValueType2["Getter"] = "getter";
+  ValueType2["Element"] = "element";
+  ValueType2["Instance"] = "instance";
+  ValueType2["Store"] = "store";
+  ValueType2[ValueType2["Unknown"] = UNKNOWN] = "Unknown";
+  return ValueType2;
+})(ValueType || {});
+var PropGetterState = /* @__PURE__ */ ((PropGetterState2) => {
+  PropGetterState2["Live"] = "live";
+  PropGetterState2["Stale"] = "stale";
+  return PropGetterState2;
+})(PropGetterState || {});
+
+// src/locator/types.ts
+var WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
+var LOCATION_ATTRIBUTE_NAME = "data-source-loc";
+
+// src/main/types.ts
+var DevEventType = /* @__PURE__ */ ((DevEventType2) => {
+  DevEventType2["RootCreated"] = "RootCreated";
+  return DevEventType2;
+})(DevEventType || {});
+var getValueItemId = (type, id) => {
+  if (type === "value" /* Value */)
+    return "value" /* Value */;
+  return `${type}:${id}`;
+};
+
+export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevEventType, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, UNKNOWN, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId };

dist/index-7bfdbbff.d.ts

+import * as _solid_primitives_event_bus from '@solid-primitives/event-bus';
+import * as solid_js from 'solid-js';
+import { DEV, getOwner, getListener, onCleanup, $PROXY, untrack } from 'solid-js';
+import { ToDyscriminatedUnion } from '@solid-devtools/shared/utils';
+import { KbdKey } from '@solid-primitives/keyboard';
+import * as solid_js_store_types_store from 'solid-js/store/types/store';
+import * as solid_js_store from 'solid-js/store';
+import { DEV as DEV$1, unwrap } from 'solid-js/store';
+import * as solid_js_types_reactive_signal from 'solid-js/types/reactive/signal';
+import * as WebAPI from 'solid-js/web';
+
+/**
+ * Main modules and views of the devtools. Used for "routing".
+ */
+declare enum DevtoolsMainView {
+    Structure = "structure"
+}
+declare const DEFAULT_MAIN_VIEW = DevtoolsMainView.Structure;
+declare enum DebuggerModule {
+    Locator = "locator",
+    Structure = "structure",
+    Dgraph = "dgraph"
+}
+declare enum TreeWalkerMode {
+    Owners = "owners",
+    Components = "components",
+    DOM = "dom"
+}
+declare const DEFAULT_WALKER_MODE = TreeWalkerMode.Components;
+declare enum NodeType {
+    Root = "root",
+    Component = "component",
+    Element = "element",
+    Effect = "effect",
+    Render = "render",
+    Memo = "memo",
+    Computation = "computation",
+    Refresh = "refresh",
+    Context = "context",
+    CatchError = "catchError",
+    Signal = "signal",
+    Store = "store"
+}
+declare const NODE_TYPE_NAMES: Readonly<Record<NodeType, string>>;
+declare enum ValueItemType {
+    Signal = "signal",
+    Prop = "prop",
+    Value = "value"
+}
+declare const UNKNOWN = "unknown";
+
+declare namespace SerializedDGraph {
+    type Node = {
+        name: string;
+        depth: number;
+        type: Exclude<NodeType, NodeType.Root | NodeType.Component>;
+        sources: readonly NodeID[] | undefined;
+        observers: readonly NodeID[] | undefined;
+        graph: NodeID | undefined;
+    };
+    type Graph = Record<NodeID, Node>;
+}
+
+type DGraphUpdate = SerializedDGraph.Graph | null;
+
+type StructureUpdates = {
+    /** Partial means that the updates are based on the previous structure state */
+    partial: boolean;
+    /** Removed roots */
+    removed: NodeID[];
+    /** Record: `rootId` -- Record of updated nodes by `nodeId` */
+    updated: Partial<Record<NodeID, Partial<Record<NodeID, Mapped.Owner>>>>;
+};
+
+type StoreNodeProperty = `${NodeID}:${string}`;
+
+type ToggleInspectedValueData = {
+    id: ValueItemID;
+    selected: boolean;
+};
+
+declare const INFINITY = "Infinity";
+declare const NEGATIVE_INFINITY = "NegativeInfinity";
+declare const NAN = "NaN";
+declare const UNDEFINED = "undefined";
+declare enum ValueType {
+    Number = "number",
+    Boolean = "boolean",
+    String = "string",
+    Null = "null",
+    Symbol = "symbol",
+    Array = "array",
+    Object = "object",
+    Function = "function",
+    Getter = "getter",
+    Element = "element",
+    Instance = "instance",
+    Store = "store",
+    Unknown = "unknown"
+}
+type EncodedValueDataMap = {
+    [ValueType.Null]: null | typeof UNDEFINED;
+    [ValueType.Array]: number | number[];
+    [ValueType.Object]: number | {
+        [key: string]: number;
+    };
+    [ValueType.Number]: number | typeof INFINITY | typeof NEGATIVE_INFINITY | typeof NAN;
+    [ValueType.Boolean]: boolean;
+    [ValueType.String]: string;
+    [ValueType.Symbol]: string;
+    [ValueType.Function]: string;
+    [ValueType.Getter]: string;
+    [ValueType.Element]: `${NodeID}:${string}`;
+    [ValueType.Instance]: string;
+    [ValueType.Store]: `${NodeID}:${number}`;
+    [ValueType.Unknown]: never;
+};
+type EncodedValueMap = {
+    [T in ValueType]: [type: T, data: EncodedValueDataMap[T]];
+};
+type EncodedValue<T extends ValueType = ValueType> = EncodedValueMap[T];
+declare enum PropGetterState {
+    /** getter is being observed, so it's value is up-to-date */
+    Live = "live",
+    /** getter is not observed, so it's value may be outdated */
+    Stale = "stale"
+}
+type InspectorUpdateMap = {
+    /** the value of a valueItem was updated */
+    value: [id: ValueItemID, value: EncodedValue[]];
+    /** a valueItem was expanded or collapsed, sends it's appropriable value */
+    inspectToggle: [id: ValueItemID, value: EncodedValue[]];
+    /** update to a store-node */
+    store: [store: StoreNodeProperty, value: EncodedValue[] | null | number];
+    /** List of new keys — all of the values are getters, so they won't change */
+    propKeys: {
+        added: string[];
+        removed: string[];
+    };
+    /** state of getter props (STALE | LIVE) */
+    propState: {
+        [key in string]: PropGetterState;
+    };
+};
+type InspectorUpdate = {
+    [T in keyof InspectorUpdateMap]: [type: T, data: InspectorUpdateMap[T]];
+}[keyof InspectorUpdateMap];
+
+declare const enum DevEventType {
+    RootCreated = "RootCreated"
+}
+type DevEventDataMap = {
+    [DevEventType.RootCreated]: Solid.Owner;
+};
+type StoredDevEvent = {
+    [K in keyof DevEventDataMap]: {
+        timestamp: number;
+        type: K;
+        data: DevEventDataMap[K];
+    };
+}[keyof DevEventDataMap];
+declare global {
+    /** Solid DEV APIs exposed to the debugger by the setup script */
+    var SolidDevtools$$: {
+        readonly Solid: typeof solid_js;
+        readonly Store: typeof solid_js_store;
+        readonly Web: typeof WebAPI;
+        readonly DEV: NonNullable<typeof DEV>;
+        readonly getOwner: typeof getOwner;
+        readonly getListener: typeof getListener;
+        readonly onCleanup: typeof onCleanup;
+        readonly $PROXY: typeof $PROXY;
+        readonly untrack: typeof untrack;
+        readonly STORE_DEV: NonNullable<typeof DEV$1>;
+        readonly unwrap: typeof unwrap;
+        readonly getDevEvents: () => StoredDevEvent[];
+        readonly locatorOptions: LocatorOptions | null;
+        readonly versions: {
+            readonly client: string | null;
+            readonly solid: string | null;
+            readonly expectedSolid: string | null;
+        };
+        readonly getOwnerLocation: (owner: Solid.Owner) => string | null;
+    } | undefined;
+}
+type NodeID = `#${string}`;
+type ValueItemID = `${ValueItemType.Signal}:${NodeID}` | `${ValueItemType.Prop}:${string}` | ValueItemType.Value;
+declare const getValueItemId: <T extends ValueItemType>(type: T, id: T extends ValueItemType.Value ? undefined : string) => ValueItemID;
+type ValueUpdateListener = (newValue: unknown, oldValue: unknown) => void;
+declare namespace Solid {
+    type OwnerBase = solid_js_types_reactive_signal.Owner;
+    type SourceMapValue = solid_js_types_reactive_signal.SourceMapValue;
+    type Signal = solid_js_types_reactive_signal.SignalState<unknown>;
+    type Computation = solid_js_types_reactive_signal.Computation<unknown>;
+    type Memo = solid_js_types_reactive_signal.Memo<unknown>;
+    type RootFunction<T> = solid_js_types_reactive_signal.RootFunction<T>;
+    type EffectFunction = solid_js_types_reactive_signal.EffectFunction<unknown>;
+    type Component = solid_js_types_reactive_signal.DevComponent<{
+        [key: string]: unknown;
+    }>;
+    type CatchError = Omit<Computation, 'fn'> & {
+        fn: undefined;
+    };
+    type Root = OwnerBase & {
+        attachedTo?: Owner;
+        isDisposed?: true;
+        isInternal?: true;
+        context: null;
+        fn?: never;
+        state?: never;
+        updatedAt?: never;
+        sources?: never;
+        sourceSlots?: never;
+        value?: never;
+        pure?: never;
+    };
+    type Owner = Root | Computation | CatchError;
+    type StoreNode = solid_js_store.StoreNode;
+    type NotWrappable = solid_js_store_types_store.NotWrappable;
+    type OnStoreNodeUpdate = solid_js_store_types_store.OnStoreNodeUpdate;
+    type Store = SourceMapValue & {
+        value: StoreNode;
+    };
+}
+declare module 'solid-js/types/reactive/signal' {
+    interface Owner {
+        sdtType?: NodeType;
+        sdtSubRoots?: Solid.Owner[] | null;
+    }
+}
+type OnStoreNodeUpdate = Solid.OnStoreNodeUpdate & {
+    storePath: readonly (string | number)[];
+    storeSymbol: symbol;
+};
+declare namespace Mapped {
+    interface Owner {
+        id: NodeID;
+        type: Exclude<NodeType, NodeType.Refresh | NodeType.Signal | NodeType.Store>;
+        children: Owner[];
+        name?: string;
+        hmr?: true;
+        frozen?: true;
+    }
+    interface Signal {
+        type: NodeType.Signal | NodeType.Memo | NodeType.Store;
+        name?: string;
+        id: NodeID;
+        value: EncodedValue[];
+    }
+    type Props = {
+        proxy: boolean;
+        record: {
+            [key: string]: {
+                getter: false | PropGetterState;
+                value: EncodedValue[] | null;
+            };
+        };
+    };
+    interface OwnerDetails {
+        id: NodeID;
+        name?: string;
+        type: NodeType;
+        props?: Props;
+        signals: Signal[];
+        /** for computations */
+        value?: EncodedValue[];
+        location?: SourceLocation;
+    }
+}
+
+type LocationAttr = `${string}:${number}:${number}`;
+type LocatorComponent = {
+    id: NodeID;
+    name: string | undefined;
+    element: HTMLElement;
+    location?: LocationAttr | undefined;
+};
+type TargetIDE = 'vscode' | 'webstorm' | 'atom' | 'vscode-insiders';
+type SourceLocation = {
+    file: string;
+    line: number;
+    column: number;
+};
+type SourceCodeData = SourceLocation & {
+    projectPath: string;
+    element: HTMLElement | string | undefined;
+};
+type TargetURLFunction = (data: SourceCodeData) => string | void;
+
+type LocatorOptions = {
+    /** Choose in which IDE the component source code should be revealed. */
+    targetIDE?: false | TargetIDE | TargetURLFunction;
+    /**
+     * Holding which key should enable the locator overlay?
+     * @default 'Alt'
+     */
+    key?: false | KbdKey;
+};
+type HighlightElementPayload = ToDyscriminatedUnion<{
+    node: {
+        id: NodeID;
+    };
+    element: {
+        id: NodeID;
+    };
+}> | null;
+declare const WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
+declare const LOCATION_ATTRIBUTE_NAME = "data-source-loc";
+
+declare namespace Debugger {
+    type InspectedState = {
+        readonly ownerId: NodeID | null;
+        readonly signalId: NodeID | null;
+        /** closest note to inspected signal/owner on the owner structure */
+        readonly treeWalkerOwnerId: NodeID | null;
+    };
+    type OutputChannels = {
+        DebuggerEnabled: boolean;
+        ResetPanel: void;
+        InspectedState: InspectedState;
+        InspectedNodeDetails: Mapped.OwnerDetails;
+        StructureUpdates: StructureUpdates;
+        NodeUpdates: NodeID[];
+        InspectorUpdate: InspectorUpdate[];
+        LocatorModeChange: boolean;
+        HoveredComponent: {
+            nodeId: NodeID;
+            state: boolean;
+        };
+        InspectedComponent: NodeID;
+        DgraphUpdate: DGraphUpdate;
+    };
+    type InputChannels = {
+        ResetState: void;
+        InspectNode: {
+            ownerId: NodeID | null;
+            signalId: NodeID | null;
+        } | null;
+        InspectValue: ToggleInspectedValueData;
+        HighlightElementChange: HighlightElementPayload;
+        OpenLocation: void;
+        TreeViewModeChange: TreeWalkerMode;
+        ViewChange: DevtoolsMainView;
+        ToggleModule: {
+            module: DebuggerModule;
+            enabled: boolean;
+        };
+    };
+}
+declare const useDebugger: () => {
+    meta: {
+        versions: {
+            readonly client: string | null;
+            readonly solid: string | null;
+            readonly expectedSolid: string | null;
+        };
+    };
+    enabled: solid_js.Accessor<boolean>;
+    toggleEnabled: (enabled: boolean) => undefined;
+    on: _solid_primitives_event_bus.EmitterOn<Debugger.OutputChannels>;
+    listen: _solid_primitives_event_bus.EmitterListen<Debugger.OutputChannels>;
+    emit: <K extends keyof Debugger.InputChannels>(event: K, ..._: void extends Debugger.InputChannels[K] ? [payload?: Debugger.InputChannels[K] | undefined] : [payload: Debugger.InputChannels[K]]) => void;
+};
+declare const useLocator: (options: LocatorOptions) => void;
+
+export { DevEventDataMap as A, StoredDevEvent as B, NodeID as C, DGraphUpdate as D, EncodedValueMap as E, ValueItemID as F, getValueItemId as G, HighlightElementPayload as H, INFINITY as I, LocatorOptions as L, Mapped as M, NodeType as N, OnStoreNodeUpdate as O, PropGetterState as P, Solid as S, ToggleInspectedValueData as T, UNDEFINED as U, ValueUpdateListener as V, WINDOW_PROJECTPATH_PROPERTY as W, useLocator as a, SerializedDGraph as b, Debugger as c, StructureUpdates as d, NEGATIVE_INFINITY as e, NAN as f, ValueType as g, EncodedValue as h, InspectorUpdateMap as i, InspectorUpdate as j, LOCATION_ATTRIBUTE_NAME as k, LocationAttr as l, LocatorComponent as m, SourceLocation as n, TargetIDE as o, TargetURLFunction as p, DevtoolsMainView as q, DEFAULT_MAIN_VIEW as r, DebuggerModule as s, TreeWalkerMode as t, useDebugger as u, DEFAULT_WALKER_MODE as v, NODE_TYPE_NAMES as w, ValueItemType as x, UNKNOWN as y, DevEventType as z };

dist/setup.d.ts

+import { KbdKey } from '@solid-primitives/keyboard';
+import * as solid_js_store_types_store from 'solid-js/store/types/store';
+import * as StoreAPI from 'solid-js/store';
+import { DEV as DEV$1, unwrap } from 'solid-js/store';
+import * as solid_js_types_reactive_signal from 'solid-js/types/reactive/signal';
+import * as solid_js from 'solid-js';
+import { DEV, getOwner, getListener, onCleanup, $PROXY, untrack } from 'solid-js';
+import * as WebAPI from 'solid-js/web';
+
+declare enum NodeType {
+    Root = "root",
+    Component = "component",
+    Element = "element",
+    Effect = "effect",
+    Render = "render",
+    Memo = "memo",
+    Computation = "computation",
+    Refresh = "refresh",
+    Context = "context",
+    CatchError = "catchError",
+    Signal = "signal",
+    Store = "store"
+}
+
+declare const enum DevEventType {
+    RootCreated = "RootCreated"
+}
+type DevEventDataMap = {
+    [DevEventType.RootCreated]: Solid.Owner;
+};
+type StoredDevEvent = {
+    [K in keyof DevEventDataMap]: {
+        timestamp: number;
+        type: K;
+        data: DevEventDataMap[K];
+    };
+}[keyof DevEventDataMap];
+declare global {
+    /** Solid DEV APIs exposed to the debugger by the setup script */
+    var SolidDevtools$$: {
+        readonly Solid: typeof solid_js;
+        readonly Store: typeof StoreAPI;
+        readonly Web: typeof WebAPI;
+        readonly DEV: NonNullable<typeof DEV>;
+        readonly getOwner: typeof getOwner;
+        readonly getListener: typeof getListener;
+        readonly onCleanup: typeof onCleanup;
+        readonly $PROXY: typeof $PROXY;
+        readonly untrack: typeof untrack;
+        readonly STORE_DEV: NonNullable<typeof DEV$1>;
+        readonly unwrap: typeof unwrap;
+        readonly getDevEvents: () => StoredDevEvent[];
+        readonly locatorOptions: LocatorOptions | null;
+        readonly versions: {
+            readonly client: string | null;
+            readonly solid: string | null;
+            readonly expectedSolid: string | null;
+        };
+        readonly getOwnerLocation: (owner: Solid.Owner) => string | null;
+    } | undefined;
+}
+declare namespace Solid {
+    type OwnerBase = solid_js_types_reactive_signal.Owner;
+    type SourceMapValue = solid_js_types_reactive_signal.SourceMapValue;
+    type Signal = solid_js_types_reactive_signal.SignalState<unknown>;
+    type Computation = solid_js_types_reactive_signal.Computation<unknown>;
+    type Memo = solid_js_types_reactive_signal.Memo<unknown>;
+    type RootFunction<T> = solid_js_types_reactive_signal.RootFunction<T>;
+    type EffectFunction = solid_js_types_reactive_signal.EffectFunction<unknown>;
+    type Component = solid_js_types_reactive_signal.DevComponent<{
+        [key: string]: unknown;
+    }>;
+    type CatchError = Omit<Computation, 'fn'> & {
+        fn: undefined;
+    };
+    type Root = OwnerBase & {
+        attachedTo?: Owner;
+        isDisposed?: true;
+        isInternal?: true;
+        context: null;
+        fn?: never;
+        state?: never;
+        updatedAt?: never;
+        sources?: never;
+        sourceSlots?: never;
+        value?: never;
+        pure?: never;
+    };
+    type Owner = Root | Computation | CatchError;
+    type StoreNode = StoreAPI.StoreNode;
+    type NotWrappable = solid_js_store_types_store.NotWrappable;
+    type OnStoreNodeUpdate = solid_js_store_types_store.OnStoreNodeUpdate;
+    type Store = SourceMapValue & {
+        value: StoreNode;
+    };
+}
+declare module 'solid-js/types/reactive/signal' {
+    interface Owner {
+        sdtType?: NodeType;
+        sdtSubRoots?: Solid.Owner[] | null;
+    }
+}
+
+type TargetIDE = 'vscode' | 'webstorm' | 'atom' | 'vscode-insiders';
+type SourceLocation = {
+    file: string;
+    line: number;
+    column: number;
+};
+type SourceCodeData = SourceLocation & {
+    projectPath: string;
+    element: HTMLElement | string | undefined;
+};
+type TargetURLFunction = (data: SourceCodeData) => string | void;
+
+type LocatorOptions = {
+    /** Choose in which IDE the component source code should be revealed. */
+    targetIDE?: false | TargetIDE | TargetURLFunction;
+    /**
+     * Holding which key should enable the locator overlay?
+     * @default 'Alt'
+     */
+    key?: false | KbdKey;
+};
+
+/**
+ * Set the location of the owner in source code.
+ * Used by the babel plugin.
+ */
+declare function setOwnerLocation(location: string): void;
+declare function getOwnerLocation(owner: Solid.Owner): string | null;
+declare function useLocator(options: LocatorOptions): void;
+declare function setClientVersion(version: string): void;
+declare function setSolidVersion(version: string, expected: string): void;
+
+export { getOwnerLocation, setClientVersion, setOwnerLocation, setSolidVersion, useLocator };

dist/setup.js

+import { error } from '@solid-devtools/shared/utils';
+import * as SolidAPI from 'solid-js';
+import { DEV, getOwner, getListener, onCleanup, $PROXY, untrack } from 'solid-js';
+import * as StoreAPI from 'solid-js/store';
+import { DEV as DEV$1, unwrap } from 'solid-js/store';
+import * as WebAPI from 'solid-js/web';
+
+// src/setup.ts
+var OwnerLocationMap = /* @__PURE__ */ new WeakMap();
+function setOwnerLocation(location) {
+  const owner = getOwner();
+  owner && OwnerLocationMap.set(owner, location);
+}
+function getOwnerLocation(owner) {
+  return OwnerLocationMap.get(owner) ?? null;
+}
+var PassedLocatorOptions = null;
+function useLocator(options) {
+  PassedLocatorOptions = options;
+}
+var ClientVersion = null;
+var SolidVersion = null;
+var ExpectedSolidVersion = null;
+function setClientVersion(version) {
+  ClientVersion = version;
+}
+function setSolidVersion(version, expected) {
+  SolidVersion = version;
+  ExpectedSolidVersion = expected;
+}
+var DevEvents = [];
+if (window.SolidDevtools$$) {
+  error("Debugger is already setup");
+}
+if (!DEV || !DEV$1) {
+  error("SolidJS in not in development mode!");
+} else {
+  window.SolidDevtools$$ = {
+    Solid: SolidAPI,
+    Store: StoreAPI,
+    Web: WebAPI,
+    DEV,
+    getOwner,
+    getListener,
+    onCleanup,
+    $PROXY,
+    untrack,
+    STORE_DEV: DEV$1,
+    unwrap,
+    getDevEvents() {
+      const events = DevEvents ?? [];
+      DevEvents = null;
+      return events;
+    },
+    get locatorOptions() {
+      return PassedLocatorOptions;
+    },
+    versions: {
+      get client() {
+        return ClientVersion;
+      },
+      get solid() {
+        return SolidVersion;
+      },
+      get expectedSolid() {
+        return ExpectedSolidVersion;
+      }
+    },
+    getOwnerLocation
+  };
+  DEV.hooks.afterCreateOwner = function(owner) {
+    if (!DevEvents)
+      return;
+    DevEvents.push({
+      timestamp: Date.now(),
+      type: "RootCreated" /* RootCreated */,
+      data: owner
+    });
+  };
+}
+
+export { getOwnerLocation, setClientVersion, setOwnerLocation, setSolidVersion, useLocator };

dist/index.d.ts

@@ -1,4 +0,7 @@
-import { createRoot, ParentComponent } from 'solid-js';
-import { L as LocationAttr, C as Core, S as Solid, V as ValueUpdateListener, N as NodeType } from './index-7aa0ad20.js';
-export { q as DEFAULT_MAIN_VIEW, t as DEFAULT_WALKER_MODE, D as DGraphUpdate, r as DebuggerModule, p as DevtoolsMainView, g as EncodedValue, E as EncodedValueMap, H as HighlightElementPayload, I as INFINITY, i as InspectorUpdate, h as InspectorUpdateMap, k as LOCATION_ATTRIBUTE_NAME, m as LocatorComponent, j as LocatorOptions, M as MARK_COMPONENT, A as Mapped, e as NAN, d as NEGATIVE_INFINITY, v as NODE_TYPE_NAMES, x as NodeID, P as PropGetterState, b as SerializedDGraph, c as StructureUpdates, n as TargetIDE, o as TargetURLFunction, T as ToggleInspectedValueData, s as TreeWalkerMode, U as UNDEFINED, l as USE_LOCATOR, y as ValueItemID, w as ValueItemType, f as ValueType, W as WINDOW_PROJECTPATH_PROPERTY, z as getValueItemId, u as useDebugger, a as useLocator } from './index-7aa0ad20.js';
+import { S as Solid, V as ValueUpdateListener, N as NodeType } from './index-7bfdbbff.js';
+export { u as useDebugger, a as useLocator } from './index-7bfdbbff.js';
+import * as solid_js from 'solid-js';
+import { createRoot } from 'solid-js';
+import * as solid_js_types_reactive_signal from 'solid-js/types/reactive/signal';
+import '@solid-primitives/event-bus';
 import '@solid-devtools/shared/utils';
@@ -8,35 +11,5 @@ import '@solid-primitives/keyboard';
 import 'solid-js/store';
-import 'solid-js/types/reactive/signal';
-import '@solid-primitives/event-bus';
+import 'solid-js/web';
 
-declare function markComponentLoc(location: LocationAttr): void;
-
 /**
- * Helps the debugger find and reattach an reactive owner created by `createRoot` to it's detached parent.
- *
- * Call this synchronously inside `createRoot` callback body, whenever you are using `createRoot` yourself to dispose of computations early, or inside `<For>`/`<Index>` components to reattach their children to reactive graph visible by the devtools debugger.
- * @example
- * createRoot(dispose => {
- * 	// This reactive Owner disapears form the owner tree
- *
- * 	// Reattach the Owner to the tree:
- * 	attachDebugger();
- * });
- */
-declare function attachDebugger(_owner?: Core.Owner): void;
-/**
- * Unobserves currently observed root owners.
- * This is not reversable, and should be used only when you are sure that they won't be used anymore.
- */
-declare function unobserveAllRoots(): void;
-/**
- * Listens to `createRoot` calls and attaches debugger to them.
- */
-declare function enableRootsAutoattach(): void;
-/**
- * Sold's `createRoot` primitive that won't be tracked by the debugger.
- */
-declare const createInternalRoot: typeof createRoot;
-
-/**
  * Runs the callback on every Solid Graph Update – whenever computations update because of a signal change.
@@ -47,3 +20,3 @@ * The listener is automatically cleaned-up on root dispose.
  */
-declare function makeSolidUpdateListener(onUpdate: VoidFunction): VoidFunction;
+declare function addSolidUpdateListener(onUpdate: VoidFunction): VoidFunction;
 /**
@@ -69,15 +42,40 @@ * Patches the "fn" prop of SolidComputation. Will execute the {@link onRun} callback whenever the computation is executed.
  */
-declare function observeValueUpdate(node: Solid.SignalState, onUpdate: ValueUpdateListener, symbol: symbol): void;
-declare function removeValueUpdateObserver(node: Solid.SignalState, symbol: symbol): void;
-declare function makeValueUpdateListener(node: Solid.SignalState, onUpdate: ValueUpdateListener, symbol: symbol): void;
+declare function observeValueUpdate(node: Solid.SourceMapValue | Solid.Computation, onUpdate: ValueUpdateListener, symbol: symbol): void;
+declare function removeValueUpdateObserver(node: Solid.SourceMapValue | Solid.Computation, symbol: symbol): void;
+declare function makeValueUpdateListener(node: Solid.SourceMapValue | Solid.Computation, onUpdate: ValueUpdateListener, symbol: symbol): void;
 
-declare const getOwner: () => Solid.Owner | null;
-declare const isSolidComputation: (o: Readonly<Solid.Owner>) => o is Solid.Computation;
-declare const isSolidMemo: (o: Readonly<Solid.Owner>) => o is Solid.Memo;
+/**
+ * Helps the debugger find and reattach an reactive owner created by `createRoot` to it's detached parent.
+ *
+ * Call this synchronously inside `createRoot` callback body, whenever you are using `createRoot` yourself to dispose of computations early, or inside `<For>`/`<Index>` components to reattach their children to reactive graph visible by the devtools debugger.
+ * @example
+ * createRoot(dispose => {
+ * 	// This reactive Owner disapears form the owner tree
+ *
+ * 	// Reattach the Owner to the tree:
+ * 	attachDebugger();
+ * });
+ */
+declare function attachDebugger(owner?: solid_js.Owner | null): void;
+/**
+ * Unobserves currently observed root owners.
+ * This is not reversable, and should be used only when you are sure that they won't be used anymore.
+ */
+declare function unobserveAllRoots(): void;
+/**
+ * Sold's `createRoot` primitive that won't be tracked by the debugger.
+ */
+declare const createInternalRoot: typeof createRoot;
+
 declare const isSolidOwner: (o: Readonly<Solid.Owner | Solid.Store | Solid.Signal>) => o is Solid.Owner;
+declare const isSolidComputation: (o: Readonly<Solid.Owner>) => o is solid_js_types_reactive_signal.Computation<unknown, unknown>;
 declare const isSolidRoot: (o: Readonly<Solid.Owner>) => o is Solid.Root;
-declare const isSolidStore: (o: Readonly<Solid.Signal | Solid.Store>) => o is Solid.Store;
-declare function getNodeName(o: Readonly<Solid.Signal | Solid.Owner | Solid.Store>): string;
+declare const isSolidMemo: (o: Readonly<Solid.Owner>) => o is solid_js_types_reactive_signal.Memo<unknown, unknown>;
+declare const isSolidStore: (o: Solid.Owner | Solid.SourceMapValue | Solid.Store) => o is Solid.Store;
+declare const isSolidSignal: (o: Solid.SourceMapValue) => o is solid_js_types_reactive_signal.SignalState<unknown>;
 declare function getNodeType(o: Readonly<Solid.Signal | Solid.Owner | Solid.Store>): NodeType;
 declare const getOwnerType: (o: Readonly<Solid.Owner>) => NodeType;
+declare const getNodeName: (o: {
+    name?: string;
+}) => string | undefined;
 declare function lookupOwner(owner: Solid.Owner, predicate: (owner: Solid.Owner) => boolean): Solid.Owner | null;
@@ -96,6 +94,3 @@ /**
 declare function onParentCleanup(owner: Solid.Owner, fn: VoidFunction, prepend?: boolean, symbol?: symbol): VoidFunction;
-declare function getFunctionSources(fn: () => unknown): Solid.Signal[];
 
-declare const Debugger: ParentComponent;
-
-export { Core, Debugger, LocationAttr, NodeType, Solid, ValueUpdateListener, attachDebugger, createInternalRoot, enableRootsAutoattach, getFunctionSources, getNodeName, getNodeType, getOwner, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidStore, lookupOwner, makeSolidUpdateListener, makeValueUpdateListener, markComponentLoc, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots };
+export { addSolidUpdateListener, attachDebugger, createInternalRoot, getNodeName, getNodeType, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidSignal, isSolidStore, lookupOwner, makeValueUpdateListener, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots };

dist/index.js

@@ -1,11 +0,11 @@
-import { DEFAULT_WALKER_MODE, LOCATION_ATTRIBUTE_NAME, WINDOW_PROJECTPATH_PROPERTY, UNDEFINED, INFINITY, NEGATIVE_INFINITY, NAN } from './chunk-4JABOMAE.js';
-export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, MARK_COMPONENT, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, USE_LOCATOR, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId } from './chunk-4JABOMAE.js';
+import { DEFAULT_WALKER_MODE, LOCATION_ATTRIBUTE_NAME, WINDOW_PROJECTPATH_PROPERTY, UNDEFINED, INFINITY, NEGATIVE_INFINITY, NAN } from './chunks/chunk-S74N7CWV.js';
+import { createGlobalEmitter, createEventBus } from '@solid-primitives/event-bus';
+import { createStaticStore } from '@solid-primitives/static-store';
+import { chain, tryOnCleanup, defer } from '@solid-primitives/utils';
+import { $PROXY, createRoot, getOwner, createMemo, createEffect, createSignal, createComputed, batch, onCleanup, Index, Show, runWithOwner } from 'solid-js';
+import { throttle, scheduleIdle } from '@solid-primitives/scheduled';
 import { trimString, warn, isRecord } from '@solid-devtools/shared/utils';
-import { untrack, getOwner as getOwner$1, runWithOwner, createRoot, createComputed, createMemo, createEffect, createSignal, onCleanup, batch, Index, Show, $PROXY, getListener } from 'solid-js';
-import { throttle, scheduleIdle } from '@solid-primitives/scheduled';
-import { DEV as DEV$1, unwrap } from 'solid-js/store';
 import { makeHoverElementListener, untrackedCallback } from '@solid-devtools/shared/primitives';
 import { makeEventListener } from '@solid-primitives/event-listener';
 import { createKeyHold } from '@solid-primitives/keyboard';
-import { createStaticStore, defer } from '@solid-primitives/utils';
 import { createComponent, Portal, mergeProps, insert, effect, className, template } from 'solid-js/web';
@@ -15,33 +15,55 @@ import { createElementBounds } from '@solid-primitives/bounds';
 import { isWindows } from '@solid-primitives/platform';
-import { createGlobalEmitter, createEventBus } from '@solid-primitives/event-bus';
 
-var STORE_DEV = DEV$1;
-var getOwner = getOwner$1;
-var isSolidComputation = (o) => "fn" in o;
-var isSolidMemo = (o) => "sdtType" in o ? o.sdtType === "memo" /* Memo */ : isSolidComputation(o) && _isMemo(o);
-var isSolidOwner = (o) => "owned" in o;
-var isSolidRoot = (o) => o.sdtType === "root" /* Root */ || !isSolidComputation(o);
-var isSolidComponent = (o) => "props" in o;
-var isStoreNode = (o) => STORE_DEV.$NAME in o;
-var isSolidStore = (o) => {
-  return !("observers" in o) && STORE_DEV.$NAME in o.value;
+// src/main/get-id.ts
+var LastId = 0;
+var getNewSdtId = () => `#${(LastId++).toString(36)}`;
+
+// src/main/id.ts
+var WeakIdMap = /* @__PURE__ */ new WeakMap();
+var RefMapMap = {
+  ["owner" /* Owner */]: /* @__PURE__ */ new Map(),
+  ["element" /* Element */]: /* @__PURE__ */ new Map(),
+  ["signal" /* Signal */]: /* @__PURE__ */ new Map(),
+  ["store" /* Store */]: /* @__PURE__ */ new Map(),
+  ["store-node" /* StoreNode */]: /* @__PURE__ */ new Map()
 };
-var _isMemo = (o) => "value" in o && "comparator" in o && o.pure === true;
-function getOwnerName(owner) {
-  const { name, componentName: component } = owner;
-  if (component && typeof component === "string")
-    return component.startsWith("_Hot$$") ? component.slice(6) : component;
-  return name || "(unnamed)";
+var CleanupRegistry = new FinalizationRegistry((data) => {
+  RefMapMap[data.map].delete(data.id);
+});
+function getSdtId(obj, objType) {
+  let id = WeakIdMap.get(obj);
+  if (!id) {
+    id = getNewSdtId();
+    WeakIdMap.set(obj, id);
+    RefMapMap[objType].set(id, new WeakRef(obj));
+    CleanupRegistry.register(obj, { map: objType, id });
+  }
+  return id;
 }
-function getSignalName(signal) {
-  return signal.name || "(unnamed)";
+function getObjectById(id, objType) {
+  const ref = RefMapMap[objType].get(id);
+  return ref?.deref() ?? null;
 }
-var getStoreNodeName = (node) => node[STORE_DEV.$NAME] || "(unnamed)";
-function getNodeName(o) {
-  const name = isSolidOwner(o) ? getOwnerName(o) : isSolidStore(o) ? getStoreNodeName(o) : getSignalName(o);
-  return getDisplayName(name);
+
+// src/main/solid-api.ts
+if (!globalThis.SolidDevtools$$) {
+  throw new Error(
+    `[solid-devtools]: Debugger hasn't found the exposed Solid Devtools API. Did you import the setup script?`
+  );
 }
-function getDisplayName(name) {
-  return trimString(name, 20);
-}
+var SolidApi = globalThis.SolidDevtools$$;
+var solid_api_default = SolidApi;
+
+// src/main/utils.ts
+var $NODE = solid_api_default.STORE_DEV.$NODE;
+var isObject = (o) => typeof o === "object" && !!o;
+var isSolidOwner = (o) => "owned" in o;
+var isSolidComputation = (o) => !!o.fn;
+var isObservableComputation = (o) => !!o.fn && o.context === null;
+var isSolidRoot = (o) => !("fn" in o);
+var isSolidMemo = (o) => "fn" in o && "comparator" in o;
+var isSolidComponent = (o) => "component" in o;
+var isStoreNode = (o) => $NODE in o;
+var isSolidStore = (o) => !("observers" in o) && "value" in o && isObject(o.value) && $PROXY in o.value;
+var isSolidSignal = (o) => "value" in o && "observers" in o && "observerSlots" in o && "comparator" in o;
 function getNodeType(o) {
@@ -52,13 +74,17 @@ if (isSolidOwner(o))
 }
+var SOLID_REFRESH_PREFIX = "[solid-refresh]";
 var getOwnerType = (o) => {
   if (typeof o.sdtType !== "undefined")
     return o.sdtType;
-  if (!isSolidComputation(o))
+  if (!isSolidComputation(o)) {
+    if ("sources" in o)
+      return "catchError" /* CatchError */;
     return "root" /* Root */;
+  }
   if (isSolidComponent(o))
     return "component" /* Component */;
-  if (_isMemo(o)) {
-    let parent, parentName;
-    if ((parent = o.owner) && isSolidComponent(parent) && (parentName = parent.componentName) && parentName.startsWith("_Hot$$"))
+  if ("comparator" in o) {
+    if (o.owner?.component?.name.startsWith(SOLID_REFRESH_PREFIX)) {
       return "refresh" /* Refresh */;
+    }
     return "memo" /* Memo */;
@@ -75,7 +101,10 @@ }
 };
-function markOwnerName(o) {
-  if (o.sdtName !== void 0)
-    return o.sdtName;
-  return o.sdtName = getNodeName(o);
-}
+var getNodeName = (o) => {
+  if (!o.name)
+    return;
+  let name = o.name;
+  if (name.startsWith(SOLID_REFRESH_PREFIX))
+    name = name.slice(SOLID_REFRESH_PREFIX.length);
+  return trimString(name, 20);
+};
 function markOwnerType(o) {
@@ -87,3 +116,3 @@ if (o.sdtType !== void 0)
 function isDisposed(o) {
-  return !!(isSolidRoot(o) ? o.isDisposed : o.owner && (!o.owner.owned || !o.owner.owned.includes(o)));
+  return !!(isSolidComputation(o) ? o.owner && (!o.owner.owned || !o.owner.owned.includes(o)) : o.isDisposed);
 }
@@ -126,3 +155,2 @@ function getComponentRefreshNode(owner) {
 }
-var tryOnCleanup = (fn) => getOwner() ? onCleanup(fn) : fn;
 function onOwnerCleanup(owner, fn, prepend = false, symbol) {
@@ -159,22 +187,2 @@ if (owner.cleanups === null)
 }
-function getFunctionSources(fn) {
-  let nodes;
-  let init = true;
-  runWithOwner(
-    null,
-    () => createRoot(
-      (dispose) => createComputed(() => {
-        if (!init)
-          return;
-        init = false;
-        fn();
-        const sources = getOwner().sources;
-        if (sources)
-          nodes = [...sources];
-        dispose();
-      })
-    )
-  );
-  return nodes ?? [];
-}
 function createBatchedUpdateEmitter(emit) {
@@ -192,3 +200,3 @@ const updates = /* @__PURE__ */ new Set();
 
-// src/main/componentRegistry.ts
+// src/main/component-registry.ts
 var $CLEANUP = Symbol("component-registry-cleanup");
@@ -277,33 +285,2 @@ var ComponentMap = /* @__PURE__ */ new Map();
 
-// src/main/getId.ts
-var LastId = 0;
-var getNewSdtId = () => `#${(LastId++).toString(36)}`;
-
-// src/main/id.ts
-var WeakIdMap = /* @__PURE__ */ new WeakMap();
-var RefMapMap = {
-  ["owner" /* Owner */]: /* @__PURE__ */ new Map(),
-  ["element" /* Element */]: /* @__PURE__ */ new Map(),
-  ["signal" /* Signal */]: /* @__PURE__ */ new Map(),
-  ["store" /* Store */]: /* @__PURE__ */ new Map(),
-  ["store-node" /* StoreNode */]: /* @__PURE__ */ new Map()
-};
-var CleanupRegistry = new FinalizationRegistry((data) => {
-  RefMapMap[data.map].delete(data.id);
-});
-function getSdtId(obj, objType) {
-  let id = WeakIdMap.get(obj);
-  if (!id) {
-    id = getNewSdtId();
-    WeakIdMap.set(obj, id);
-    RefMapMap[objType].set(id, new WeakRef(obj));
-    CleanupRegistry.register(obj, { map: objType, id });
-  }
-  return id;
-}
-function getObjectById(id, objType) {
-  const ref = RefMapMap[objType].get(id);
-  return ref?.deref() ?? null;
-}
-
 // src/main/roots.ts
@@ -335,10 +312,10 @@ var RootMap = /* @__PURE__ */ new Map();
   let topRoot;
-  if (root.sdtAttached) {
-    root.sdtAttached.sdtSubRoots.splice(root.sdtAttached.sdtSubRoots.indexOf(root), 1);
-    topRoot = getTopRoot(root.sdtAttached);
+  if (root.attachedTo) {
+    root.attachedTo.sdtSubRoots.splice(root.attachedTo.sdtSubRoots.indexOf(root), 1);
+    topRoot = getTopRoot(root.attachedTo);
     if (topRoot)
-      OnOwnerNeedsUpdate?.(root.sdtAttached, getSdtId(topRoot, "owner" /* Owner */));
+      OnOwnerNeedsUpdate?.(root.attachedTo, getSdtId(topRoot, "owner" /* Owner */));
   }
   if (newParent) {
-    root.sdtAttached = newParent;
+    root.attachedTo = newParent;
     if (newParent.sdtSubRoots)
@@ -353,7 +330,9 @@ newParent.sdtSubRoots.push(root);
   } else {
-    delete root.sdtAttached;
+    delete root.attachedTo;
   }
 }
-function attachDebugger(_owner = getOwner()) {
-  let owner = _owner;
+var InternalRootCount = 0;
+function attachDebugger(owner = solid_api_default.getOwner()) {
+  if (InternalRootCount)
+    return;
   if (!owner)
@@ -407,22 +386,2 @@ return warn("reatachOwner helper should be called synchronously in a reactive owner.");
 }
-var AutoattachEnabled = false;
-var InternalRootCount = 0;
-function enableRootsAutoattach() {
-  if (AutoattachEnabled)
-    return;
-  AutoattachEnabled = true;
-  const autoattach = (root) => {
-    if (InternalRootCount)
-      return;
-    attachDebugger(root);
-  };
-  if (typeof window._$afterCreateRoot === "function") {
-    const old = window._$afterCreateRoot;
-    window._$afterCreateRoot = (root) => {
-      old(root);
-      autoattach(root);
-    };
-  } else
-    window._$afterCreateRoot = autoattach;
-}
 var createInternalRoot = (fn, detachedOwner) => {
@@ -463,2 +422,220 @@ InternalRootCount++;
 }
+
+// src/main/observe.ts
+for (const e of solid_api_default.getDevEvents()) {
+  switch (e.type) {
+    case "RootCreated" /* RootCreated */:
+      attachDebugger(e.data);
+      break;
+  }
+}
+solid_api_default.DEV.hooks.afterCreateOwner = function(owner) {
+  if (isSolidRoot(owner)) {
+    attachDebugger(owner);
+  }
+};
+var GraphUpdateListeners = /* @__PURE__ */ new Set();
+solid_api_default.DEV.hooks.afterUpdate = chain(GraphUpdateListeners);
+function addSolidUpdateListener(onUpdate) {
+  GraphUpdateListeners.add(onUpdate);
+  return () => GraphUpdateListeners.delete(onUpdate);
+}
+function interceptComputationRerun(owner, onRun) {
+  const _fn = owner.fn;
+  let v;
+  let prev;
+  const fn = () => v = _fn(prev);
+  owner.fn = !!owner.fn.length ? (p) => {
+    onRun(fn, prev = p);
+    return v;
+  } : () => {
+    onRun(fn, void 0);
+    return v;
+  };
+}
+var ComputationUpdateListeners = /* @__PURE__ */ new WeakMap();
+function observeComputationUpdate(owner, onRun, symbol = Symbol()) {
+  let map = ComputationUpdateListeners.get(owner);
+  if (!map)
+    ComputationUpdateListeners.set(owner, map = {});
+  map[symbol] = onRun;
+  interceptComputationRerun(owner, (fn) => {
+    fn();
+    for (const sym of Object.getOwnPropertySymbols(map))
+      map[sym]();
+  });
+}
+function removeComputationUpdateObserver(owner, symbol) {
+  const map = ComputationUpdateListeners.get(owner);
+  if (map)
+    delete map[symbol];
+}
+var SignalUpdateListeners = /* @__PURE__ */ new WeakMap();
+function observeValueUpdate(node, onUpdate, symbol) {
+  let map = SignalUpdateListeners.get(node);
+  if (!map) {
+    SignalUpdateListeners.set(node, map = /* @__PURE__ */ new Map());
+    let value = node.value;
+    Object.defineProperty(node, "value", {
+      get: () => value,
+      set: (newValue) => {
+        for (const fn of map.values())
+          fn(newValue, value);
+        value = newValue;
+      }
+    });
+  }
+  map.set(symbol, onUpdate);
+}
+function removeValueUpdateObserver(node, symbol) {
+  SignalUpdateListeners.get(node)?.delete(symbol);
+}
+function makeValueUpdateListener(node, onUpdate, symbol) {
+  observeValueUpdate(node, onUpdate, symbol);
+  tryOnCleanup(() => removeValueUpdateObserver(node, symbol));
+}
+
+// src/dependency/collect.ts
+var $DGRAPH = Symbol("dependency-graph");
+var Graph;
+var VisitedSources;
+var VisitedObservers;
+var DepthMap;
+var OnNodeUpdate;
+function observeNodeUpdate(node, handler) {
+  if (isSolidOwner(node))
+    observeComputationUpdate(node, handler, $DGRAPH);
+  else
+    observeValueUpdate(node, handler, $DGRAPH);
+}
+function unobserveNodeUpdate(node) {
+  if (isSolidOwner(node))
+    removeComputationUpdateObserver(node, $DGRAPH);
+  else
+    removeValueUpdateObserver(node, $DGRAPH);
+}
+function addNodeToGraph(node) {
+  const isOwner = isSolidOwner(node);
+  const id = getSdtId(node, isOwner ? "owner" /* Owner */ : "signal" /* Signal */);
+  if (Graph[id])
+    return;
+  const onNodeUpdate = OnNodeUpdate;
+  observeNodeUpdate(node, () => onNodeUpdate(id));
+  Graph[id] = {
+    name: getNodeName(node),
+    type: getNodeType(node),
+    depth: lookupDepth(node),
+    sources: "sources" in node && node.sources ? node.sources.map((n) => getSdtId(n, isSolidOwner(n) ? "owner" /* Owner */ : "signal" /* Signal */)) : void 0,
+    observers: "observers" in node && node.observers ? node.observers.map((n) => getSdtId(n, "owner" /* Owner */)) : void 0,
+    graph: !isOwner && node.graph ? getSdtId(node.graph, "owner" /* Owner */) : void 0
+  };
+}
+function visitSources(node) {
+  let n = 0;
+  if ("sources" in node && node.sources) {
+    for (const source of node.sources) {
+      const isOwner = isSolidOwner(source);
+      if (isOwner && getOwnerType(source) === "refresh" /* Refresh */)
+        continue;
+      n++;
+      if (VisitedSources.has(source))
+        continue;
+      VisitedSources.add(source);
+      if (isOwner && visitSources(source) === 0) {
+        n--;
+        continue;
+      }
+      addNodeToGraph(source);
+    }
+  }
+  return n;
+}
+function visitObservers(node) {
+  if ("observers" in node && node.observers) {
+    for (const observer of node.observers) {
+      if (VisitedObservers.has(observer) || getOwnerType(observer) === "refresh" /* Refresh */) {
+        continue;
+      }
+      VisitedObservers.add(observer);
+      addNodeToGraph(observer);
+      visitObservers(observer);
+    }
+  }
+}
+function lookupDepth(node) {
+  const id = getSdtId(node, isSolidOwner(node) ? "owner" /* Owner */ : "signal" /* Signal */);
+  if (id in DepthMap)
+    return DepthMap[id];
+  let owner;
+  if (!("owned" in node))
+    owner = node.graph;
+  else if (!("fn" in node) && !node.owner)
+    return 0;
+  else
+    owner = node.owner;
+  return DepthMap[id] = owner ? lookupDepth(owner) + 1 : 0;
+}
+function collectDependencyGraph(node, config) {
+  const graph = Graph = {};
+  const visitedSources = VisitedSources = /* @__PURE__ */ new Set();
+  const visitedObservers = VisitedObservers = /* @__PURE__ */ new Set();
+  DepthMap = {};
+  OnNodeUpdate = config.onNodeUpdate;
+  addNodeToGraph(node);
+  visitSources(node);
+  visitObservers(node);
+  const clearListeners = () => {
+    visitedSources.forEach(unobserveNodeUpdate);
+    visitedObservers.forEach(unobserveNodeUpdate);
+    unobserveNodeUpdate(node);
+  };
+  Graph = VisitedObservers = VisitedSources = DepthMap = OnNodeUpdate = void 0;
+  return { graph, clearListeners };
+}
+
+// src/dependency/index.ts
+function createDependencyGraph(props) {
+  let clearListeners = null;
+  const onNodeUpdate = (id) => {
+    queueMicrotask(() => {
+      if (!props.enabled())
+        return;
+      props.onNodeUpdate(id);
+      triggerInspect();
+    });
+  };
+  const inspectedNode = createMemo(() => {
+    const state = props.inspectedState();
+    if (state.signalId) {
+      return getObjectById(state.signalId, "signal" /* Signal */);
+    } else if (state.ownerId) {
+      return getObjectById(state.ownerId, "owner" /* Owner */);
+    }
+    return null;
+  });
+  function inspectDGraph() {
+    clearListeners?.();
+    const node = inspectedNode();
+    const type = node && getNodeType(node);
+    if (!props.enabled() || !type || type === "root" /* Root */ || type === "component" /* Component */ || type === "context" /* Context */) {
+      clearListeners = null;
+      props.emit("DgraphUpdate", null);
+      return;
+    }
+    const dgraph = collectDependencyGraph(node, {
+      onNodeUpdate
+    });
+    clearListeners = dgraph.clearListeners;
+    props.emit("DgraphUpdate", dgraph.graph);
+  }
+  const triggerInspect = throttle(inspectDGraph, 200);
+  createEffect(
+    defer([props.enabled, inspectedNode], () => {
+      queueMicrotask(inspectDGraph);
+    })
+  );
+  props.listenToViewChange(() => {
+    inspectDGraph();
+  });
+}
 var _tmpl$ = /* @__PURE__ */ template(`<style>
@@ -526,5 +703,5 @@ .element-overlay {
 }
-</style>`, 2);
-var _tmpl$2 = /* @__PURE__ */ template(`<div><div class="name-animated-container"><div class="name-background"></div><div class="name-text">: <span></span></div><div class="name-invisible">: </div></div></div>`, 12);
-var _tmpl$3 = /* @__PURE__ */ template(`<div class="element-overlay"><div class="border"></div></div>`, 4);
+`);
+var _tmpl$2 = /* @__PURE__ */ template(`<div class="element-overlay"><div class="border">`);
+var _tmpl$3 = /* @__PURE__ */ template(`<div><div class="name-animated-container"><div class="name-background"></div><div class="name-text">: <span></span></div><div class="name-invisible">: `);
 function attachElementOverlay(selected) {
@@ -561,23 +738,23 @@ return createComponent(Portal, {
   const placeOnTop = createMemo(() => top() > window.innerHeight / 2);
-  return [_tmpl$.cloneNode(true), (() => {
-    const _el$2 = _tmpl$3.cloneNode(true); _el$2.firstChild;
+  return [_tmpl$(), (() => {
+    const _el$2 = _tmpl$2(); _el$2.firstChild;
     insert(_el$2, createComponent(Show, {
       get when() {
-        return !!props.name;
+        return props.name;
       },
-      get children() {
-        const _el$4 = _tmpl$2.cloneNode(true), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$10 = _el$7.nextSibling, _el$11 = _el$10.firstChild;
-        insert(_el$7, () => props.name, _el$8);
+      children: (name) => (() => {
+        const _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling, _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling, _el$10 = _el$7.nextSibling, _el$11 = _el$10.firstChild;
+        insert(_el$7, name, _el$8);
         insert(_el$9, () => props.tag);
-        insert(_el$10, () => props.name, _el$11);
+        insert(_el$10, name, _el$11);
         insert(_el$10, () => props.tag, null);
         effect(() => className(_el$4, `name-container ${placeOnTop() ? "top" : "bottom"}`));
         return _el$4;
-      }
+      })()
     }), null);
     effect((_p$) => {
       const _v$ = transform(), _v$2 = width() + "px", _v$3 = height() + "px";
-      _v$ !== _p$._v$ && _el$2.style.setProperty("transform", _p$._v$ = _v$);
-      _v$2 !== _p$._v$2 && _el$2.style.setProperty("width", _p$._v$2 = _v$2);
-      _v$3 !== _p$._v$3 && _el$2.style.setProperty("height", _p$._v$3 = _v$3);
+      _v$ !== _p$._v$ && ((_p$._v$ = _v$) != null ? _el$2.style.setProperty("transform", _v$) : _el$2.style.removeProperty("transform"));
+      _v$2 !== _p$._v$2 && ((_p$._v$2 = _v$2) != null ? _el$2.style.setProperty("width", _v$2) : _el$2.style.removeProperty("width"));
+      _v$3 !== _p$._v$3 && ((_p$._v$3 = _v$3) != null ? _el$2.style.setProperty("height", _v$3) : _el$2.style.removeProperty("height"));
       return _p$;
@@ -602,6 +779,6 @@ }, {
 var targetIDEMap = {
-  vscode: ({ projectPath, filePath, line, column }) => `vscode://file/${projectPath}/${filePath}:${line}:${column}`,
-  "vscode-insiders": ({ projectPath, filePath, line, column }) => `vscode-insiders://file/${projectPath}/${filePath}:${line}:${column}`,
-  atom: ({ projectPath, filePath, line, column }) => `atom://core/open/file?filename=${projectPath}/${filePath}&line=${line}&column=${column}`,
-  webstorm: ({ projectPath, filePath, line, column }) => `webstorm://open?file=${projectPath}/${filePath}&line=${line}&column=${column}`
+  vscode: ({ projectPath, file, line, column }) => `vscode://file/${projectPath}/${file}:${line}:${column}`,
+  "vscode-insiders": ({ projectPath, file: filePath, line, column }) => `vscode-insiders://file/${projectPath}/${filePath}:${line}:${column}`,
+  atom: ({ projectPath, file: filePath, line, column }) => `atom://core/open/file?filename=${projectPath}/${filePath}&line=${line}&column=${column}`,
+  webstorm: ({ projectPath, file: filePath, line, column }) => `webstorm://open?file=${projectPath}/${filePath}&line=${line}&column=${column}`
 };
@@ -613,14 +790,18 @@ function getTargetURL(target, data) {
 }
+var getProjectPath = () => window[WINDOW_PROJECTPATH_PROPERTY];
 function getSourceCodeData(location, element) {
-  const projectPath = window[WINDOW_PROJECTPATH_PROPERTY];
+  const projectPath = getProjectPath();
   if (!projectPath)
     return;
-  const match = location.match(LOC_ATTR_REGEX);
-  if (!match)
+  const parsed = parseLocationString(location);
+  if (!parsed)
     return;
-  const [, filePath, line, column] = match;
-  if (!filePath || !line || !column)
-    return;
-  return { filePath, line: +line, column: +column, projectPath, element };
+  return { ...parsed, projectPath, element };
 }
+function parseLocationString(location) {
+  let [filePath, line, column] = location.split(":");
+  if (filePath && line && column && typeof filePath === "string" && !isNaN(line = Number(line)) && !isNaN(column = Number(column))) {
+    return { file: filePath, line, column };
+  }
+}
 function openSourceCode(target, data) {
@@ -632,14 +813,2 @@ const url = getTargetURL(target, data);
 
-// src/locator/markComponent.ts
-function markComponentLoc(location) {
-  const owner = getOwner();
-  if (!owner)
-    return;
-  const type = getOwnerType(owner);
-  if (type === "component" /* Component */)
-    owner.location = location;
-  else if (type === "refresh" /* Refresh */)
-    owner.owner.location = location;
-}
-
 // src/locator/index.ts
@@ -649,6 +818,2 @@ function createLocator(props) {
   props.setLocatorEnabledSignal(createMemo(() => enabledByPressingSignal()()));
-  props.listenToDebuggerEenable((enabled) => {
-    if (!enabled)
-      setDevtoolsTarget(null);
-  });
   const [hoverTarget, setHoverTarget] = createSignal(null);
@@ -738,6 +903,5 @@ const [devtoolsTarget, setDevtoolsTarget] = createSignal(null);
   let locatorUsed = false;
-  const owner = getOwner$1();
+  const owner = getOwner();
   function useLocator2(options) {
     runWithOwner(owner, () => {
-      enableRootsAutoattach();
       if (locatorUsed)
@@ -754,228 +918,26 @@ return warn("useLocator can be called only once.");
   }
-  function openElementSourceCode(location, element) {
-    if (!targetIDE)
-      return warn("Please set `targetIDE` it in useLocator options.");
-    const sourceCodeData = getSourceCodeData(location, element);
-    sourceCodeData && openSourceCode(targetIDE, sourceCodeData);
+  if (solid_api_default.locatorOptions) {
+    useLocator2(solid_api_default.locatorOptions);
   }
   return {
     useLocator: useLocator2,
-    setDevtoolsHighlightTarget: (target) => void setDevtoolsTarget(target),
-    openElementSourceCode
-  };
-}
-
-// src/main/update.ts
-var GraphUpdateListeners = /* @__PURE__ */ new Set();
-{
-  const runListeners = () => GraphUpdateListeners.forEach((f) => f());
-  if (typeof window._$afterUpdate === "function") {
-    GraphUpdateListeners.add(window._$afterUpdate);
-  }
-  window._$afterUpdate = runListeners;
-}
-function makeSolidUpdateListener(onUpdate) {
-  GraphUpdateListeners.add(onUpdate);
-  return tryOnCleanup(() => {
-    GraphUpdateListeners.delete(onUpdate);
-  });
-}
-function interceptComputationRerun(owner, onRun) {
-  const _fn = owner.fn;
-  let v;
-  let prev;
-  const fn = () => v = _fn(prev);
-  owner.fn = !!owner.fn.length ? (p) => {
-    onRun(fn, prev = p);
-    return v;
-  } : () => {
-    onRun(fn, void 0);
-    return v;
-  };
-}
-var ComputationUpdateListeners = /* @__PURE__ */ new WeakMap();
-function observeComputationUpdate(owner, onRun, symbol = Symbol()) {
-  let map = ComputationUpdateListeners.get(owner);
-  if (!map)
-    ComputationUpdateListeners.set(owner, map = {});
-  map[symbol] = onRun;
-  interceptComputationRerun(owner, (fn) => {
-    fn();
-    for (const sym of Object.getOwnPropertySymbols(map))
-      map[sym]();
-  });
-}
-function removeComputationUpdateObserver(owner, symbol) {
-  const map = ComputationUpdateListeners.get(owner);
-  if (map)
-    delete map[symbol];
-}
-function observeValueUpdate(node, onUpdate, symbol) {
-  if (node.onValueUpdate) {
-    node.onValueUpdate[symbol] = onUpdate;
-    return;
-  }
-  const map = node.onValueUpdate = { [symbol]: onUpdate };
-  let value = node.value;
-  Object.defineProperty(node, "value", {
-    get: () => value,
-    set: (newValue) => {
-      for (const sym of Object.getOwnPropertySymbols(map))
-        map[sym](newValue, value);
-      value = newValue;
+    setDevtoolsHighlightTarget(target) {
+      setDevtoolsTarget(target);
+    },
+    openElementSourceCode(location, element) {
+      if (!targetIDE)
+        return warn("Please set `targetIDE` it in useLocator options.");
+      const projectPath = getProjectPath();
+      if (!projectPath)
+        return warn("projectPath is not set.");
+      openSourceCode(targetIDE, {
+        ...location,
+        projectPath,
+        element
+      });
     }
-  });
-}
-function removeValueUpdateObserver(node, symbol) {
-  if (node.onValueUpdate)
-    delete node.onValueUpdate[symbol];
-}
-function makeValueUpdateListener(node, onUpdate, symbol) {
-  observeValueUpdate(node, onUpdate, symbol);
-  tryOnCleanup(() => removeValueUpdateObserver(node, symbol));
-}
-
-// src/dependency/collect.ts
-var $DGRAPH = Symbol("dependency-graph");
-var Graph;
-var VisitedSources;
-var VisitedObservers;
-var DepthMap;
-var OnNodeUpdate;
-function observeNodeUpdate(node, handler) {
-  if (isSolidOwner(node))
-    observeComputationUpdate(node, handler, $DGRAPH);
-  else
-    observeValueUpdate(node, handler, $DGRAPH);
-}
-function unobserveNodeUpdate(node) {
-  if (isSolidOwner(node))
-    removeComputationUpdateObserver(node, $DGRAPH);
-  else
-    removeValueUpdateObserver(node, $DGRAPH);
-}
-function addNodeToGraph(node) {
-  const isOwner = isSolidOwner(node);
-  const id = getSdtId(node, isOwner ? "owner" /* Owner */ : "signal" /* Signal */);
-  if (Graph[id])
-    return;
-  const onNodeUpdate = OnNodeUpdate;
-  observeNodeUpdate(node, () => onNodeUpdate(id));
-  Graph[id] = {
-    name: getNodeName(node),
-    type: getNodeType(node),
-    depth: lookupDepth(node),
-    sources: "sources" in node && node.sources ? node.sources.map((n) => getSdtId(n, isSolidOwner(n) ? "owner" /* Owner */ : "signal" /* Signal */)) : void 0,
-    observers: "observers" in node && node.observers ? node.observers.map((n) => getSdtId(n, "owner" /* Owner */)) : void 0,
-    graph: !isOwner && node.graph ? getSdtId(node.graph, "owner" /* Owner */) : void 0
   };
 }
-function visitSources(node) {
-  let n = 0;
-  if ("sources" in node && node.sources) {
-    for (const source of node.sources) {
-      const isOwner = isSolidOwner(source);
-      if (isOwner && getOwnerType(source) === "refresh" /* Refresh */)
-        continue;
-      n++;
-      if (VisitedSources.has(source))
-        continue;
-      VisitedSources.add(source);
-      if (isOwner && visitSources(source) === 0) {
-        n--;
-        continue;
-      }
-      addNodeToGraph(source);
-    }
-  }
-  return n;
-}
-function visitObservers(node) {
-  if ("observers" in node && node.observers) {
-    for (const observer of node.observers) {
-      if (VisitedObservers.has(observer) || getOwnerType(observer) === "refresh" /* Refresh */) {
-        continue;
-      }
-      VisitedObservers.add(observer);
-      addNodeToGraph(observer);
-      visitObservers(observer);
-    }
-  }
-}
-function lookupDepth(node) {
-  const id = getSdtId(node, isSolidOwner(node) ? "owner" /* Owner */ : "signal" /* Signal */);
-  if (id in DepthMap)
-    return DepthMap[id];
-  let owner;
-  if (!("owned" in node))
-    owner = node.graph;
-  else if (!("fn" in node) && !node.owner)
-    return 0;
-  else
-    owner = node.owner;
-  return DepthMap[id] = owner ? lookupDepth(owner) + 1 : 0;
-}
-function collectDependencyGraph(node, config) {
-  const graph = Graph = {};
-  const visitedSources = VisitedSources = /* @__PURE__ */ new Set();
-  const visitedObservers = VisitedObservers = /* @__PURE__ */ new Set();
-  DepthMap = {};
-  OnNodeUpdate = config.onNodeUpdate;
-  addNodeToGraph(node);
-  visitSources(node);
-  visitObservers(node);
-  const clearListeners = () => {
-    visitedSources.forEach(unobserveNodeUpdate);
-    visitedObservers.forEach(unobserveNodeUpdate);
-    unobserveNodeUpdate(node);
-  };
-  Graph = VisitedObservers = VisitedSources = DepthMap = OnNodeUpdate = void 0;
-  return { graph, clearListeners };
-}
 
-// src/dependency/index.ts
-function createDependencyGraph(props) {
-  let clearListeners = null;
-  const onNodeUpdate = (id) => {
-    queueMicrotask(() => {
-      if (!props.enabled())
-        return;
-      props.onNodeUpdate(id);
-      triggerInspect();
-    });
-  };
-  function inspectDGraph() {
-    clearListeners?.();
-    const state = props.inspectedState();
-    let inspectedNode = null;
-    let isSignal = false;
-    if (state.signalId) {
-      inspectedNode = getObjectById(state.signalId, "signal" /* Signal */);
-      isSignal = true;
-    } else if (state.ownerId) {
-      inspectedNode = getObjectById(state.ownerId, "owner" /* Owner */);
-    }
-    if (!props.enabled() || !inspectedNode || !isSignal && (!isSolidComputation(inspectedNode) || isSolidComponent(inspectedNode))) {
-      clearListeners = null;
-      props.emit("DgraphUpdate", null);
-      return;
-    }
-    const dgraph = collectDependencyGraph(inspectedNode, {
-      onNodeUpdate
-    });
-    clearListeners = dgraph.clearListeners;
-    props.emit("DgraphUpdate", dgraph.graph);
-  }
-  const triggerInspect = throttle(inspectDGraph, 200);
-  props.listenToInspectedStateChange(() => {
-    inspectDGraph();
-  });
-  props.listenToViewChange(() => {
-    inspectDGraph();
-  });
-  createEffect(() => {
-    props.enabled();
-    inspectDGraph();
-  });
-}
+// src/inspector/serialize.ts
 var Deep;
@@ -1032,3 +994,3 @@ var List;
   } else if (!ignoreNextStore && isStoreNode(value)) {
-    const node = unwrap(value);
+    const node = solid_api_default.unwrap(value);
     if (node !== value)
@@ -1147,4 +1109,6 @@ Seen.set(node, index);
         const value = get();
-        if (getListener()) {
-          onCleanup(() => --o.n === 0 && self.onPropStateChange?.(key, "stale" /* Stale */));
+        if (solid_api_default.getListener()) {
+          solid_api_default.onCleanup(
+            () => --o.n === 0 && self.onPropStateChange?.(key, "stale" /* Stale */)
+          );
         }
@@ -1198,20 +1162,18 @@ ++o.n === 1 && self.onPropStateChange?.(key, "live" /* Live */);
 var $INSPECTOR = Symbol("inspector");
-function mapSourceValue(node, handler) {
-  const { value } = node;
-  const isStore = isSolidStore(node);
-  const id = getSdtId(
-    node,
-    isStore ? "store" /* Store */ : isSolidOwner(node) ? "owner" /* Owner */ : "signal" /* Signal */
-  );
-  let name;
+var typeToObjectTypeMap = {
+  ["signal" /* Signal */]: "signal" /* Signal */,
+  ["memo" /* Memo */]: "owner" /* Owner */,
+  ["store" /* Store */]: "store" /* Store */
+};
+function mapSourceValue(node, handler, isMemo) {
+  const type = isMemo ? "memo" /* Memo */ : isSolidStore(node) ? "store" /* Store */ : isSolidSignal(node) ? "signal" /* Signal */ : null;
+  if (!type)
+    return null;
+  const { value } = node, id = getSdtId(node, typeToObjectTypeMap[type]);
   ValueMap.add(`${"signal" /* Signal */}:${id}`, () => node.value);
-  if (isStore) {
-    name = getDisplayName(getStoreNodeName(value));
-  } else {
-    name = getNodeName(node);
+  if (type !== "store" /* Store */)
     observeValueUpdate(node, (v) => handler(id, v), $INSPECTOR);
-  }
   return {
-    type: getNodeType(node),
-    name,
+    type,
+    name: getNodeName(node),
     id,
@@ -1222,3 +1184,3 @@ value: encodeValue(value, false)
 function mapProps(props) {
-  const isProxy = !!props[$PROXY];
+  const isProxy = !!props[solid_api_default.$PROXY];
   const record = {};
@@ -1269,6 +1231,5 @@ let checkProxyProps;
   const type = markOwnerType(owner);
-  const name = markOwnerName(owner);
   let { sourceMap, owned } = owner;
   let getValue = () => owner.value;
-  const details = { id, name, type };
+  const details = { id, name: getNodeName(owner), type, signals: [] };
   if (type === "context" /* Context */) {
@@ -1295,4 +1256,10 @@ sourceMap = void 0;
       ({ checkProxyProps, props: details.props } = mapProps(owner.props));
-      if (owner.location)
-        details.location = owner.location;
+      let location = owner.component.location;
+      if (
+        // get location from component.location
+        typeof location === "string" && (location = parseLocationString(location)) || // get location from the babel plugin marks
+        (location = solid_api_default.getOwnerLocation(owner)) && (location = parseLocationString(location))
+      ) {
+        details.location = location;
+      }
     } else {
@@ -1305,12 +1272,13 @@ observeValueUpdate(owner, () => onValueUpdate("value" /* Value */), $INSPECTOR);
   if (sourceMap) {
-    const signalNodes = Object.values(sourceMap);
-    details.signals = Array(signalNodes.length);
-    for (let i = 0; i < signalNodes.length; i++) {
-      details.signals[i] = mapSourceValue(signalNodes[i], onSignalUpdate);
+    for (const signal of sourceMap) {
+      const mapped = mapSourceValue(signal, onSignalUpdate, false);
+      mapped && details.signals.push(mapped);
     }
-  } else
-    details.signals = [];
+  }
   if (owned) {
     for (const node of owned) {
-      isSolidMemo(node) && details.signals.push(mapSourceValue(node, onSignalUpdate));
+      if (!isSolidMemo(node))
+        continue;
+      const mapped = mapSourceValue(node, onSignalUpdate, true);
+      mapped && details.signals.push(mapped);
     }
@@ -1327,3 +1295,5 @@ }
 });
-var DEV = DEV$1;
+
+// src/inspector/store.ts
+var { isWrappable } = solid_api_default.STORE_DEV;
 var Nodes = /* @__PURE__ */ new WeakMap();
@@ -1334,3 +1304,3 @@ var OnNodeUpdate3 = null;
 }
-globalThis._$onStoreNodeUpdate = (node, property, value, prev) => untrack(() => {
+solid_api_default.STORE_DEV.hooks.onStoreNodeUpdate = (node, property, value, prev) => solid_api_default.untrack(() => {
   if (!OnNodeUpdate3 || !Nodes.has(node) || typeof property === "symbol")
@@ -1343,3 +1313,3 @@ return;
   }
-  DEV.isWrappable(prev) && untrackStore(prev, storeProperty);
+  isWrappable(prev) && untrackStore(prev, storeProperty);
   if (value === void 0) {
@@ -1349,9 +1319,9 @@ OnNodeUpdate3(storeProperty, void 0);
     OnNodeUpdate3(storeProperty, { value });
-    DEV.isWrappable(value) && trackStore(value, storeProperty);
+    isWrappable(value) && trackStore(value, storeProperty);
   }
 });
 function observeStoreNode(rootNode) {
-  rootNode = unwrap(rootNode);
+  rootNode = solid_api_default.unwrap(rootNode);
   const symbol = Symbol("inspect-store");
-  return untrack(() => {
+  return solid_api_default.untrack(() => {
     trackStore(rootNode, symbol);
@@ -1383,3 +1353,3 @@ return () => untrackStore(rootNode, symbol);
       const child = node[i];
-      DEV.isWrappable(child) && fn(i.toString(), child);
+      isWrappable(child) && fn(i.toString(), child);
     }
@@ -1389,3 +1359,3 @@ } else {
       const { value, get } = Object.getOwnPropertyDescriptor(node, key);
-      if (!get && DEV.isWrappable(value))
+      if (!get && isWrappable(value))
         fn(key, value);
@@ -1484,24 +1454,29 @@ }
   let clearPrevDisposeListener;
-  props.listenToInspectedOwnerChange((id) => {
-    const owner = id && getObjectById(id, "owner" /* Owner */);
-    inspectedOwner && clearOwnerObservers(inspectedOwner, propsMap);
-    inspectedOwner = owner;
-    valueMap.reset();
-    clearUpdates();
-    if (owner) {
-      const result = collectOwnerDetails(owner, {
-        onValueUpdate: pushValueUpdate,
-        onPropStateChange: pushPropState,
-        observedPropsMap: propsMap
-      });
-      props.emit("InspectedNodeDetails", result.details);
-      valueMap = result.valueMap;
-      lastDetails = result.details;
-      checkProxyProps = result.checkProxyProps || null;
-    } else {
-      lastDetails = void 0;
-      checkProxyProps = null;
-    }
-    clearPrevDisposeListener?.();
-    clearPrevDisposeListener = owner ? onOwnerDispose(owner, props.resetInspectedNode) : void 0;
+  createEffect(() => {
+    if (!props.enabled())
+      return;
+    const id = props.inspectedOwnerId();
+    queueMicrotask(() => {
+      const owner = id && getObjectById(id, "owner" /* Owner */);
+      inspectedOwner && clearOwnerObservers(inspectedOwner, propsMap);
+      inspectedOwner = owner;
+      valueMap.reset();
+      clearUpdates();
+      if (owner) {
+        const result = collectOwnerDetails(owner, {
+          onValueUpdate: pushValueUpdate,
+          onPropStateChange: pushPropState,
+          observedPropsMap: propsMap
+        });
+        props.emit("InspectedNodeDetails", result.details);
+        valueMap = result.valueMap;
+        lastDetails = result.details;
+        checkProxyProps = result.checkProxyProps || null;
+      } else {
+        lastDetails = void 0;
+        checkProxyProps = null;
+      }
+      clearPrevDisposeListener?.();
+      clearPrevDisposeListener = owner ? onOwnerDispose(owner, props.resetInspectedNode) : void 0;
+    });
   });
@@ -1511,3 +1486,3 @@ createEffect(() => {
       return;
-    makeSolidUpdateListener(() => checkProxyProps && triggerPropsCheck());
+    onCleanup(addSolidUpdateListener(() => checkProxyProps && triggerPropsCheck()));
   });
@@ -1568,3 +1543,3 @@ return {
       } else {
-        if (type !== "context" /* Context */ && type !== "root" /* Root */)
+        if (isObservableComputation(child))
           observeComputation(child, owner);
@@ -1626,6 +1601,4 @@ children.push.apply(children, mapChildren(child, mappedOwner));
   const type = overwriteType ?? markOwnerType(owner);
-  const name = type === "component" /* Component */ || type === "memo" /* Memo */ || type === "effect" /* Effect */ || type === "computation" /* Computation */ ? markOwnerName(owner) : void 0;
-  const mapped = { id, type };
-  if (name)
-    mapped.name = name;
+  const name = getNodeName(owner);
+  const mapped = { id, type, name };
   let resolvedElements;
@@ -1648,3 +1621,3 @@ if (type === "component" /* Component */) {
     }
-  } else if (type !== "context" /* Context */ && type !== "root" /* Root */) {
+  } else if (isObservableComputation(owner)) {
     observeComputation(owner, owner);
@@ -1815,7 +1788,7 @@ if (!owner.sources || owner.sources.length === 0)
   );
-  const debuggerEnabledBus = createEventBus();
-  createEffect(() => {
-    if (!debuggerEnabled())
-      debuggerEnabledBus.emit(false);
-  });
+  createEffect(
+    defer(debuggerEnabled, (enabled) => {
+      hub.output.emit("DebuggerEnabled", enabled);
+    })
+  );
   const viewChange = createEventBus();
@@ -1845,6 +1818,4 @@ function setView(view) {
   const [inspectedState, setInspectedState] = createSignal(INITIAL_INSPECTED_STATE, { equals: false });
-  createEffect(() => {
-    const state = inspectedState();
-    queueMicrotask(() => hub.output.emit("InspectedState", state));
-  });
+  const inspectedOwnerId = createMemo(() => inspectedState().ownerId);
+  createEffect(() => hub.output.emit("InspectedState", inspectedState()));
   function getTreeWalkerOwnerId(ownerId) {
@@ -1894,3 +1865,3 @@ const owner = ownerId && getObjectById(ownerId, "owner" /* Owner */);
     enabled: debuggerEnabled,
-    listenToInspectedOwnerChange: (l) => hub.output.on("InspectedState", (s) => l(s.ownerId)),
+    inspectedOwnerId,
     resetInspectedNode
@@ -1903,8 +1874,6 @@ });
     onNodeUpdate: pushNodeUpdate,
-    inspectedState,
-    listenToInspectedStateChange: (l) => hub.output.on("InspectedState", l)
+    inspectedState
   });
   const locator = createLocator({
     emit: hub.output.emit,
-    listenToDebuggerEenable: debuggerEnabledBus.listen,
     locatorEnabled,
@@ -1926,4 +1895,7 @@ setLocatorEnabledSignal: (signal) => toggleModules("locatorKeyPressSignal", () => signal),
       case "ResetState": {
-        resetInspectedNode();
-        structure.resetTreeWalkerMode();
+        batch(() => {
+          resetInspectedNode();
+          structure.resetTreeWalkerMode();
+          locator.setDevtoolsHighlightTarget(null);
+        });
         break;
@@ -1949,2 +1921,5 @@ }
     return {
+      meta: {
+        versions: solid_api_default.versions
+      },
       enabled: debuggerEnabled,
@@ -1964,8 +1939,2 @@ toggleEnabled: (enabled) => void toggleModules("debugger", enabled),
 
-// src/index.ts
-var Debugger = (props) => {
-  attachDebugger();
-  return props.children;
-};
-
-export { Debugger, attachDebugger, createInternalRoot, enableRootsAutoattach, getFunctionSources, getNodeName, getNodeType, getOwner, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidStore, lookupOwner, makeSolidUpdateListener, makeValueUpdateListener, markComponentLoc, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots, useDebugger, useLocator };
+export { addSolidUpdateListener, attachDebugger, createInternalRoot, getNodeName, getNodeType, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidSignal, isSolidStore, lookupOwner, makeValueUpdateListener, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots, useDebugger, useLocator };

dist/types.d.ts

@@ -1,2 +0,4 @@
-export { C as Core, q as DEFAULT_MAIN_VIEW, t as DEFAULT_WALKER_MODE, D as DGraphUpdate, B as Debugger, r as DebuggerModule, p as DevtoolsMainView, g as EncodedValue, E as EncodedValueMap, H as HighlightElementPayload, I as INFINITY, i as InspectorUpdate, h as InspectorUpdateMap, k as LOCATION_ATTRIBUTE_NAME, L as LocationAttr, m as LocatorComponent, j as LocatorOptions, M as MARK_COMPONENT, A as Mapped, e as NAN, d as NEGATIVE_INFINITY, v as NODE_TYPE_NAMES, x as NodeID, N as NodeType, P as PropGetterState, b as SerializedDGraph, S as Solid, c as StructureUpdates, n as TargetIDE, o as TargetURLFunction, T as ToggleInspectedValueData, s as TreeWalkerMode, U as UNDEFINED, l as USE_LOCATOR, y as ValueItemID, w as ValueItemType, f as ValueType, V as ValueUpdateListener, W as WINDOW_PROJECTPATH_PROPERTY, z as getValueItemId } from './index-7aa0ad20.js';
+export { r as DEFAULT_MAIN_VIEW, v as DEFAULT_WALKER_MODE, D as DGraphUpdate, c as Debugger, s as DebuggerModule, A as DevEventDataMap, z as DevEventType, q as DevtoolsMainView, h as EncodedValue, E as EncodedValueMap, H as HighlightElementPayload, I as INFINITY, j as InspectorUpdate, i as InspectorUpdateMap, k as LOCATION_ATTRIBUTE_NAME, l as LocationAttr, m as LocatorComponent, L as LocatorOptions, M as Mapped, f as NAN, e as NEGATIVE_INFINITY, w as NODE_TYPE_NAMES, C as NodeID, N as NodeType, O as OnStoreNodeUpdate, P as PropGetterState, b as SerializedDGraph, S as Solid, n as SourceLocation, B as StoredDevEvent, d as StructureUpdates, o as TargetIDE, p as TargetURLFunction, T as ToggleInspectedValueData, t as TreeWalkerMode, U as UNDEFINED, y as UNKNOWN, F as ValueItemID, x as ValueItemType, g as ValueType, V as ValueUpdateListener, W as WINDOW_PROJECTPATH_PROPERTY, G as getValueItemId } from './index-7bfdbbff.js';
+import '@solid-primitives/event-bus';
+import 'solid-js';
 import '@solid-devtools/shared/utils';
@@ -7,3 +9,2 @@ import '@solid-primitives/keyboard';
 import 'solid-js/types/reactive/signal';
-import '@solid-primitives/event-bus';
-import 'solid-js';
+import 'solid-js/web';

dist/types.js

@@ -1,1 +0,1 @@
-export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, MARK_COMPONENT, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, USE_LOCATOR, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId } from './chunk-4JABOMAE.js';
+export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevEventType, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, UNKNOWN, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId } from './chunks/chunk-S74N7CWV.js';

package.json

 {
   "name": "@solid-devtools/debugger",
-  "version": "0.21.0",
+  "version": "0.22.0-next.0",
   "description": "Debugger of the Solid's reactivity graph — a cornerstone of all solid-devtools.",
@@ -31,59 +31,18 @@ "license": "MIT",
   "type": "module",
-  "main": "dist/server.cjs",
-  "module": "dist/server.js",
-  "types": "dist/index.d.ts",
-  "browser": {
-    "./dist/server.cjs": "./dist/index.cjs",
-    "./dist/server.js": "./dist/index.js"
-  },
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "worker": {
-        "import": {
-          "types": "./dist/index.d.ts",
-          "default": "./dist/server.js"
-        },
-        "require": "./dist/server.cjs"
-      },
-      "browser": {
-        "development": {
-          "import": {
-            "types": "./dist/index.d.ts",
-            "default": "./dist/index.js"
-          },
-          "require": "./dist/index.cjs"
-        },
-        "import": {
-          "types": "./dist/index.d.ts",
-          "default": "./dist/server.js"
-        },
-        "require": "./dist/server.cjs"
-      },
-      "deno": {
-        "import": {
-          "types": "./dist/index.d.ts",
-          "default": "./dist/server.js"
-        },
-        "require": "./dist/server.cjs"
-      },
-      "node": {
-        "import": {
-          "types": "./dist/index.d.ts",
-          "default": "./dist/server.js"
-        },
-        "require": "./dist/server.cjs"
-      },
-      "development": {
-        "import": {
-          "types": "./dist/index.d.ts",
-          "default": "./dist/server.js"
-        },
-        "require": "./dist/index.cjs"
-      },
       "import": {
         "types": "./dist/index.d.ts",
-        "default": "./dist/server.js"
-      },
-      "require": "./dist/server.cjs"
+        "default": "./dist/index.js"
+      }
     },
+    "./bundled": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/bundled.js"
+      }
+    },
     "./types": {
@@ -93,4 +52,9 @@ "import": {
         "default": "./dist/types.js"
-      },
-      "require": "./dist/types.cjs"
+      }
+    },
+    "./setup": {
+      "import": {
+        "types": "./dist/setup.d.ts",
+        "default": "./dist/setup.js"
+      }
     }
@@ -100,4 +64,10 @@ },
     "*": {
+      "bundled": [
+        "./dist/index.d.ts"
+      ],
       "types": [
         "./dist/types.d.ts"
+      ],
+      "setup": [
+        "./dist/setup.d.ts"
       ]
@@ -107,17 +77,19 @@ }
   "dependencies": {
-    "@solid-devtools/shared": "^0.11.0",
-    "@solid-primitives/bounds": "^0.0.107",
-    "@solid-primitives/cursor": "^0.0.105",
-    "@solid-primitives/event-bus": "^1.0.0",
-    "@solid-primitives/event-listener": "^2.2.6",
-    "@solid-primitives/keyboard": "^1.0.7",
-    "@solid-primitives/platform": "^0.0.103",
-    "@solid-primitives/scheduled": "^1.2.1",
-    "@solid-primitives/utils": "^5.1.0",
-    "type-fest": "^3.5.7"
+    "@solid-primitives/bounds": "^0.0.111",
+    "@solid-primitives/cursor": "^0.0.109",
+    "@solid-primitives/event-bus": "^1.0.7",
+    "@solid-primitives/event-listener": "^2.2.13",
+    "@solid-primitives/keyboard": "^1.2.3",
+    "@solid-primitives/platform": "^0.0.105",
+    "@solid-primitives/scheduled": "^1.3.2",
+    "@solid-primitives/static-store": "^0.0.2",
+    "@solid-primitives/utils": "^6.2.0",
+    "solid-js": "^1.7.5",
+    "type-fest": "^3.11.0",
+    "@solid-devtools/shared": "^0.12.0-next.0"
   },
   "peerDependencies": {
-    "solid-js": "^1.6.9"
+    "solid-js": "^1.7.0"
   },
-  "packageManager": "pnpm@7.22.0",
+  "packageManager": "pnpm@8.2.0",
   "scripts": {
@@ -124,0 +96,0 @@ "dev": "tsup --watch",

README.md

@@ -15,5 +15,5 @@ <a href="https://github.com/thetarnav/solid-devtools/tree/main/packages/debugger#readme" target="_blank">
 
-## Usage Guide
+## Installation
 
-### Installation
+If you're not using the main [`solid-devtools`](https://github.com/thetarnav/solid-devtools/tree/main/packages/main) package, and want to use the debugger directly, you can install it as a standalone package:
 
@@ -28,86 +28,31 @@ ```bash
 
-### Automatically Attaching Debugger
+> **Warning**
+> This package changes extremely often, and is not meant to be used directly. Unless you know what you're doing, use the main package instead.
 
-You can use the debugger in your Solid apps without having to manually attach it to every root or the reactive graph in your application. To enable automatic attaching, you need to add the following code to the entry point of your app:
+### Module overview
 
-[**If you use `solid-devtools` package, this is already handled for you!**](https://github.com/thetarnav/solid-devtools/tree/main/packages/main)
+The debugger is split into four submodules:
 
-```ts
-import { enableRootsAutoattach } from '@solid-devtools/debugger'
+- `.` - The main debugger runtime. It exposes hooks like `useDebugger`, or `useLocator` which are used to directly interact with the debugger.
 
-enableRootsAutoattach()
-```
+  The debugger module doesn't import from `solid-js` directly, DEV API it provided to it by the `./setup` module.
 
-### Manually Attaching Debugger
+- `./setup` - As the name suggests, it's used to setup the debugger. It needs to be imported before the debugger is used, as it provides the DEV API to the debugger.
 
-If you don't want to automatically attach debugger, it can be done manually. It will give you the freedom to attach debugger to any root you choose.
+- `./bundled` - A bundled version of the main debugger module. Use this instead of the main module to prevent the debugger from importing from the local `solid-js` package to keep the development and debugger runtimes separate.
 
-To do so you need to import the debugger package and use one of the two primitives:
+- `./types` - Exports all "pure" resources of the debugger, such as types, enums and constants. Use this if you don't want to import the debugger runtime or `solid-js` by accident.
 
-#### `attachDebugger`
+### Import the debugger
 
-This is a hook that will attach the debugger to the reactive owner of the scope it was used under. For example you might want to use it in you `<App>` component, or directly in the `render` function. It can be used in many places at once without any issues.
+The debugger needs to be setup before it can be used. To do that, import the `./setup` module before the debugger is used.
 
-```tsx
-import { render } from 'solid-js/web'
-import { attachDebugger } from '@solid-devtools/debugger'
+```ts
+import '@solid-devtools/debugger/setup'
 
-render(() => {
-  attachDebugger()
-  return <App />
-}, document.getElementById('root'))
+import { useDebugger } from '@solid-devtools/debugger/bundled' // or from '@solid-devtools/debugger'
 
-// or inside the App component:
-function App() {
-  attachDebugger()
-  return <>...</>
-}
+const debug = useDebugger()
 ```
 
-#### `Debugger`
-
-The debugger component works exactly like [`attachDebugger`](#attachDebugger), but it may be more convenient to use at times.
-
-```tsx
-import { render } from 'solid-js/web'
-import { Debugger } from '@solid-devtools/debugger'
-
-render(
-  () => (
-    <Debugger>
-      <App />
-    </Debugger>
-  ),
-  document.getElementById('root'),
-)
-```
-
-#### Reattaching sub roots back to the tree
-
-If you choose to attach debugger manually, you have to do that with every sub root, even if it is theoretically a part of existing and attached tree. This is because Solid doesn't attach roots created with `createRoot` to it's detached parent, so the debugger has no way of reaching it. To reattach this root back to the tree tracked by the debugger — simply put another `attachDebugger` call inside it.
-
-[More in this issue](https://github.com/thetarnav/solid-devtools/issues/15)
-
-This also will be necessary when using components that use `createRoot` internally, like `<For>`, `<Index>` or `<Suspense>`.
-
-> **Note**
-> This applies only when you are attaching roots manually.
-> For automatic attaching, this is already handled.
-
-```tsx
-<For each={list()}>
-	{item => (
-		<Debugger>
-			<ItemComponent title={item} />
-		</Debugger>
-	)}
-<For>
-
-// or call attachDebugger inside ItemComponent
-function ItemComponent(props){
-	attachDebugger()
-	return <li>props.title</li>
-}
-```
-
 ### Using component locator
@@ -120,3 +65,3 @@
 ```ts
-import { useLocator } from 'solid-devtools'
+import { useLocator } from '@solid-devtools/debugger' // or 'solid-devtools/setup'
 
@@ -123,0 +68,0 @@ useLocator()

dist/chunk-4JABOMAE.js

-// src/inspector/types.ts
-var INFINITY = "Infinity";
-var NEGATIVE_INFINITY = "NegativeInfinity";
-var NAN = "NaN";
-var UNDEFINED = "undefined";
-var ValueType = /* @__PURE__ */ ((ValueType2) => {
-  ValueType2["Number"] = "number";
-  ValueType2["Boolean"] = "boolean";
-  ValueType2["String"] = "string";
-  ValueType2["Null"] = "null";
-  ValueType2["Symbol"] = "symbol";
-  ValueType2["Array"] = "array";
-  ValueType2["Object"] = "object";
-  ValueType2["Function"] = "function";
-  ValueType2["Getter"] = "getter";
-  ValueType2["Element"] = "element";
-  ValueType2["Instance"] = "instance";
-  ValueType2["Store"] = "store";
-  ValueType2["Unknown"] = "unknown";
-  return ValueType2;
-})(ValueType || {});
-var PropGetterState = /* @__PURE__ */ ((PropGetterState2) => {
-  PropGetterState2["Live"] = "live";
-  PropGetterState2["Stale"] = "stale";
-  return PropGetterState2;
-})(PropGetterState || {});
-
-// src/locator/types.ts
-var WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
-var LOCATION_ATTRIBUTE_NAME = "data-source-loc";
-var MARK_COMPONENT = `markComponentLoc`;
-var USE_LOCATOR = `useLocator`;
-
-// src/main/constants.ts
-var DevtoolsMainView = /* @__PURE__ */ ((DevtoolsMainView2) => {
-  DevtoolsMainView2["Structure"] = "structure";
-  return DevtoolsMainView2;
-})(DevtoolsMainView || {});
-var DEFAULT_MAIN_VIEW = "structure" /* Structure */;
-var DebuggerModule = /* @__PURE__ */ ((DebuggerModule2) => {
-  DebuggerModule2["Locator"] = "locator";
-  DebuggerModule2["Structure"] = "structure";
-  DebuggerModule2["Dgraph"] = "dgraph";
-  return DebuggerModule2;
-})(DebuggerModule || {});
-var TreeWalkerMode = /* @__PURE__ */ ((TreeWalkerMode2) => {
-  TreeWalkerMode2["Owners"] = "owners";
-  TreeWalkerMode2["Components"] = "components";
-  TreeWalkerMode2["DOM"] = "dom";
-  return TreeWalkerMode2;
-})(TreeWalkerMode || {});
-var DEFAULT_WALKER_MODE = "components" /* Components */;
-var NodeType = /* @__PURE__ */ ((NodeType2) => {
-  NodeType2["Root"] = "root";
-  NodeType2["Component"] = "component";
-  NodeType2["Element"] = "element";
-  NodeType2["Effect"] = "effect";
-  NodeType2["Render"] = "render";
-  NodeType2["Memo"] = "memo";
-  NodeType2["Computation"] = "computation";
-  NodeType2["Refresh"] = "refresh";
-  NodeType2["Context"] = "context";
-  NodeType2["Signal"] = "signal";
-  NodeType2["Store"] = "store";
-  return NodeType2;
-})(NodeType || {});
-var NODE_TYPE_NAMES = {
-  ["root" /* Root */]: "Root",
-  ["component" /* Component */]: "Component",
-  ["element" /* Element */]: "Element",
-  ["effect" /* Effect */]: "Effect",
-  ["render" /* Render */]: "Render Effect",
-  ["memo" /* Memo */]: "Memo",
-  ["computation" /* Computation */]: "Computation",
-  ["refresh" /* Refresh */]: "Refresh",
-  ["context" /* Context */]: "Context",
-  ["signal" /* Signal */]: "Signal",
-  ["store" /* Store */]: "Store"
-};
-var ValueItemType = /* @__PURE__ */ ((ValueItemType2) => {
-  ValueItemType2["Signal"] = "signal";
-  ValueItemType2["Prop"] = "prop";
-  ValueItemType2["Value"] = "value";
-  return ValueItemType2;
-})(ValueItemType || {});
-
-// src/main/types.ts
-var getValueItemId = (type, id) => {
-  if (type === "value" /* Value */)
-    return "value" /* Value */;
-  return `${type}:${id}`;
-};
-
-export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, MARK_COMPONENT, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, USE_LOCATOR, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId };

dist/index-7aa0ad20.d.ts

-import { ToDyscriminatedUnion } from '@solid-devtools/shared/utils';
-import { KbdKey } from '@solid-primitives/keyboard';
-import * as solid_js_store_types_store from 'solid-js/store/types/store';
-import * as solid_js_store from 'solid-js/store';
-import * as solid_js_types_reactive_signal from 'solid-js/types/reactive/signal';
-import * as _solid_primitives_event_bus from '@solid-primitives/event-bus';
-import * as solid_js from 'solid-js';
-
-/**
- * Main modules and views of the devtools. Used for "routing".
- */
-declare enum DevtoolsMainView {
-    Structure = "structure"
-}
-declare const DEFAULT_MAIN_VIEW = DevtoolsMainView.Structure;
-declare enum DebuggerModule {
-    Locator = "locator",
-    Structure = "structure",
-    Dgraph = "dgraph"
-}
-declare enum TreeWalkerMode {
-    Owners = "owners",
-    Components = "components",
-    DOM = "dom"
-}
-declare const DEFAULT_WALKER_MODE = TreeWalkerMode.Components;
-declare enum NodeType {
-    Root = "root",
-    Component = "component",
-    Element = "element",
-    Effect = "effect",
-    Render = "render",
-    Memo = "memo",
-    Computation = "computation",
-    Refresh = "refresh",
-    Context = "context",
-    Signal = "signal",
-    Store = "store"
-}
-declare const NODE_TYPE_NAMES: Readonly<Record<NodeType, string>>;
-declare enum ValueItemType {
-    Signal = "signal",
-    Prop = "prop",
-    Value = "value"
-}
-
-declare namespace SerializedDGraph {
-    type Node = {
-        name: string;
-        depth: number;
-        type: Exclude<NodeType, NodeType.Root | NodeType.Component>;
-        sources: readonly NodeID[] | undefined;
-        observers: readonly NodeID[] | undefined;
-        graph: NodeID | undefined;
-    };
-    type Graph = Record<NodeID, Node>;
-}
-
-type DGraphUpdate = SerializedDGraph.Graph | null;
-
-type StructureUpdates = {
-    /** Partial means that the updates are based on the previous structure state */
-    partial: boolean;
-    /** Removed roots */
-    removed: NodeID[];
-    /** Record: `rootId` -- Record of updated nodes by `nodeId` */
-    updated: Partial<Record<NodeID, Partial<Record<NodeID, Mapped.Owner>>>>;
-};
-
-type StoreNodeProperty = `${NodeID}:${string}`;
-
-type ToggleInspectedValueData = {
-    id: ValueItemID;
-    selected: boolean;
-};
-
-declare const INFINITY = "Infinity";
-declare const NEGATIVE_INFINITY = "NegativeInfinity";
-declare const NAN = "NaN";
-declare const UNDEFINED = "undefined";
-declare enum ValueType {
-    Number = "number",
-    Boolean = "boolean",
-    String = "string",
-    Null = "null",
-    Symbol = "symbol",
-    Array = "array",
-    Object = "object",
-    Function = "function",
-    Getter = "getter",
-    Element = "element",
-    Instance = "instance",
-    Store = "store",
-    Unknown = "unknown"
-}
-type EncodedValueDataMap = {
-    [ValueType.Null]: null | typeof UNDEFINED;
-    [ValueType.Array]: number | number[];
-    [ValueType.Object]: number | {
-        [key: string]: number;
-    };
-    [ValueType.Number]: number | typeof INFINITY | typeof NEGATIVE_INFINITY | typeof NAN;
-    [ValueType.Boolean]: boolean;
-    [ValueType.String]: string;
-    [ValueType.Symbol]: string;
-    [ValueType.Function]: string;
-    [ValueType.Getter]: string;
-    [ValueType.Element]: `${NodeID}:${string}`;
-    [ValueType.Instance]: string;
-    [ValueType.Store]: `${NodeID}:${number}`;
-    [ValueType.Unknown]: never;
-};
-type EncodedValueMap = {
-    [T in ValueType]: [type: T, data: EncodedValueDataMap[T]];
-};
-type EncodedValue<T extends ValueType = ValueType> = EncodedValueMap[T];
-declare enum PropGetterState {
-    /** getter is being observed, so it's value is up-to-date */
-    Live = "live",
-    /** getter is not observed, so it's value may be outdated */
-    Stale = "stale"
-}
-type InspectorUpdateMap = {
-    /** the value of a valueItem was updated */
-    value: [id: ValueItemID, value: EncodedValue[]];
-    /** a valueItem was expanded or collapsed, sends it's appropriable value */
-    inspectToggle: [id: ValueItemID, value: EncodedValue[]];
-    /** update to a store-node */
-    store: [store: StoreNodeProperty, value: EncodedValue[] | null | number];
-    /** List of new keys — all of the values are getters, so they won't change */
-    propKeys: {
-        added: string[];
-        removed: string[];
-    };
-    /** state of getter props (STALE | LIVE) */
-    propState: {
-        [key in string]: PropGetterState;
-    };
-};
-type InspectorUpdate = {
-    [T in keyof InspectorUpdateMap]: [type: T, data: InspectorUpdateMap[T]];
-}[keyof InspectorUpdateMap];
-
-type LocationAttr = `${string}:${number}:${number}`;
-type LocatorComponent = {
-    id: NodeID;
-    name: string;
-    element: HTMLElement;
-    location?: LocationAttr | undefined;
-};
-type TargetIDE = 'vscode' | 'webstorm' | 'atom' | 'vscode-insiders';
-type SourceLocation = {
-    filePath: string;
-    line: number;
-    column: number;
-};
-type SourceCodeData = SourceLocation & {
-    projectPath: string;
-    element: HTMLElement | string;
-};
-type TargetURLFunction = (data: SourceCodeData) => string | void;
-
-type NodeID = `#${string}`;
-type ValueItemID = `${ValueItemType.Signal}:${NodeID}` | `${ValueItemType.Prop}:${string}` | ValueItemType.Value;
-declare const getValueItemId: <T extends ValueItemType>(type: T, id: T extends ValueItemType.Value ? undefined : string) => ValueItemID;
-type ValueUpdateListener = (newValue: unknown, oldValue: unknown) => void;
-declare namespace Core {
-    type Owner = solid_js_types_reactive_signal.Owner;
-    type SignalState = solid_js_types_reactive_signal.SignalState<unknown>;
-    type Computation = solid_js_types_reactive_signal.Computation<unknown>;
-    type Memo = solid_js_types_reactive_signal.Memo<unknown>;
-    type RootFunction<T> = solid_js_types_reactive_signal.RootFunction<T>;
-    type EffectFunction = solid_js_types_reactive_signal.EffectFunction<unknown>;
-    type Component = solid_js_types_reactive_signal.DevComponent<{
-        [key: string]: unknown;
-    }>;
-    namespace Store {
-        type StoreNode = solid_js_store.StoreNode;
-        type NotWrappable = solid_js_store_types_store.NotWrappable;
-        type OnStoreNodeUpdate = solid_js_store_types_store.OnStoreNodeUpdate;
-    }
-}
-declare module 'solid-js/types/reactive/signal' {
-    interface SignalState<T> {
-        sdtName?: string;
-    }
-    interface Owner {
-        sdtName?: string;
-        sdtType?: NodeType;
-        sdtSubRoots?: Solid.Root[] | null;
-    }
-    interface Computation<Init, Next> {
-        sdtType?: NodeType;
-        onValueUpdate?: Record<symbol, ValueUpdateListener>;
-    }
-}
-declare namespace Solid {
-    interface SignalState {
-        graph?: Owner;
-        value: unknown;
-        observers?: Computation[] | null;
-        onValueUpdate?: Record<symbol, ValueUpdateListener>;
-    }
-    interface Signal extends Core.SignalState, SignalState {
-        graph?: Owner;
-        value: unknown;
-        observers: Computation[] | null;
-    }
-    type OnStoreNodeUpdate = Core.Store.OnStoreNodeUpdate & {
-        storePath: readonly (string | number)[];
-        storeSymbol: symbol;
-    };
-    interface Store {
-        value: Core.Store.StoreNode;
-    }
-    interface Root extends Core.Owner {
-        owned: Computation[] | null;
-        owner: Owner | null;
-        sourceMap?: Record<string, Signal | Store>;
-        isDisposed?: boolean;
-        sdtAttached?: Owner;
-        isInternal?: true;
-        value?: undefined;
-        sources?: undefined;
-        fn?: undefined;
-        state?: undefined;
-        sourceSlots?: undefined;
-        updatedAt?: undefined;
-        pure?: undefined;
-    }
-    interface Computation extends Core.Computation {
-        name: string;
-        value: unknown;
-        owned: Computation[] | null;
-        owner: Owner | null;
-        sourceMap?: Record<string, Signal>;
-        sources: Signal[] | null;
-    }
-    interface Memo extends Signal, Computation {
-        name: string;
-    }
-    interface Component extends Memo {
-        props: Record<string, unknown>;
-        componentName: string;
-        location?: LocationAttr;
-    }
-    type Owner = Computation | Root;
-}
-declare namespace Mapped {
-    interface Owner {
-        id: NodeID;
-        type: Exclude<NodeType, NodeType.Refresh | NodeType.Signal | NodeType.Store>;
-        children: Owner[];
-        name?: string;
-        hmr?: true;
-        frozen?: true;
-    }
-    interface Signal {
-        type: NodeType.Signal | NodeType.Memo | NodeType.Store;
-        name: string;
-        id: NodeID;
-        value: EncodedValue[];
-    }
-    type Props = {
-        proxy: boolean;
-        record: {
-            [key: string]: {
-                getter: false | PropGetterState;
-                value: EncodedValue[] | null;
-            };
-        };
-    };
-    interface OwnerDetails {
-        id: NodeID;
-        name: string;
-        type: NodeType;
-        props?: Props;
-        signals: Signal[];
-        /** for computations */
-        value?: EncodedValue[];
-        location?: LocationAttr;
-    }
-}
-
-type LocatorOptions = {
-    /** Choose in which IDE the component source code should be revealed. */
-    targetIDE?: false | TargetIDE | TargetURLFunction;
-    /**
-     * Holding which key should enable the locator overlay?
-     * @default 'Alt'
-     */
-    key?: false | KbdKey;
-};
-type HighlightElementPayload = ToDyscriminatedUnion<{
-    node: {
-        id: NodeID;
-    };
-    element: {
-        id: NodeID;
-    };
-}> | null;
-declare const WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
-declare const LOCATION_ATTRIBUTE_NAME = "data-source-loc";
-declare const MARK_COMPONENT = "markComponentLoc";
-declare const USE_LOCATOR = "useLocator";
-
-declare namespace Debugger {
-    type InspectedState = {
-        readonly ownerId: NodeID | null;
-        readonly signalId: NodeID | null;
-        /** closest note to inspected signal/owner on the owner structure */
-        readonly treeWalkerOwnerId: NodeID | null;
-    };
-    type OutputChannels = {
-        ResetPanel: void;
-        InspectedState: InspectedState;
-        InspectedNodeDetails: Mapped.OwnerDetails;
-        StructureUpdates: StructureUpdates;
-        NodeUpdates: NodeID[];
-        InspectorUpdate: InspectorUpdate[];
-        LocatorModeChange: boolean;
-        HoveredComponent: {
-            nodeId: NodeID;
-            state: boolean;
-        };
-        InspectedComponent: NodeID;
-        DgraphUpdate: DGraphUpdate;
-    };
-    type InputChannels = {
-        ResetState: void;
-        InspectNode: {
-            ownerId: NodeID | null;
-            signalId: NodeID | null;
-        } | null;
-        InspectValue: ToggleInspectedValueData;
-        HighlightElementChange: HighlightElementPayload;
-        OpenLocation: void;
-        TreeViewModeChange: TreeWalkerMode;
-        ViewChange: DevtoolsMainView;
-        ToggleModule: {
-            module: DebuggerModule;
-            enabled: boolean;
-        };
-    };
-}
-declare const useDebugger: () => {
-    enabled: solid_js.Accessor<boolean>;
-    toggleEnabled: (enabled: boolean) => undefined;
-    on: _solid_primitives_event_bus.EmitterOn<Debugger.OutputChannels>;
-    listen: _solid_primitives_event_bus.EmitterListen<Debugger.OutputChannels>;
-    emit: <K extends keyof Debugger.InputChannels>(event: K, ..._: void extends Debugger.InputChannels[K] ? [payload?: Debugger.InputChannels[K] | undefined] : [payload: Debugger.InputChannels[K]]) => void;
-};
-declare const useLocator: (options: LocatorOptions) => void;
-
-export { Mapped as A, Debugger as B, Core as C, DGraphUpdate as D, EncodedValueMap as E, HighlightElementPayload as H, INFINITY as I, LocationAttr as L, MARK_COMPONENT as M, NodeType as N, PropGetterState as P, Solid as S, ToggleInspectedValueData as T, UNDEFINED as U, ValueUpdateListener as V, WINDOW_PROJECTPATH_PROPERTY as W, useLocator as a, SerializedDGraph as b, StructureUpdates as c, NEGATIVE_INFINITY as d, NAN as e, ValueType as f, EncodedValue as g, InspectorUpdateMap as h, InspectorUpdate as i, LocatorOptions as j, LOCATION_ATTRIBUTE_NAME as k, USE_LOCATOR as l, LocatorComponent as m, TargetIDE as n, TargetURLFunction as o, DevtoolsMainView as p, DEFAULT_MAIN_VIEW as q, DebuggerModule as r, TreeWalkerMode as s, DEFAULT_WALKER_MODE as t, useDebugger as u, NODE_TYPE_NAMES as v, ValueItemType as w, NodeID as x, ValueItemID as y, getValueItemId as z };

dist/server.cjs

-'use strict';
-
-// src/main/constants.ts
-var DevtoolsMainView = /* @__PURE__ */ ((DevtoolsMainView2) => {
-  DevtoolsMainView2["Structure"] = "structure";
-  return DevtoolsMainView2;
-})(DevtoolsMainView || {});
-var DEFAULT_MAIN_VIEW = "structure" /* Structure */;
-var DebuggerModule = /* @__PURE__ */ ((DebuggerModule2) => {
-  DebuggerModule2["Locator"] = "locator";
-  DebuggerModule2["Structure"] = "structure";
-  DebuggerModule2["Dgraph"] = "dgraph";
-  return DebuggerModule2;
-})(DebuggerModule || {});
-var TreeWalkerMode = /* @__PURE__ */ ((TreeWalkerMode2) => {
-  TreeWalkerMode2["Owners"] = "owners";
-  TreeWalkerMode2["Components"] = "components";
-  TreeWalkerMode2["DOM"] = "dom";
-  return TreeWalkerMode2;
-})(TreeWalkerMode || {});
-var DEFAULT_WALKER_MODE = "components" /* Components */;
-var NodeType = /* @__PURE__ */ ((NodeType2) => {
-  NodeType2["Root"] = "root";
-  NodeType2["Component"] = "component";
-  NodeType2["Element"] = "element";
-  NodeType2["Effect"] = "effect";
-  NodeType2["Render"] = "render";
-  NodeType2["Memo"] = "memo";
-  NodeType2["Computation"] = "computation";
-  NodeType2["Refresh"] = "refresh";
-  NodeType2["Context"] = "context";
-  NodeType2["Signal"] = "signal";
-  NodeType2["Store"] = "store";
-  return NodeType2;
-})(NodeType || {});
-var NODE_TYPE_NAMES = {
-  ["root" /* Root */]: "Root",
-  ["component" /* Component */]: "Component",
-  ["element" /* Element */]: "Element",
-  ["effect" /* Effect */]: "Effect",
-  ["render" /* Render */]: "Render Effect",
-  ["memo" /* Memo */]: "Memo",
-  ["computation" /* Computation */]: "Computation",
-  ["refresh" /* Refresh */]: "Refresh",
-  ["context" /* Context */]: "Context",
-  ["signal" /* Signal */]: "Signal",
-  ["store" /* Store */]: "Store"
-};
-var ValueItemType = /* @__PURE__ */ ((ValueItemType2) => {
-  ValueItemType2["Signal"] = "signal";
-  ValueItemType2["Prop"] = "prop";
-  ValueItemType2["Value"] = "value";
-  return ValueItemType2;
-})(ValueItemType || {});
-
-// src/inspector/types.ts
-var INFINITY = "Infinity";
-var NEGATIVE_INFINITY = "NegativeInfinity";
-var NAN = "NaN";
-var UNDEFINED = "undefined";
-var ValueType = /* @__PURE__ */ ((ValueType2) => {
-  ValueType2["Number"] = "number";
-  ValueType2["Boolean"] = "boolean";
-  ValueType2["String"] = "string";
-  ValueType2["Null"] = "null";
-  ValueType2["Symbol"] = "symbol";
-  ValueType2["Array"] = "array";
-  ValueType2["Object"] = "object";
-  ValueType2["Function"] = "function";
-  ValueType2["Getter"] = "getter";
-  ValueType2["Element"] = "element";
-  ValueType2["Instance"] = "instance";
-  ValueType2["Store"] = "store";
-  ValueType2["Unknown"] = "unknown";
-  return ValueType2;
-})(ValueType || {});
-var PropGetterState = /* @__PURE__ */ ((PropGetterState2) => {
-  PropGetterState2["Live"] = "live";
-  PropGetterState2["Stale"] = "stale";
-  return PropGetterState2;
-})(PropGetterState || {});
-
-// src/locator/types.ts
-var WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
-var LOCATION_ATTRIBUTE_NAME = "data-source-loc";
-var MARK_COMPONENT = `markComponentLoc`;
-var USE_LOCATOR = `useLocator`;
-
-// src/main/types.ts
-var getValueItemId = (type, id) => {
-  if (type === "value" /* Value */)
-    return "value" /* Value */;
-  return `${type}:${id}`;
-};
-
-// src/server.ts
-var Debugger = (props) => props.children;
-var attachDebugger = () => void 0;
-var useDebugger = () => new Proxy(
-  {},
-  {
-    get() {
-      throw new Error("Debugger is not available in production/server environment.");
-    }
-  }
-);
-var enableRootsAutoattach = () => void 0;
-var useLocator = () => void 0;
-var unobserveAllRoots = () => void 0;
-var makeSolidUpdateListener = () => () => void 0;
-var interceptComputationRerun = () => void 0;
-var observeValueUpdate = () => void 0;
-var makeValueUpdateListener = () => void 0;
-var removeValueUpdateObserver = () => void 0;
-var markComponentLoc = () => void 0;
-var getOwner = () => null;
-var getOwnerType = () => "computation" /* Computation */;
-var getNodeType = () => "computation" /* Computation */;
-var getNodeName = () => "(unnamed)";
-var isSolidComputation = (o) => false;
-var isSolidMemo = (o) => false;
-var isSolidOwner = (o) => false;
-var isSolidRoot = (o) => false;
-var isSolidStore = (o) => false;
-var onOwnerCleanup = () => () => void 0;
-var onParentCleanup = () => () => void 0;
-var getFunctionSources = () => [];
-var createInternalRoot = (fn) => fn(() => {
-});
-var lookupOwner = () => null;
-
-exports.DEFAULT_MAIN_VIEW = DEFAULT_MAIN_VIEW;
-exports.DEFAULT_WALKER_MODE = DEFAULT_WALKER_MODE;
-exports.Debugger = Debugger;
-exports.DebuggerModule = DebuggerModule;
-exports.DevtoolsMainView = DevtoolsMainView;
-exports.INFINITY = INFINITY;
-exports.LOCATION_ATTRIBUTE_NAME = LOCATION_ATTRIBUTE_NAME;
-exports.MARK_COMPONENT = MARK_COMPONENT;
-exports.NAN = NAN;
-exports.NEGATIVE_INFINITY = NEGATIVE_INFINITY;
-exports.NODE_TYPE_NAMES = NODE_TYPE_NAMES;
-exports.NodeType = NodeType;
-exports.PropGetterState = PropGetterState;
-exports.TreeWalkerMode = TreeWalkerMode;
-exports.UNDEFINED = UNDEFINED;
-exports.USE_LOCATOR = USE_LOCATOR;
-exports.ValueItemType = ValueItemType;
-exports.ValueType = ValueType;
-exports.WINDOW_PROJECTPATH_PROPERTY = WINDOW_PROJECTPATH_PROPERTY;
-exports.attachDebugger = attachDebugger;
-exports.createInternalRoot = createInternalRoot;
-exports.enableRootsAutoattach = enableRootsAutoattach;
-exports.getFunctionSources = getFunctionSources;
-exports.getNodeName = getNodeName;
-exports.getNodeType = getNodeType;
-exports.getOwner = getOwner;
-exports.getOwnerType = getOwnerType;
-exports.getValueItemId = getValueItemId;
-exports.interceptComputationRerun = interceptComputationRerun;
-exports.isSolidComputation = isSolidComputation;
-exports.isSolidMemo = isSolidMemo;
-exports.isSolidOwner = isSolidOwner;
-exports.isSolidRoot = isSolidRoot;
-exports.isSolidStore = isSolidStore;
-exports.lookupOwner = lookupOwner;
-exports.makeSolidUpdateListener = makeSolidUpdateListener;
-exports.makeValueUpdateListener = makeValueUpdateListener;
-exports.markComponentLoc = markComponentLoc;
-exports.observeValueUpdate = observeValueUpdate;
-exports.onOwnerCleanup = onOwnerCleanup;
-exports.onParentCleanup = onParentCleanup;
-exports.removeValueUpdateObserver = removeValueUpdateObserver;
-exports.unobserveAllRoots = unobserveAllRoots;
-exports.useDebugger = useDebugger;
-exports.useLocator = useLocator;

dist/server.js

-export { DEFAULT_MAIN_VIEW, DEFAULT_WALKER_MODE, DebuggerModule, DevtoolsMainView, INFINITY, LOCATION_ATTRIBUTE_NAME, MARK_COMPONENT, NAN, NEGATIVE_INFINITY, NODE_TYPE_NAMES, NodeType, PropGetterState, TreeWalkerMode, UNDEFINED, USE_LOCATOR, ValueItemType, ValueType, WINDOW_PROJECTPATH_PROPERTY, getValueItemId } from './chunk-4JABOMAE.js';
-
-// src/server.ts
-var Debugger = (props) => props.children;
-var attachDebugger = () => void 0;
-var useDebugger = () => new Proxy(
-  {},
-  {
-    get() {
-      throw new Error("Debugger is not available in production/server environment.");
-    }
-  }
-);
-var enableRootsAutoattach = () => void 0;
-var useLocator = () => void 0;
-var unobserveAllRoots = () => void 0;
-var makeSolidUpdateListener = () => () => void 0;
-var interceptComputationRerun = () => void 0;
-var observeValueUpdate = () => void 0;
-var makeValueUpdateListener = () => void 0;
-var removeValueUpdateObserver = () => void 0;
-var markComponentLoc = () => void 0;
-var getOwner = () => null;
-var getOwnerType = () => "computation" /* Computation */;
-var getNodeType = () => "computation" /* Computation */;
-var getNodeName = () => "(unnamed)";
-var isSolidComputation = (o) => false;
-var isSolidMemo = (o) => false;
-var isSolidOwner = (o) => false;
-var isSolidRoot = (o) => false;
-var isSolidStore = (o) => false;
-var onOwnerCleanup = () => () => void 0;
-var onParentCleanup = () => () => void 0;
-var getFunctionSources = () => [];
-var createInternalRoot = (fn) => fn(() => {
-});
-var lookupOwner = () => null;
-
-export { Debugger, attachDebugger, createInternalRoot, enableRootsAutoattach, getFunctionSources, getNodeName, getNodeType, getOwner, getOwnerType, interceptComputationRerun, isSolidComputation, isSolidMemo, isSolidOwner, isSolidRoot, isSolidStore, lookupOwner, makeSolidUpdateListener, makeValueUpdateListener, markComponentLoc, observeValueUpdate, onOwnerCleanup, onParentCleanup, removeValueUpdateObserver, unobserveAllRoots, useDebugger, useLocator };

dist/types.cjs

-'use strict';
-
-// src/inspector/types.ts
-var INFINITY = "Infinity";
-var NEGATIVE_INFINITY = "NegativeInfinity";
-var NAN = "NaN";
-var UNDEFINED = "undefined";
-var ValueType = /* @__PURE__ */ ((ValueType2) => {
-  ValueType2["Number"] = "number";
-  ValueType2["Boolean"] = "boolean";
-  ValueType2["String"] = "string";
-  ValueType2["Null"] = "null";
-  ValueType2["Symbol"] = "symbol";
-  ValueType2["Array"] = "array";
-  ValueType2["Object"] = "object";
-  ValueType2["Function"] = "function";
-  ValueType2["Getter"] = "getter";
-  ValueType2["Element"] = "element";
-  ValueType2["Instance"] = "instance";
-  ValueType2["Store"] = "store";
-  ValueType2["Unknown"] = "unknown";
-  return ValueType2;
-})(ValueType || {});
-var PropGetterState = /* @__PURE__ */ ((PropGetterState2) => {
-  PropGetterState2["Live"] = "live";
-  PropGetterState2["Stale"] = "stale";
-  return PropGetterState2;
-})(PropGetterState || {});
-
-// src/locator/types.ts
-var WINDOW_PROJECTPATH_PROPERTY = "$sdt_projectPath";
-var LOCATION_ATTRIBUTE_NAME = "data-source-loc";
-var MARK_COMPONENT = `markComponentLoc`;
-var USE_LOCATOR = `useLocator`;
-
-// src/main/constants.ts
-var DevtoolsMainView = /* @__PURE__ */ ((DevtoolsMainView2) => {
-  DevtoolsMainView2["Structure"] = "structure";
-  return DevtoolsMainView2;
-})(DevtoolsMainView || {});
-var DEFAULT_MAIN_VIEW = "structure" /* Structure */;
-var DebuggerModule = /* @__PURE__ */ ((DebuggerModule2) => {
-  DebuggerModule2["Locator"] = "locator";
-  DebuggerModule2["Structure"] = "structure";
-  DebuggerModule2["Dgraph"] = "dgraph";
-  return DebuggerModule2;
-})(DebuggerModule || {});
-var TreeWalkerMode = /* @__PURE__ */ ((TreeWalkerMode2) => {
-  TreeWalkerMode2["Owners"] = "owners";
-  TreeWalkerMode2["Components"] = "components";
-  TreeWalkerMode2["DOM"] = "dom";
-  return TreeWalkerMode2;
-})(TreeWalkerMode || {});
-var DEFAULT_WALKER_MODE = "components" /* Components */;
-var NodeType = /* @__PURE__ */ ((NodeType2) => {
-  NodeType2["Root"] = "root";
-  NodeType2["Component"] = "component";
-  NodeType2["Element"] = "element";
-  NodeType2["Effect"] = "effect";
-  NodeType2["Render"] = "render";
-  NodeType2["Memo"] = "memo";
-  NodeType2["Computation"] = "computation";
-  NodeType2["Refresh"] = "refresh";
-  NodeType2["Context"] = "context";
-  NodeType2["Signal"] = "signal";
-  NodeType2["Store"] = "store";
-  return NodeType2;
-})(NodeType || {});
-var NODE_TYPE_NAMES = {
-  ["root" /* Root */]: "Root",
-  ["component" /* Component */]: "Component",
-  ["element" /* Element */]: "Element",
-  ["effect" /* Effect */]: "Effect",
-  ["render" /* Render */]: "Render Effect",
-  ["memo" /* Memo */]: "Memo",
-  ["computation" /* Computation */]: "Computation",
-  ["refresh" /* Refresh */]: "Refresh",
-  ["context" /* Context */]: "Context",
-  ["signal" /* Signal */]: "Signal",
-  ["store" /* Store */]: "Store"
-};
-var ValueItemType = /* @__PURE__ */ ((ValueItemType2) => {
-  ValueItemType2["Signal"] = "signal";
-  ValueItemType2["Prop"] = "prop";
-  ValueItemType2["Value"] = "value";
-  return ValueItemType2;
-})(ValueItemType || {});
-
-// src/main/types.ts
-var getValueItemId = (type, id) => {
-  if (type === "value" /* Value */)
-    return "value" /* Value */;
-  return `${type}:${id}`;
-};
-
-exports.DEFAULT_MAIN_VIEW = DEFAULT_MAIN_VIEW;
-exports.DEFAULT_WALKER_MODE = DEFAULT_WALKER_MODE;
-exports.DebuggerModule = DebuggerModule;
-exports.DevtoolsMainView = DevtoolsMainView;
-exports.INFINITY = INFINITY;
-exports.LOCATION_ATTRIBUTE_NAME = LOCATION_ATTRIBUTE_NAME;
-exports.MARK_COMPONENT = MARK_COMPONENT;
-exports.NAN = NAN;
-exports.NEGATIVE_INFINITY = NEGATIVE_INFINITY;
-exports.NODE_TYPE_NAMES = NODE_TYPE_NAMES;
-exports.NodeType = NodeType;
-exports.PropGetterState = PropGetterState;
-exports.TreeWalkerMode = TreeWalkerMode;
-exports.UNDEFINED = UNDEFINED;
-exports.USE_LOCATOR = USE_LOCATOR;
-exports.ValueItemType = ValueItemType;
-exports.ValueType = ValueType;
-exports.WINDOW_PROJECTPATH_PROPERTY = WINDOW_PROJECTPATH_PROPERTY;
-exports.getValueItemId = getValueItemId;

New alerts

Deprecated

Maintenance

The maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Improved metrics

Total package byte prevSize

258329

48.67%

Lines of code

7682

59.48%

Worsened metrics

Dependency count

13

18.18%

Number of medium maintenance alerts

1

Infinity%

Number of lines in readme file

136

-28.8%

Number of low supply chain risk alerts

4

100%

Number of medium supply chain risk alerts

1

Infinity%

Dependency changes

• + Added

  @solid-primitives/static-store@^0.0.2

• + Added

  solid-js@^1.7.5

• + Added

  @solid-devtools/shared@0.12.3
  (transitive)

• + Added

  @solid-primitives/bounds@0.0.111
  (transitive)

• + Added

  @solid-primitives/cursor@0.0.109
  (transitive)

• + Added

  @solid-primitives/platform@0.0.105
  (transitive)

• + Added

  @solid-primitives/refs@1.1.4
  (transitive)

• + Added

  @solid-primitives/static-store@0.0.20.0.4
  (transitive)

• + Added

  @solid-primitives/styles@0.0.110
  (transitive)

• - Removed

  @solid-devtools/shared@0.11.1
  (transitive)

• - Removed

  @solid-primitives/bounds@0.0.107
  (transitive)

• - Removed

  @solid-primitives/cursor@0.0.105
  (transitive)

• - Removed

  @solid-primitives/immutable@0.1.10
  (transitive)

• - Removed

  @solid-primitives/platform@0.0.103
  (transitive)

• - Removed

  @solid-primitives/refs@0.3.7
  (transitive)

• - Removed

  @solid-primitives/styles@0.0.102
  (transitive)

• - Removed

  @solid-primitives/utils@5.5.2
  (transitive)

• Updated

  @solid-devtools/shared@^0.12.0-next.0

• Updated

  @solid-primitives/bounds@^0.0.111

• Updated

  @solid-primitives/cursor@^0.0.109

• Updated

  @solid-primitives/event-bus@^1.0.7

• Updated

  @solid-primitives/event-listener@^2.2.13

• Updated

  @solid-primitives/keyboard@^1.2.3

• Updated

  @solid-primitives/platform@^0.0.105

• Updated

  @solid-primitives/scheduled@^1.3.2

• Updated

  @solid-primitives/utils@^6.2.0

• Updated

  type-fest@^3.11.0