react-state-basis 0.4.2 → 0.5.1

package/dist/index.js

@@ -33,12 +33,14 @@ __export(index_exports, {
   BasisProvider: () => BasisProvider,
   basis: () => basis,
   configureBasis: () => configureBasis,
+  createContext: () => createContext,
   getBasisMetrics: () => getBasisMetrics,
   printBasisHealthReport: () => printBasisHealthReport,
   use: () => use,
-  useActionState: () => useActionState2,
+  useActionState: () => useActionState,
   useBasisConfig: () => useBasisConfig,
   useCallback: () => useCallback,
+  useContext: () => useContext,
   useDebugValue: () => useDebugValue2,
   useDeferredValue: () => useDeferredValue,
   useEffect: () => useEffect,
@@ -47,7 +49,7 @@ __export(index_exports, {
   useInsertionEffect: () => useInsertionEffect2,
   useLayoutEffect: () => useLayoutEffect,
   useMemo: () => useMemo,
-  useOptimistic: () => useOptimistic2,
+  useOptimistic: () => useOptimistic,
   useReducer: () => useReducer,
   useRef: () => useRef,
   useState: () => useState,
@@ -63,15 +65,14 @@ var import_react = require("react");
 // src/core/math.ts
 var calculateSimilarityCircular = (bufferA, headA, bufferB, headB, offset) => {
   const L = bufferA.length;
-  let dot = 0;
-  let magA = 0;
-  let magB = 0;
-  const headOffset = headB - headA + offset;
+  let dot = 0, magA = 0, magB = 0;
+  const baseOffset = ((headB - headA + offset) % L + L) % L;
   for (let i = 0; i < L; i++) {
     const valA = bufferA[i];
-    let iB = i + headOffset;
-    if (iB < 0) iB += L;
-    else if (iB >= L) iB -= L;
+    let iB = i + baseOffset;
+    if (iB >= L) {
+      iB -= L;
+    }
     const valB = bufferB[iB];
     dot += valA * valB;
     magA += valA * valA;
@@ -93,7 +94,7 @@ var calculateCosineSimilarity = (A, B) => {
 // src/core/logger.ts
 var isWeb = typeof window !== "undefined" && typeof window.document !== "undefined";
 var LAST_LOG_TIMES = /* @__PURE__ */ new Map();
-var LOG_COOLDOWN = 5e3;
+var LOG_COOLDOWN = 3e3;
 var STYLES = {
   basis: "background: #6c5ce7; color: white; font-weight: bold; padding: 2px 6px; border-radius: 3px;",
   version: "background: #a29bfe; color: #2d3436; padding: 2px 6px; border-radius: 3px; margin-left: -4px;",
@@ -102,11 +103,10 @@ var STYLES = {
   headerGreen: "background: #00b894; color: white; font-weight: bold; padding: 4px 8px; border-radius: 4px;",
   label: "background: #dfe6e9; color: #2d3436; padding: 0 4px; border-radius: 3px; font-family: monospace; font-weight: bold; border: 1px solid #b2bec3;",
   location: "color: #0984e3; font-family: monospace; font-weight: bold;",
-  impact: "background: #f1f2f6; color: #2f3542; padding: 0 4px; border-radius: 3px; font-weight: bold;",
   subText: "color: #636e72; font-size: 11px;",
   bold: "font-weight: bold;",
-  actionMemo: "color: #00b894; font-weight: bold; border: 1px solid #00b894; padding: 0 4px; border-radius: 3px;",
-  actionDelete: "color: #d63031; font-weight: bold; border: 1px solid #d63031; padding: 0 4px; border-radius: 3px;"
+  action: "color: #00b894; font-weight: bold; border: 1px solid #00b894; padding: 0 4px; border-radius: 3px;",
+  warning: "color: #d63031; font-weight: bold; border: 1px solid #d63031; padding: 0 4px; border-radius: 3px;"
 };
 var parseLabel = (label) => {
   const parts = label.split(" -> ");
@@ -117,129 +117,58 @@ var shouldLog = (key) => {
   const last = LAST_LOG_TIMES.get(key) || 0;
   if (now - last > LOG_COOLDOWN) {
     LAST_LOG_TIMES.set(key, now);
-    if (LAST_LOG_TIMES.size > 100) {
-      const cutoff = now - 36e5;
-      for (const [k, v] of LAST_LOG_TIMES.entries()) {
-        if (v < cutoff) LAST_LOG_TIMES.delete(k);
-      }
-    }
     return true;
   }
   return false;
 };
-var displayBootLog = (windowSize) => {
-  if (!isWeb) return;
-  console.log(
-    `%cBasis%cAuditor%c | Temporal Analysis Active (Window: ${windowSize})`,
-    STYLES.basis,
-    STYLES.version,
-    "color: #636e72; font-style: italic; margin-left: 8px;"
-  );
-};
-var displayRedundancyAlert = (labelA, labelB, sim) => {
+var displayRedundancyAlert = (labelA, metaA, labelB, metaB, sim) => {
   if (!isWeb || !shouldLog(`redundant-${labelA}-${labelB}`)) return;
   const infoA = parseLabel(labelA);
   const infoB = parseLabel(labelB);
-  console.group(`%c \u264A BASIS | TWIN STATE DETECTED `, STYLES.headerRed);
+  const isContextMirror = metaA.role === "local" && metaB.role === "context" || metaB.role === "local" && metaA.role === "context";
+  const local = metaA.role === "local" ? infoA : infoB;
+  const context = metaA.role === "context" ? infoA : infoB;
+  console.group(`%c \u264A BASIS | ${isContextMirror ? "CONTEXT MIRRORING" : "DUPLICATE STATE"} `, STYLES.headerRed);
   console.log(`%c\u{1F4CD} Location: %c${infoA.file}`, STYLES.bold, STYLES.location);
-  console.log(
-    `%cThe Rhythm:%c %c${infoA.name}%c and %c${infoB.name}%c are moving in perfect sync.
-%cThis indicates that one is a redundant shadow of the other. Confidence: ${(sim * 100).toFixed(0)}%`,
-    STYLES.bold,
-    "",
-    STYLES.label,
-    "",
-    STYLES.label,
-    "",
-    STYLES.subText
-  );
-  console.log(
-    `%cRecommended Fix:%c Derive %c${infoB.name}%c from %c${infoA.name}%c during the render pass.`,
-    STYLES.bold,
-    "",
-    STYLES.actionMemo,
-    "",
-    STYLES.bold,
-    ""
-  );
-  console.groupEnd();
-};
-var displayCausalHint = (targetLabel, sourceLabel, method = "math") => {
-  const key = `causal-${sourceLabel}-${targetLabel}`;
-  if (!isWeb || !shouldLog(key)) return;
-  const target = parseLabel(targetLabel);
-  const source = parseLabel(sourceLabel);
-  console.groupCollapsed(
-    `%c \u26A1 BASIS | DOUBLE RENDER CYCLE `,
-    STYLES.headerBlue
-  );
-  console.log(`%c\u{1F4CD} Location: %c${target.file}`, STYLES.bold, STYLES.location);
-  console.log(
-    `%cThe Rhythm:%c %c${source.name}%c pulses, then %c${target.name}%c pulses one frame later.`,
-    STYLES.bold,
-    "",
-    STYLES.label,
-    "",
-    STYLES.label,
-    ""
-  );
-  console.log(
-    `%cThe Impact:%c You are forcing %c2 render passes%c for a single logical change.`,
-    STYLES.bold,
-    "",
-    STYLES.impact,
-    ""
-  );
-  console.log(
-    `%cRecommended Fix:%c Remove the useEffect. Calculate %c${target.name}%c as a derived value or projection.`,
-    STYLES.bold,
-    "",
-    STYLES.actionDelete,
-    ""
-  );
-  console.groupEnd();
-};
-var displayViolentBreaker = (label, count, threshold) => {
-  if (!isWeb) return;
-  const parts = label.split(" -> ");
-  console.group(
-    `%c \u26A0\uFE0F  CRITICAL SYSTEM ALERT | BASIS ENGINE `,
-    "background: #dc2626; color: white; font-weight: bold; padding: 8px 16px; font-size: 14px;"
-  );
-  console.error(
-    `%c\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501`,
-    "color: #dc2626; font-weight: bold;"
-  );
-  console.error(
-    `%cINFINITE LOOP DETECTED
-
-%cVariable: %c${parts[1] || label}
-%cUpdate Frequency: %c${count} updates/sec
-%cExpected Maximum: %c${threshold} updates
-
-%c\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501\u2501`,
-    "color: #dc2626; font-size: 16px; font-weight: bold;",
-    "color: #71717a; font-weight: bold;",
-    `color: white; background: #dc2626; padding: 2px 8px;`,
-    "color: #71717a; font-weight: bold;",
-    `color: #fbbf24; font-weight: bold;`,
-    "color: #71717a; font-weight: bold;",
-    `color: #fbbf24; font-weight: bold;`,
-    "color: #dc2626; font-weight: bold;"
-  );
-  console.log(
-    `%cDIAGNOSTICS:
-1. Check for setState inside the render body.
-2. Verify useEffect dependencies (missing or unstable refs).
-3. Look for circular chains (State A -> B -> A).
-
-%cSYSTEM ACTION: Update BLOCKED. Fix your code to resume monitoring.`,
-    "color: #71717a;",
-    "color: #dc2626; font-weight: bold;"
-  );
+  if (isContextMirror) {
+    console.log(
+      `%cIssue:%c Local variable %c${local.name}%c is just a copy of Global Context %c${context.name}%c.
+%cConfidence: ${(sim * 100).toFixed(0)}%`,
+      STYLES.bold,
+      "",
+      STYLES.label,
+      "",
+      STYLES.label,
+      "",
+      STYLES.subText
+    );
+    console.log(`%cFix:%c Use the context value directly to avoid state drift.`, STYLES.bold, STYLES.warning);
+  } else {
+    console.log(
+      `%cIssue:%c %c${infoA.name}%c and %c${infoB.name}%c are synchronized (${(sim * 100).toFixed(0)}% correlation).`,
+      STYLES.bold,
+      "",
+      STYLES.label,
+      "",
+      STYLES.label,
+      ""
+    );
+    console.log(
+      `%cFix:%c Merge states or calculate %c${infoB.name}%c from %c${infoA.name}%c via %cuseMemo%c.`,
+      STYLES.bold,
+      "",
+      STYLES.label,
+      "",
+      STYLES.label,
+      "",
+      STYLES.action,
+      ""
+    );
+  }
   console.groupEnd();
 };
 var displayHealthReport = (history2, threshold) => {
+  if (!isWeb) return;
   const entries = Array.from(history2.entries());
   const totalVars = entries.length;
   if (totalVars === 0) return;
@@ -254,6 +183,7 @@ var displayHealthReport = (history2, threshold) => {
       if (labelA === labelB || processed.has(labelB)) return;
       const sim = calculateCosineSimilarity(metaA.buffer, metaB.buffer);
       if (sim > threshold) {
+        if (metaA.role === "context" && metaB.role === "context") return;
         currentCluster.push(labelB);
         processed.add(labelB);
       }
@@ -263,52 +193,141 @@ var displayHealthReport = (history2, threshold) => {
   });
   const systemRank = independentCount + clusters.length;
   const healthScore = systemRank / totalVars * 100;
-  if (isWeb) {
-    console.group(`%c \u{1F4CA} BASIS | ARCHITECTURAL HEALTH REPORT `, STYLES.headerGreen);
-    console.log(
-      `%cSystem Efficiency: %c${healthScore.toFixed(1)}% %c(Basis Vectors: ${systemRank} / Total Hooks: ${totalVars})`,
-      STYLES.bold,
-      `color: ${healthScore > 85 ? "#00b894" : "#d63031"}; font-size: 16px; font-weight: bold;`,
-      "color: #636e72; font-style: italic;"
-    );
-    if (clusters.length > 0) {
-      console.log(`%cDetected ${clusters.length} Entangled Clusters:`, "font-weight: bold; color: #e17055; margin-top: 10px;");
-      clusters.forEach((cluster, idx) => {
-        const names = cluster.map((l) => parseLabel(l).name).join(" \u27F7 ");
-        console.log(` %c${idx + 1}%c ${names}`, "background: #e17055; color: white; border-radius: 50%; padding: 0 5px;", "font-family: monospace;");
-      });
-      console.log("%c\u{1F4A1} Analysis: These variables are mirrored. Storing them separately creates unnecessary work for React.", STYLES.subText);
-    } else {
-      console.log("%c\u2728 All state variables are independent. Your architectural Basis is healthy.", "color: #00b894; font-weight: bold; margin-top: 10px;");
-    }
-    if (totalVars > 0 && totalVars < 20) {
-      console.groupCollapsed("%cView Full Correlation Matrix", "color: #636e72; font-size: 11px;");
-      const matrix = {};
-      entries.forEach(([labelA, metaA]) => {
-        const nameA = parseLabel(labelA).name;
-        matrix[nameA] = {};
-        entries.forEach(([labelB, metaB]) => {
-          const nameB = parseLabel(labelB).name;
-          const sim = calculateCosineSimilarity(metaA.buffer, metaB.buffer);
-          matrix[nameA][nameB] = sim > threshold ? `\u274C ${(sim * 100).toFixed(0)}%` : `\u2705`;
-        });
-      });
-      console.table(matrix);
+  console.group(`%c \u{1F4CA} BASIS | ARCHITECTURAL HEALTH REPORT `, STYLES.headerGreen);
+  console.log(
+    `%cEfficiency: %c${healthScore.toFixed(1)}% %c(${systemRank}/${totalVars} Sources of Truth)`,
+    STYLES.bold,
+    `color: ${healthScore > 85 ? "#00b894" : "#d63031"}; font-weight: bold;`,
+    STYLES.subText
+  );
+  if (clusters.length > 0) {
+    console.log(`%cDetected ${clusters.length} Sync Issues:`, "font-weight: bold; color: #e17055; margin-top: 10px;");
+    clusters.forEach((cluster, idx) => {
+      const clusterMetas = cluster.map((l) => ({ label: l, meta: history2.get(l), info: parseLabel(l) }));
+      const contexts = clusterMetas.filter((c) => c.meta.role === "context");
+      const locals = clusterMetas.filter((c) => c.meta.role === "local");
+      const names = clusterMetas.map((c) => `${c.meta.role === "context" ? "\u03A9 " : ""}${c.info.name}`).join(" \u27F7 ");
+      console.group(` %c${idx + 1}%c ${names}`, "background: #e17055; color: white; border-radius: 50%; padding: 0 5px;", "font-family: monospace; font-weight: bold;");
+      if (contexts.length > 0) {
+        const ctxNames = contexts.map((c) => c.info.name).join(", ");
+        console.log(`%cDiagnosis:%c Context Mirroring. Variables are copying from %c${ctxNames}%c.`, STYLES.bold, "", STYLES.label, "");
+        console.log(`%cSolution:%c Use the context directly to avoid state drift.`, STYLES.bold, STYLES.action);
+      } else {
+        const isExplosion = locals.length > 2;
+        if (isExplosion) {
+          console.log(`%cDiagnosis:%c Boolean Explosion. Multiple states updating in sync.`, STYLES.bold, "");
+          console.log(`%cSolution:%c Combine into a single %cstatus%c string or a %creducer%c.`, STYLES.bold, "", STYLES.label, "", STYLES.label, "");
+        } else {
+          console.log(`%cDiagnosis:%c Redundant State. Variables always change together.`, STYLES.bold, "");
+          console.log(`%cSolution:%c Derive one from the other via %cuseMemo%c.`, STYLES.bold, "", STYLES.label, "");
+        }
+      }
       console.groupEnd();
-    }
-    console.groupEnd();
+    });
+  } else {
+    console.log("%c\u2728 Your architecture is clean. No redundant state detected.", "color: #00b894; font-weight: bold;");
+  }
+  console.groupEnd();
+};
+var displayCausalHint = (targetLabel, targetMeta, sourceLabel, sourceMeta) => {
+  if (!isWeb || !shouldLog(`causal-${sourceLabel}-${targetLabel}`)) return;
+  const target = parseLabel(targetLabel);
+  const source = parseLabel(sourceLabel);
+  const isContextTrigger = sourceMeta.role === "context";
+  console.groupCollapsed(`%c \u26A1 BASIS | ${isContextTrigger ? "CONTEXT SYNC LEAK" : "DOUBLE RENDER"} `, STYLES.headerBlue);
+  console.log(`%c\u{1F4CD} Location: %c${target.file}`, STYLES.bold, STYLES.location);
+  if (isContextTrigger) {
+    console.log(`%cIssue:%c Context %c${source.name}%c updated, then local %c${target.name}%c followed 1 frame later.`, STYLES.bold, "", STYLES.label, "", STYLES.label, "");
+    console.log(`%cImpact: This forces React to render the component twice for every change.`, STYLES.subText);
+  } else {
+    console.log(`%cIssue:%c %c${source.name}%c triggers %c${target.name}%c in a separate frame.`, STYLES.bold, "", STYLES.label, "", STYLES.label, "");
   }
+  console.log(`%cFix:%c Derive %c${target.name}%c during the first render.`, STYLES.bold, STYLES.action, STYLES.label, "");
+  console.groupEnd();
+};
+var displayViolentBreaker = (label, count, threshold) => {
+  if (!isWeb) return;
+  const parts = label.split(" -> ");
+  console.group(`%c \u{1F6D1} BASIS CRITICAL | CIRCUIT BREAKER `, "background: #dc2626; color: white; font-weight: bold; padding: 8px 16px;");
+  console.error(`INFINITE LOOP DETECTED
+Variable: ${parts[1] || label}
+Frequency: ${count} updates/sec`);
+  console.log(`%cACTION: Update BLOCKED to prevent browser freeze.`, "color: #dc2626; font-weight: bold;");
+  console.groupEnd();
+};
+var displayBootLog = (windowSize) => {
+  if (!isWeb) return;
+  console.log(`%cBasis%cAuditor%c | v0.5.x Architectural Forensics Active (Window: ${windowSize})`, STYLES.basis, STYLES.version, "color: #636e72; font-style: italic; margin-left: 8px;");
 };
 
 // src/core/constants.ts
 var WINDOW_SIZE = 50;
 var SIMILARITY_THRESHOLD = 0.88;
 var LOOP_THRESHOLD = 150;
-var ANALYSIS_INTERVAL = 5;
 var VOLATILITY_THRESHOLD = 25;
 
+// src/core/analysis.ts
+var calculateAllSimilarities = (entryA, entryB) => {
+  const sync = calculateSimilarityCircular(entryA.meta.buffer, entryA.meta.head, entryB.meta.buffer, entryB.meta.head, 0);
+  const bA = calculateSimilarityCircular(entryA.meta.buffer, entryA.meta.head, entryB.meta.buffer, entryB.meta.head, 1);
+  const aB = calculateSimilarityCircular(entryA.meta.buffer, entryA.meta.head, entryB.meta.buffer, entryB.meta.head, -1);
+  return { sync, bA, aB, max: Math.max(sync, bA, aB) };
+};
+var shouldSkipComparison = (entryA, entryB, dirtyLabels2) => {
+  if (entryA.label === entryB.label) return true;
+  if (dirtyLabels2.has(entryB.label) && entryA.label > entryB.label) return true;
+  return false;
+};
+var detectRedundancy = (entryA, entryB, similarities, redundantSet) => {
+  const roleA = entryA.meta.role;
+  const roleB = entryB.meta.role;
+  if (roleA === "context" /* CONTEXT */ && roleB === "context" /* CONTEXT */) return;
+  if (entryA.meta.density < 2 || entryB.meta.density < 2) return;
+  if (roleA === "local" /* LOCAL */ && roleB === "context" /* CONTEXT */) {
+    redundantSet.add(entryA.label);
+    displayRedundancyAlert(entryA.label, entryA.meta, entryB.label, entryB.meta, similarities.max);
+  } else if (roleA === "context" /* CONTEXT */ && roleB === "local" /* LOCAL */) {
+    redundantSet.add(entryB.label);
+    displayRedundancyAlert(entryB.label, entryB.meta, entryA.label, entryA.meta, similarities.max);
+  } else if (roleA === "local" /* LOCAL */ && roleB === "local" /* LOCAL */) {
+    redundantSet.add(entryA.label);
+    redundantSet.add(entryB.label);
+    displayRedundancyAlert(entryA.label, entryA.meta, entryB.label, entryB.meta, similarities.max);
+  }
+};
+var detectCausalLeak = (entryA, entryB, similarities) => {
+  if (entryA.isVolatile || entryB.isVolatile) return;
+  if (similarities.bA === similarities.max) {
+    displayCausalHint(entryB.label, entryB.meta, entryA.label, entryA.meta);
+  } else if (similarities.aB === similarities.max) {
+    displayCausalHint(entryA.label, entryA.meta, entryB.label, entryB.meta);
+  }
+};
+var detectSubspaceOverlap = (dirtyEntries, allEntries, redundantSet, dirtyLabels2) => {
+  let compCount = 0;
+  for (const entryA of dirtyEntries) {
+    for (const entryB of allEntries) {
+      if (shouldSkipComparison(entryA, entryB, dirtyLabels2)) continue;
+      compCount++;
+      const similarities = calculateAllSimilarities(entryA, entryB);
+      if (similarities.max > SIMILARITY_THRESHOLD) {
+        detectRedundancy(entryA, entryB, similarities, redundantSet);
+        detectCausalLeak(entryA, entryB, similarities);
+      }
+    }
+  }
+  return compCount;
+};
+
 // src/engine.ts
 var BASIS_INSTANCE_KEY = /* @__PURE__ */ Symbol.for("__basis_engine_instance__");
+var NULL_SIGNAL = {
+  role: "proj" /* PROJECTION */,
+  buffer: new Uint8Array(0),
+  head: 0,
+  density: 0,
+  options: {}
+};
 var getGlobalInstance = () => {
   const root = globalThis;
   if (!root[BASIS_INSTANCE_KEY]) {
@@ -322,7 +341,12 @@ var getGlobalInstance = () => {
       isBatching: false,
       currentEffectSource: null,
       pausedVariables: /* @__PURE__ */ new Set(),
-      metrics: { lastAnalysisTimeMs: 0, comparisonCount: 0, lastAnalysisTimestamp: 0 },
+      metrics: {
+        lastAnalysisTimeMs: 0,
+        comparisonCount: 0,
+        lastAnalysisTimestamp: 0,
+        systemEntropy: 0
+      },
       alertCount: 0,
       loopCounters: /* @__PURE__ */ new Map(),
       lastCleanup: Date.now()
@@ -331,62 +355,61 @@ var getGlobalInstance = () => {
   return root[BASIS_INSTANCE_KEY];
 };
 var instance = getGlobalInstance();
-var { config, history, redundantLabels, currentTickBatch } = instance;
+var config = instance.config;
+var history = instance.history;
+var redundantLabels = instance.redundantLabels;
+var currentTickBatch = instance.currentTickBatch;
 var currentTickRegistry = {};
 var dirtyLabels = /* @__PURE__ */ new Set();
+var calculateTickEntropy = (tickIdx) => {
+  let activeCount = 0;
+  const total = instance.history.size;
+  if (total === 0) return 1;
+  instance.history.forEach((meta) => {
+    if (meta.buffer[tickIdx] === 1) activeCount++;
+  });
+  return 1 - activeCount / total;
+};
 var analyzeBasis = () => {
-  if (!instance.config.debug) {
-    instance.redundantLabels.clear();
+  if (!instance.config.debug || dirtyLabels.size === 0) {
     return;
   }
   const scheduler = globalThis.requestIdleCallback || ((cb) => setTimeout(cb, 1));
+  const snapshot = new Set(dirtyLabels);
+  dirtyLabels.clear();
   scheduler(() => {
     const analysisStart = performance.now();
-    if (dirtyLabels.size === 0) return;
     const allEntries = [];
     const dirtyEntries = [];
     instance.history.forEach((meta, label) => {
-      if (meta.options.suppressAll) return;
-      let density = 0;
-      for (let k = 0; k < meta.buffer.length; k++) density += meta.buffer[k];
-      if (density >= 2) {
-        const entry = { label, meta, density };
-        allEntries.push(entry);
-        if (dirtyLabels.has(label)) dirtyEntries.push(entry);
+      if (meta.options.suppressAll || meta.density === 0) return;
+      const entry = {
+        label,
+        meta,
+        isVolatile: meta.density > VOLATILITY_THRESHOLD
+      };
+      allEntries.push(entry);
+      if (snapshot.has(label)) {
+        dirtyEntries.push(entry);
       }
     });
-    if (dirtyEntries.length === 0 || allEntries.length < 2) {
-      dirtyLabels.clear();
-      return;
-    }
+    if (dirtyEntries.length === 0 || allEntries.length < 2) return;
     const nextRedundant = /* @__PURE__ */ new Set();
-    let compCount = 0;
     instance.redundantLabels.forEach((l) => {
-      if (!dirtyLabels.has(l)) nextRedundant.add(l);
-    });
-    for (const dirtyEntry of dirtyEntries) {
-      for (const otherEntry of allEntries) {
-        if (dirtyEntry.label === otherEntry.label) continue;
-        if (dirtyLabels.has(otherEntry.label) && dirtyEntry.label > otherEntry.label) continue;
-        compCount++;
-        const sync = calculateSimilarityCircular(dirtyEntry.meta.buffer, dirtyEntry.meta.head, otherEntry.meta.buffer, otherEntry.meta.head, 0);
-        const bA = calculateSimilarityCircular(dirtyEntry.meta.buffer, dirtyEntry.meta.head, otherEntry.meta.buffer, otherEntry.meta.head, 1);
-        const aB = calculateSimilarityCircular(dirtyEntry.meta.buffer, dirtyEntry.meta.head, otherEntry.meta.buffer, otherEntry.meta.head, -1);
-        const maxSim = Math.max(sync, bA, aB);
-        if (maxSim > SIMILARITY_THRESHOLD) {
-          const bothVolatile = dirtyEntry.density > VOLATILITY_THRESHOLD && otherEntry.density > VOLATILITY_THRESHOLD;
-          if (sync === maxSim && !bothVolatile) {
-            nextRedundant.add(dirtyEntry.label);
-            nextRedundant.add(otherEntry.label);
-            displayRedundancyAlert(dirtyEntry.label, otherEntry.label, sync);
-          } else if (bA === maxSim) displayCausalHint(otherEntry.label, dirtyEntry.label, "math");
-          else if (aB === maxSim) displayCausalHint(dirtyEntry.label, otherEntry.label, "math");
-        }
+      if (!snapshot.has(l)) {
+        nextRedundant.add(l);
       }
-    }
-    dirtyLabels.clear();
+    });
+    const compCount = detectSubspaceOverlap(
+      dirtyEntries,
+      allEntries,
+      nextRedundant,
+      snapshot
+    );
     instance.redundantLabels.clear();
-    nextRedundant.forEach((l) => instance.redundantLabels.add(l));
+    nextRedundant.forEach((l) => {
+      instance.redundantLabels.add(l);
+    });
     instance.metrics.lastAnalysisTimeMs = performance.now() - analysisStart;
     instance.metrics.comparisonCount = compCount;
     instance.metrics.lastAnalysisTimestamp = Date.now();
@@ -395,13 +418,22 @@ var analyzeBasis = () => {
 var processHeartbeat = () => {
   instance.tick++;
   instance.history.forEach((meta, label) => {
-    meta.buffer[meta.head] = instance.currentTickBatch.has(label) ? 1 : 0;
+    const oldValue = meta.buffer[meta.head];
+    const newValue = instance.currentTickBatch.has(label) ? 1 : 0;
+    meta.buffer[meta.head] = newValue;
+    if (oldValue !== newValue) {
+      meta.density += newValue - oldValue;
+    }
     meta.head = (meta.head + 1) % WINDOW_SIZE;
   });
+  const lastHead = instance.history.size > 0 ? instance.tick % WINDOW_SIZE : 0;
+  instance.metrics.systemEntropy = calculateTickEntropy(lastHead);
   instance.currentTickBatch.clear();
   currentTickRegistry = {};
   instance.isBatching = false;
-  if (instance.tick % ANALYSIS_INTERVAL === 0) analyzeBasis();
+  if (dirtyLabels.size > 0) {
+    analyzeBasis();
+  }
 };
 var recordUpdate = (label) => {
   if (!instance.config.debug) return true;
@@ -419,7 +451,15 @@ var recordUpdate = (label) => {
     return false;
   }
   if (instance.currentEffectSource && instance.currentEffectSource !== label) {
-    displayCausalHint(label, instance.currentEffectSource, "tracking");
+    const targetMeta = instance.history.get(label);
+    const sourceMeta = instance.history.get(instance.currentEffectSource);
+    if (targetMeta) {
+      const sourceDensity = sourceMeta?.density || 0;
+      const isVolatile = targetMeta.density > VOLATILITY_THRESHOLD || sourceDensity > VOLATILITY_THRESHOLD;
+      if (!isVolatile) {
+        displayCausalHint(label, targetMeta, instance.currentEffectSource, sourceMeta || NULL_SIGNAL);
+      }
+    }
   }
   if (currentTickRegistry[label]) return true;
   currentTickRegistry[label] = true;
@@ -441,11 +481,20 @@ var configureBasis = (c) => {
 var registerVariable = (l, o = {}) => {
   if (!instance.config.debug || o.suppressAll) return;
   if (!instance.history.has(l)) {
-    instance.history.set(l, { buffer: new Uint8Array(WINDOW_SIZE), head: 0, options: o });
+    instance.history.set(l, {
+      buffer: new Uint8Array(WINDOW_SIZE),
+      head: 0,
+      density: 0,
+      options: o,
+      role: o.role || "local" /* LOCAL */
+    });
   }
 };
 var unregisterVariable = (l) => {
   instance.history.delete(l);
+  instance.loopCounters.delete(l);
+  instance.pausedVariables.delete(l);
+  instance.redundantLabels.delete(l);
 };
 var beginEffectTracking = (l) => {
   if (instance.config.debug) instance.currentEffectSource = l;
@@ -454,67 +503,47 @@ var endEffectTracking = () => {
   instance.currentEffectSource = null;
 };
 var printBasisHealthReport = (threshold = 0.5) => {
-  if (!instance.config.debug) {
-    console.warn("[Basis] Cannot generate report. Debug mode is OFF.");
-    return;
-  }
+  if (!instance.config.debug) return;
   displayHealthReport(instance.history, threshold);
 };
 var getBasisMetrics = () => ({
-  engine: "v0.4.2 (Ring Buffer)",
+  engine: "v0.5.x",
   hooks: instance.history.size,
-  load: instance.metrics.comparisonCount,
-  analysis_ms: instance.metrics.lastAnalysisTimeMs.toFixed(3)
+  analysis_ms: instance.metrics.lastAnalysisTimeMs.toFixed(3),
+  entropy: instance.metrics.systemEntropy.toFixed(3)
 });
 if (typeof window !== "undefined") {
   window.printBasisReport = printBasisHealthReport;
   window.getBasisMetrics = getBasisMetrics;
 }
-var __testEngine__ = {
-  instance,
-  history: instance.history,
-  configureBasis,
-  registerVariable,
-  unregisterVariable,
-  recordUpdate,
-  printBasisHealthReport,
-  beginEffectTracking,
-  endEffectTracking
-};
 
 // src/hooks.ts
 var anonCount = 0;
 var getFallbackLabel = (type) => `anon_${type}_${anonCount++}`;
+var React19 = React;
 function useState(initialState, label) {
   const [val, setVal] = (0, import_react.useState)(initialState);
   const effectiveLabel = (0, import_react.useRef)(label || getFallbackLabel("state")).current;
   (0, import_react.useEffect)(() => {
-    registerVariable(effectiveLabel);
+    registerVariable(effectiveLabel, { role: "local" /* LOCAL */ });
     return () => {
       unregisterVariable(effectiveLabel);
     };
   }, [effectiveLabel]);
-  const setter = (0, import_react.useCallback)((newValue) => {
+  const setter = (0, import_react.useCallback)((value) => {
     if (recordUpdate(effectiveLabel)) {
-      setVal(newValue);
+      setVal(value);
     }
   }, [effectiveLabel]);
   return [val, setter];
 }
-function useRef(initialValue, _label) {
-  return (0, import_react.useRef)(initialValue);
-}
 function useReducer(reducer, initialArg, init, label) {
-  const isLazyInit = typeof init === "function";
-  const providedLabel = isLazyInit ? label : typeof init === "string" ? init : void 0;
+  const isLazy = typeof init === "function";
+  const providedLabel = label || (typeof init === "string" ? init : void 0);
   const effectiveLabel = (0, import_react.useRef)(providedLabel || getFallbackLabel("reducer")).current;
-  const [state, dispatch] = (0, import_react.useReducer)(
-    reducer,
-    initialArg,
-    isLazyInit ? init : void 0
-  );
+  const [state, dispatch] = isLazy ? (0, import_react.useReducer)(reducer, initialArg, init) : (0, import_react.useReducer)(reducer, initialArg);
   (0, import_react.useEffect)(() => {
-    registerVariable(effectiveLabel);
+    registerVariable(effectiveLabel, { role: "local" /* LOCAL */ });
     return () => {
       unregisterVariable(effectiveLabel);
     };
@@ -523,20 +552,47 @@ function useReducer(reducer, initialArg, init, label) {
     if (recordUpdate(effectiveLabel)) {
       dispatch(action);
     }
-  }, [effectiveLabel]);
+  }, [effectiveLabel, dispatch]);
   return [state, basisDispatch];
 }
+function createContext(defaultValue, label) {
+  const context = (0, import_react.createContext)(defaultValue);
+  const effectiveLabel = label || getFallbackLabel("context");
+  Object.defineProperty(context, "_basis_label", {
+    value: effectiveLabel,
+    writable: false,
+    enumerable: false
+  });
+  return context;
+}
+function useContext(context) {
+  const val = (0, import_react.useContext)(context);
+  const label = context._basis_label;
+  (0, import_react.useLayoutEffect)(() => {
+    if (label) {
+      registerVariable(label, { role: "context" /* CONTEXT */ });
+      recordUpdate(label);
+    }
+  }, [val, label]);
+  return val;
+}
 function useMemo(factory, deps, label) {
-  const effectiveLabel = label || "anonymous_projection";
+  const effectiveLabel = (0, import_react.useRef)(label || getFallbackLabel("proj")).current;
   (0, import_react.useEffect)(() => {
-    if (config.debug) console.log(`%c [Basis] Valid Projection: "${effectiveLabel}" `, "color: #2ecc71; font-weight: bold;");
+    registerVariable(effectiveLabel, { role: "proj" /* PROJECTION */ });
+    return () => {
+      unregisterVariable(effectiveLabel);
+    };
   }, [effectiveLabel]);
   return (0, import_react.useMemo)(factory, deps || []);
 }
 function useCallback(callback, deps, label) {
-  const effectiveLabel = label || "anonymous_callback";
+  const effectiveLabel = (0, import_react.useRef)(label || getFallbackLabel("cb")).current;
   (0, import_react.useEffect)(() => {
-    if (config.debug) console.log(`%c [Basis] Stable Callback: "${effectiveLabel}" `, "color: #2ecc71; font-weight: bold;");
+    registerVariable(effectiveLabel, { role: "proj" /* PROJECTION */ });
+    return () => {
+      unregisterVariable(effectiveLabel);
+    };
   }, [effectiveLabel]);
   return (0, import_react.useCallback)(callback, deps);
 }
@@ -544,56 +600,29 @@ function useEffect(effect, deps, label) {
   const effectiveLabel = label || "anonymous_effect";
   (0, import_react.useEffect)(() => {
     beginEffectTracking(effectiveLabel);
-    const cleanup = effect();
+    const destructor = effect();
     endEffectTracking();
-    return cleanup;
+    return typeof destructor === "function" ? destructor : void 0;
   }, deps);
 }
 function useLayoutEffect(effect, deps, label) {
   const effectiveLabel = label || "anonymous_layout_effect";
   (0, import_react.useLayoutEffect)(() => {
     beginEffectTracking(effectiveLabel);
-    const cleanup = effect();
+    const destructor = effect();
     endEffectTracking();
-    return cleanup;
+    return typeof destructor === "function" ? destructor : void 0;
   }, deps);
 }
-function useTransition(_label) {
-  const [isPending, startTransition] = (0, import_react.useTransition)();
-  const effectiveLabel = _label || "anonymous_transition";
-  const basisStartTransition = (callback) => {
-    if (config.debug) console.log(`%c [Basis] Transition Started: "${effectiveLabel}" `, "color: #e67e22; font-weight: bold;");
-    startTransition(callback);
-  };
-  return [isPending, basisStartTransition];
-}
-function useDeferredValue(value, initialValueOrLabel, label) {
-  const isLabelAsSecondArg = typeof initialValueOrLabel === "string" && label === void 0;
-  const actualInitialValue = isLabelAsSecondArg ? void 0 : initialValueOrLabel;
-  const effectiveLabel = isLabelAsSecondArg ? initialValueOrLabel : label || "anonymous_deferred";
-  const deferredValue = (0, import_react.useDeferredValue)(value, actualInitialValue);
-  (0, import_react.useEffect)(() => {
-    if (config.debug && value !== deferredValue) console.log(`%c [Basis] Value Deferred: "${effectiveLabel}" `, "color: #e67e22; font-weight: bold;");
-  }, [value, deferredValue, effectiveLabel]);
-  return deferredValue;
-}
-var useId2 = (label) => React.useId();
-var useDebugValue2 = React.useDebugValue;
-var useImperativeHandle2 = React.useImperativeHandle;
-var useInsertionEffect2 = React.useInsertionEffect;
-var useSyncExternalStore = import_react.useSyncExternalStore;
-function use(usable) {
-  return (0, import_react.use)(usable);
-}
-function useOptimistic2(passthrough, reducer, label) {
-  const effectiveLabel = label || "anonymous_optimistic";
+function useOptimistic(passthrough, reducer, label) {
+  const effectiveLabel = (0, import_react.useRef)(label || getFallbackLabel("optimistic")).current;
   (0, import_react.useEffect)(() => {
-    registerVariable(effectiveLabel);
+    registerVariable(effectiveLabel, { role: "local" /* LOCAL */ });
     return () => {
       unregisterVariable(effectiveLabel);
     };
   }, [effectiveLabel]);
-  const [state, reactAddOptimistic] = React.useOptimistic(passthrough, reducer);
+  const [state, reactAddOptimistic] = React19.useOptimistic(passthrough, reducer);
   const addOptimistic = (0, import_react.useCallback)((payload) => {
     if (recordUpdate(effectiveLabel)) {
       reactAddOptimistic(payload);
@@ -601,17 +630,13 @@ function useOptimistic2(passthrough, reducer, label) {
   }, [effectiveLabel, reactAddOptimistic]);
   return [state, addOptimistic];
 }
-function useActionState2(action, initialState, permalink, label) {
-  const isLabelAsThirdArg = typeof permalink === "string" && label === void 0;
-  const actualPermalink = isLabelAsThirdArg ? void 0 : permalink;
-  const effectiveLabel = isLabelAsThirdArg ? permalink : label || "anonymous_action_state";
-  const [state, reactDispatch, isPending] = React.useActionState(
-    action,
-    initialState,
-    actualPermalink
-  );
+function useActionState(action, initialState, permalink, label) {
+  const isLabelArg = typeof permalink === "string" && label === void 0;
+  const effectiveLabel = (0, import_react.useRef)(isLabelArg ? permalink : label || getFallbackLabel("action_state")).current;
+  const actualPermalink = isLabelArg ? void 0 : permalink;
+  const [state, reactDispatch, isPending] = React19.useActionState(action, initialState, actualPermalink);
   (0, import_react.useEffect)(() => {
-    registerVariable(effectiveLabel);
+    registerVariable(effectiveLabel, { role: "local" /* LOCAL */ });
     return () => {
       unregisterVariable(effectiveLabel);
     };
@@ -623,6 +648,15 @@ function useActionState2(action, initialState, permalink, label) {
   }, [effectiveLabel, reactDispatch]);
   return [state, basisDispatch, isPending];
 }
+var useRef = import_react.useRef;
+var useId2 = React.useId;
+var useDebugValue2 = React.useDebugValue;
+var useImperativeHandle2 = React.useImperativeHandle;
+var useInsertionEffect2 = React.useInsertionEffect;
+var useSyncExternalStore = import_react.useSyncExternalStore;
+var useTransition = import_react.useTransition;
+var useDeferredValue = import_react.useDeferredValue;
+var use = React19.use;
 
 // src/context.tsx
 var import_react3 = require("react");
@@ -674,10 +708,15 @@ var BasisHUD = () => {
   const canvasRef = (0, import_react2.useRef)(null);
   (0, import_react2.useEffect)(() => {
     if (!isExpanded) return;
-    let animationFrame;
     let isMounted = true;
+    let animationFrame = null;
     const draw = () => {
-      if (!isMounted) return;
+      if (!isMounted) {
+        if (animationFrame !== null) {
+          cancelAnimationFrame(animationFrame);
+        }
+        return;
+      }
       const canvas = canvasRef.current;
       if (!canvas) return;
       const ctx = canvas.getContext("2d");
@@ -685,31 +724,27 @@ var BasisHUD = () => {
       const entries = Array.from(history.entries());
       const dpr = window.devicePixelRatio || 1;
       const rawWidth = HUD_DIMENSIONS.WINDOW_SIZE * HUD_DIMENSIONS.COL_WIDTH + HUD_DIMENSIONS.LABEL_WIDTH + HUD_DIMENSIONS.PADDING * 2;
-      const rawHeight = Math.max(entries.length * HUD_DIMENSIONS.ROW_HEIGHT + HUD_DIMENSIONS.PADDING * 2, 60);
+      const rawHeight = Math.max(entries.length * HUD_DIMENSIONS.ROW_HEIGHT + HUD_DIMENSIONS.PADDING * 2, 80);
       updateCanvasSize(canvas, rawWidth, rawHeight, dpr);
       ctx.save();
       ctx.scale(dpr, dpr);
       ctx.clearRect(0, 0, rawWidth, rawHeight);
-      if (entries.length === 0) {
-        renderEmptyState(ctx);
-      } else {
-        renderMatrix(ctx, entries);
-      }
+      if (entries.length === 0) renderEmptyState(ctx);
+      else renderMatrix(ctx, entries);
       ctx.restore();
       animationFrame = requestAnimationFrame(draw);
     };
-    draw();
+    animationFrame = requestAnimationFrame(draw);
     return () => {
       isMounted = false;
-      cancelAnimationFrame(animationFrame);
+      if (animationFrame !== null) {
+        cancelAnimationFrame(animationFrame);
+      }
     };
   }, [isExpanded]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: getHUDContainerStyle(isExpanded), onClick: () => setIsExpanded(!isExpanded), children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HUDHeader, { isExpanded }),
-    isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { padding: "10px 14px 15px 14px" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("canvas", { ref: canvasRef, style: { display: "block" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HUDFooter, {})
-    ] })
+    isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { padding: "10px 14px 15px 14px" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("canvas", { ref: canvasRef, style: { display: "block" } }) })
   ] });
 };
 function updateCanvasSize(canvas, w, h, dpr) {
@@ -736,18 +771,22 @@ function renderMatrix(ctx, entries) {
   const cellH = rowH - 4;
   const gridPath = new Path2D();
   const successPath = new Path2D();
+  const contextPath = new Path2D();
   const errorPath = new Path2D();
   ctx.font = "11px Inter, Menlo, monospace";
   let rowIndex = 0;
   for (const [label, meta] of entries) {
     const y = rowIndex * rowH + pad;
-    const isRedundant = redundantLabels.has(label);
+    const isContext = meta.role === "context";
+    const isRedundant = !isContext && redundantLabels.has(label);
     const { buffer, head } = meta;
     let uiPos = 0;
     const addToPath = (val, xIdx) => {
       const x = xIdx * colW + pad;
       if (val === 1) {
-        (isRedundant ? errorPath : successPath).rect(x, y, cellW, cellH);
+        if (isContext) contextPath.rect(x, y, cellW, cellH);
+        else if (isRedundant) errorPath.rect(x, y, cellW, cellH);
+        else successPath.rect(x, y, cellW, cellH);
       } else {
         gridPath.rect(x, y, cellW, cellH);
       }
@@ -756,17 +795,16 @@ function renderMatrix(ctx, entries) {
     for (let i = 0; i < head; i++) addToPath(buffer[i], uiPos++);
     const stateName = label.split(" -> ")[1] || label;
     const textX = L * colW + pad + 10;
-    let density = 0;
-    for (let i = 0; i < L; i++) density += buffer[i];
-    const isVolatile = density > 25;
-    ctx.fillStyle = isRedundant ? HUD_THEME.error : isVolatile ? HUD_THEME.success : HUD_THEME.text;
-    ctx.fillText((isRedundant ? "! " : isVolatile ? "~ " : "") + stateName, textX, y + 9);
+    ctx.fillStyle = isContext ? HUD_THEME.header : isRedundant ? HUD_THEME.error : HUD_THEME.text;
+    ctx.fillText((isContext ? "\u03A9 " : isRedundant ? "! " : "") + stateName, textX, y + 9);
     rowIndex++;
   }
   ctx.fillStyle = HUD_THEME.grid;
   ctx.fill(gridPath);
   ctx.fillStyle = HUD_THEME.success;
   ctx.fill(successPath);
+  ctx.fillStyle = HUD_THEME.header;
+  ctx.fill(contextPath);
   ctx.fillStyle = HUD_THEME.error;
   ctx.fill(errorPath);
 }
@@ -787,25 +825,7 @@ var HUDHeader = ({ isExpanded }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)
     },
     children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: isExpanded ? "STATE BASIS MATRIX" : "\u{1F4D0} BASIS ACTIVE" }),
-      isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { opacity: 0.8, fontSize: "9px" }, children: "v0.4.2" })
-    ]
-  }
-);
-var HUDFooter = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "div",
-  {
-    style: {
-      marginTop: "12px",
-      paddingTop: "8px",
-      borderTop: `1px solid ${HUD_THEME.grid}`,
-      color: HUD_THEME.textDim,
-      fontSize: "9px",
-      display: "flex",
-      justifyContent: "space-between"
-    },
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "RING BUFFER ENGINE" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "ZERO ALLOC" })
+      isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { opacity: 0.8, fontSize: "9px" }, children: "v0.5.x" })
     ]
   }
 );
@@ -814,7 +834,11 @@ var HUDFooter = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var BasisContext = (0, import_react3.createContext)({ debug: false });
 var isWeb2 = typeof window !== "undefined" && typeof window.document !== "undefined";
-var BasisProvider = ({ children, debug = true }) => {
+var BasisProvider = ({
+  children,
+  debug = true,
+  showHUD = true
+}) => {
   (0, import_react3.useLayoutEffect)(() => {
     configureBasis({ debug });
     if (isWeb2) {
@@ -823,7 +847,7 @@ var BasisProvider = ({ children, debug = true }) => {
   }, [debug]);
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(BasisContext.Provider, { value: { debug }, children: [
     children,
-    debug && isWeb2 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BasisHUD, {})
+    debug && showHUD && isWeb2 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BasisHUD, {})
   ] });
 };
 var useBasisConfig = () => (0, import_react3.useContext)(BasisContext);
@@ -846,12 +870,14 @@ function basis() {
   BasisProvider,
   basis,
   configureBasis,
+  createContext,
   getBasisMetrics,
   printBasisHealthReport,
   use,
   useActionState,
   useBasisConfig,
   useCallback,
+  useContext,
   useDebugValue,
   useDeferredValue,
   useEffect,