@buoy-gg/highlight-updates 7.0.32 → 7.0.33

package/lib/commonjs/highlight-updates/components/IsolatedRenderList.js

@@ -110,21 +110,38 @@ function IsolatedRenderListInner({
 
   // Show empty state when no renders
   if (renders.length === 0) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      testID: "buoy-highlight-empty",
-      style: styles.emptyState,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Activity, {
-        size: 32,
-        color: _sharedUi.night.color.textTertiary
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        testID: "buoy-highlight-empty-title",
-        style: styles.emptyTitle,
-        children: "No renders tracked"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        testID: "buoy-highlight-empty-text",
-        style: styles.emptyText,
-        children: isTracking ? "Component renders will appear here" : "Enable tracking to start capturing"
-      })]
+    const term = searchText.trim();
+
+    // Read straight off the tracker rather than held in state: this runs only
+    // on the empty branch, so it costs nothing on the hot path, and it is
+    // always the current truth. `totalTracked` is every component the tracker
+    // holds; `unsearched` is what the settings and filters allow BEFORE the
+    // search box.
+    const totalTracked = _RenderTracker.RenderTracker.getStats().totalComponents;
+    const unsearched = term ? _RenderTracker.RenderTracker.getFilteredRenders("").length : 0;
+    const content = (0, _sharedUi.resolveListEmptyState)({
+      subject: "components",
+      verb: "tracked",
+      search: searchText,
+      // The denominator is what the FILTERS left, not the raw tracker count —
+      // "clear the search to see them" has to be true of what you get back.
+      total: term ? unsearched : totalTracked,
+      capturing: isTracking,
+      blocked: term && unsearched === 0 && totalTracked > 0 ? "The active filters hide everything tracked, so there is nothing to search." : undefined,
+      waiting: {
+        // stare = "watching for a specific event; recording armed".
+        otto: "stare",
+        title: "No renders tracked",
+        message: "Component renders will appear here"
+      },
+      paused: {
+        title: "No renders tracked",
+        message: "Enable tracking to start capturing"
+      }
+    });
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolEmptyState, {
+      ...content,
+      testID: "buoy-highlight-empty"
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.FlatList, {
@@ -149,22 +166,6 @@ const styles = _reactNative.StyleSheet.create({
   listContent: {
     paddingTop: 8
   },
-  emptyState: {
-    alignItems: "center",
-    paddingVertical: 40
-  },
-  emptyTitle: {
-    color: _sharedUi.night.color.text,
-    fontSize: 14,
-    fontWeight: "600",
-    marginTop: 12,
-    marginBottom: 6
-  },
-  emptyText: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 12,
-    textAlign: "center"
-  },
   lockedBanner: {
     flexDirection: "row",
     alignItems: "center",

package/lib/commonjs/highlight-updates/components/RenderHistoryViewer.js

@@ -10,6 +10,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _dataViewer = require("@buoy-gg/shared-ui/dataViewer");
+var _RenderTracker = require("../utils/RenderTracker");
 var _RenderCauseBadge = require("./RenderCauseBadge");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
@@ -96,21 +97,19 @@ function RenderHistoryViewer({
 
   // If no history, show empty state
   if (totalEvents === 0) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      testID: "buoy-highlight-history-empty",
-      style: styles.emptyContainer,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Clock, {
-        size: 32,
-        color: _sharedUi.night.color.textTertiary
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        testID: "buoy-highlight-history-empty-title",
-        style: styles.emptyTitle,
-        children: "No Render History"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        testID: "buoy-highlight-history-empty-text",
-        style: styles.emptyText,
-        children: "Enable render history tracking in settings to see render events here."
-      })]
+    // The copy used to tell EVERYONE to go and enable the setting, including
+    // the people who already had. Asking the tracker which it is costs one
+    // synchronous read on a branch that renders nothing else.
+    const historyEnabled = _RenderTracker.RenderTracker.getSettings().enableRenderHistory;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolEmptyState, {
+      testID: "buoy-highlight-history-empty"
+      // paused = the recorder is switched off; stare = armed and watching,
+      // which is the truth once the setting is on and this component simply
+      // has not re-rendered yet.
+      ,
+      otto: historyEnabled ? "stare" : "paused",
+      title: "No Render History",
+      message: historyEnabled ? "History is on and armed — this component has not re-rendered since. Interact with the app to record one." : "Enable render history tracking in settings to see render events here."
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {

package/lib/module/highlight-updates/components/IsolatedRenderList.js

@@ -15,7 +15,7 @@ import React, { useState, useEffect, useRef, useCallback, memo, useMemo } from "
 import { View, Text, FlatList, StyleSheet } from "react-native";
 import { RenderTracker } from "../utils/RenderTracker";
 import { RenderListItem } from "./RenderListItem";
-import { Activity, Lock, night, useLimit } from "@buoy-gg/shared-ui";
+import { Lock, night, useLimit, ToolEmptyState, resolveListEmptyState } from "@buoy-gg/shared-ui";
 
 // Free tier limit for tracked components
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -105,21 +105,38 @@ function IsolatedRenderListInner({
 
   // Show empty state when no renders
   if (renders.length === 0) {
-    return /*#__PURE__*/_jsxs(View, {
-      testID: "buoy-highlight-empty",
-      style: styles.emptyState,
-      children: [/*#__PURE__*/_jsx(Activity, {
-        size: 32,
-        color: night.color.textTertiary
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-highlight-empty-title",
-        style: styles.emptyTitle,
-        children: "No renders tracked"
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-highlight-empty-text",
-        style: styles.emptyText,
-        children: isTracking ? "Component renders will appear here" : "Enable tracking to start capturing"
-      })]
+    const term = searchText.trim();
+
+    // Read straight off the tracker rather than held in state: this runs only
+    // on the empty branch, so it costs nothing on the hot path, and it is
+    // always the current truth. `totalTracked` is every component the tracker
+    // holds; `unsearched` is what the settings and filters allow BEFORE the
+    // search box.
+    const totalTracked = RenderTracker.getStats().totalComponents;
+    const unsearched = term ? RenderTracker.getFilteredRenders("").length : 0;
+    const content = resolveListEmptyState({
+      subject: "components",
+      verb: "tracked",
+      search: searchText,
+      // The denominator is what the FILTERS left, not the raw tracker count —
+      // "clear the search to see them" has to be true of what you get back.
+      total: term ? unsearched : totalTracked,
+      capturing: isTracking,
+      blocked: term && unsearched === 0 && totalTracked > 0 ? "The active filters hide everything tracked, so there is nothing to search." : undefined,
+      waiting: {
+        // stare = "watching for a specific event; recording armed".
+        otto: "stare",
+        title: "No renders tracked",
+        message: "Component renders will appear here"
+      },
+      paused: {
+        title: "No renders tracked",
+        message: "Enable tracking to start capturing"
+      }
+    });
+    return /*#__PURE__*/_jsx(ToolEmptyState, {
+      ...content,
+      testID: "buoy-highlight-empty"
     });
   }
   return /*#__PURE__*/_jsx(FlatList, {
@@ -144,22 +161,6 @@ const styles = StyleSheet.create({
   listContent: {
     paddingTop: 8
   },
-  emptyState: {
-    alignItems: "center",
-    paddingVertical: 40
-  },
-  emptyTitle: {
-    color: night.color.text,
-    fontSize: 14,
-    fontWeight: "600",
-    marginTop: 12,
-    marginBottom: 6
-  },
-  emptyText: {
-    color: night.color.textTertiary,
-    fontSize: 12,
-    textAlign: "center"
-  },
   lockedBanner: {
     flexDirection: "row",
     alignItems: "center",

package/lib/module/highlight-updates/components/RenderHistoryViewer.js

@@ -10,8 +10,9 @@
 
 import React, { useState, useCallback, useMemo } from "react";
 import { View, Text, TouchableOpacity, ScrollView, StyleSheet } from "react-native";
-import { Clock, GitBranch, Database, Lock, formatRelativeTime, SectionHeader, EventStepperFooter, buoyColors, night, useLimit } from "@buoy-gg/shared-ui";
+import { Clock, GitBranch, Database, Lock, formatRelativeTime, SectionHeader, EventStepperFooter, buoyColors, night, useLimit, ToolEmptyState } from "@buoy-gg/shared-ui";
 import { TreeDiffViewer } from "@buoy-gg/shared-ui/dataViewer";
+import { RenderTracker } from "../utils/RenderTracker";
 import { EnhancedCauseDisplay, CAUSE_CONFIG } from "./RenderCauseBadge";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /**
@@ -89,21 +90,19 @@ export function RenderHistoryViewer({
 
   // If no history, show empty state
   if (totalEvents === 0) {
-    return /*#__PURE__*/_jsxs(View, {
-      testID: "buoy-highlight-history-empty",
-      style: styles.emptyContainer,
-      children: [/*#__PURE__*/_jsx(Clock, {
-        size: 32,
-        color: night.color.textTertiary
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-highlight-history-empty-title",
-        style: styles.emptyTitle,
-        children: "No Render History"
-      }), /*#__PURE__*/_jsx(Text, {
-        testID: "buoy-highlight-history-empty-text",
-        style: styles.emptyText,
-        children: "Enable render history tracking in settings to see render events here."
-      })]
+    // The copy used to tell EVERYONE to go and enable the setting, including
+    // the people who already had. Asking the tracker which it is costs one
+    // synchronous read on a branch that renders nothing else.
+    const historyEnabled = RenderTracker.getSettings().enableRenderHistory;
+    return /*#__PURE__*/_jsx(ToolEmptyState, {
+      testID: "buoy-highlight-history-empty"
+      // paused = the recorder is switched off; stare = armed and watching,
+      // which is the truth once the setting is on and this component simply
+      // has not re-rendered yet.
+      ,
+      otto: historyEnabled ? "stare" : "paused",
+      title: "No Render History",
+      message: historyEnabled ? "History is on and armed — this component has not re-rendered since. Interact with the app to record one." : "Enable render history tracking in settings to see render events here."
     });
   }
   return /*#__PURE__*/_jsxs(_Fragment, {

package/lib/typescript/highlight-updates/components/IsolatedRenderList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IsolatedRenderList.d.ts","sourceRoot":"","sources":["../../../../src/highlight-updates/components/IsolatedRenderList.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EAAiB,KAAK,aAAa,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAK9F,UAAU,uBAAuB;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,cAAc,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC5F,aAAa,EAAE,CAAC,KAAK,EAAE;QAAE,eAAe,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAClF,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IACrD,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;GAGG;AACH,iBAAS,uBAAuB,CAAC,EAC/B,UAAU,EACV,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,UAAU,EACV,KAAa,GACd,EAAE,uBAAuB,qBAyGzB;AAGD,eAAO,MAAM,kBAAkB,2DAAgC,CAAC;AA0ChE,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"IsolatedRenderList.d.ts","sourceRoot":"","sources":["../../../../src/highlight-updates/components/IsolatedRenderList.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EAAiB,KAAK,aAAa,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAW9F,UAAU,uBAAuB;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,cAAc,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IAC5F,aAAa,EAAE,CAAC,KAAK,EAAE;QAAE,eAAe,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAClF,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,KAAK,IAAI,CAAC;IACrD,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;GAGG;AACH,iBAAS,uBAAuB,CAAC,EAC/B,UAAU,EACV,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,UAAU,EACV,KAAa,GACd,EAAE,uBAAuB,qBAiIzB;AAGD,eAAO,MAAM,kBAAkB,2DAAgC,CAAC;AA0BhE,eAAe,kBAAkB,CAAC"}

package/lib/typescript/highlight-updates/components/RenderHistoryViewer.d.ts

@@ -6,7 +6,7 @@
  * Shows current state view or diff view between renders.
  */
 import React from "react";
-import type { TrackedRender } from "../utils/RenderTracker";
+import { type TrackedRender } from "../utils/RenderTracker";
 interface RenderHistoryViewerProps {
     render: TrackedRender;
     /** If true, use external footer (modal provides it) */

package/lib/typescript/highlight-updates/components/RenderHistoryViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RenderHistoryViewer.d.ts","sourceRoot":"","sources":["../../../../src/highlight-updates/components/RenderHistoryViewer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAyC,MAAM,OAAO,CAAC;AAe9D,OAAO,KAAK,EAAE,aAAa,EAAe,MAAM,wBAAwB,CAAC;AAGzE,UAAU,wBAAwB;IAChC,MAAM,EAAE,aAAa,CAAC;IACtB,uDAAuD;IACvD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,gEAAgE;IAChE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAqBD;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,qBAA6B,EAC7B,kBAAkB,EAAE,aAAa,EACjC,kBAAkB,EAAE,gBAAgB,EACpC,KAAa,GACd,EAAE,wBAAwB,qBAyM1B;AAyRD;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,kBAAsB,EACtB,kBAA6B,EAC7B,KAAa,GACd,EAAE;IACD,MAAM,EAAE,aAAa,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,4BA6CA;AA+YD,eAAe,mBAAmB,CAAC"}
+{"version":3,"file":"RenderHistoryViewer.d.ts","sourceRoot":"","sources":["../../../../src/highlight-updates/components/RenderHistoryViewer.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAyC,MAAM,OAAO,CAAC;AAiB9D,OAAO,EAAiB,KAAK,aAAa,EAAoB,MAAM,wBAAwB,CAAC;AAG7F,UAAU,wBAAwB;IAChC,MAAM,EAAE,aAAa,CAAC;IACtB,uDAAuD;IACvD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,gEAAgE;IAChE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAqBD;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,qBAA6B,EAC7B,kBAAkB,EAAE,aAAa,EACjC,kBAAkB,EAAE,gBAAgB,EACpC,KAAa,GACd,EAAE,wBAAwB,qBAiN1B;AAyRD;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,MAAM,EACN,kBAAsB,EACtB,kBAA6B,EAC7B,KAAa,GACd,EAAE;IACD,MAAM,EAAE,aAAa,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,4BA6CA;AA+YD,eAAe,mBAAmB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buoy-gg/highlight-updates",
-  "version": "7.0.32",
+  "version": "7.0.33",
   "description": "Render highlighter for React Native — see every render with its cause: mount, state, props, or parent. Part of Buoy devtools.",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -26,14 +26,14 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/shared-ui": "^7.0.32",
-    "@buoy-gg/floating-tools-core": "^7.0.32"
+    "@buoy-gg/floating-tools-core": "^7.0.33",
+    "@buoy-gg/shared-ui": "^7.0.33"
   },
   "peerDependencies": {
-    "@buoy-gg/license": "7.0.32",
+    "@buoy-gg/license": "7.0.33",
     "react": "*",
     "react-native": "*",
-    "@buoy-gg/core": "^7.0.32"
+    "@buoy-gg/core": "^7.0.33"
   },
   "peerDependenciesMeta": {
     "@buoy-gg/core": {
@@ -44,8 +44,8 @@
     "@types/react": "^19.1.0",
     "@types/react-native": "^0.73.0",
     "typescript": "~5.8.3",
-    "@buoy-gg/core": "^7.0.32",
-    "@buoy-gg/license": "^7.0.32"
+    "@buoy-gg/core": "^7.0.33",
+    "@buoy-gg/license": "^7.0.33"
   },
   "react-native-builder-bob": {
     "source": "src",