@buoy-gg/shared-ui 7.0.40 → 7.0.42

package/lib/commonjs/ui/components/TimeDisplay.js

@@ -1,142 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TimeDisplay = TimeDisplay;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _index = require("../gameUI/index.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function TimeDisplay({
-  time,
-  format = "relative",
-  updateInterval = 60000,
-  style,
-  showSeconds = false,
-  prefix
-}) {
-  const [displayTime, setDisplayTime] = (0, _react.useState)("");
-  const formatRelativeTime = date => {
-    const now = Date.now();
-    const diff = now - date.getTime();
-    const seconds = Math.floor(diff / 1000);
-    if (seconds < 60) return "just now";
-    const minutes = Math.floor(seconds / 60);
-    if (minutes < 60) return `${minutes}m ago`;
-    const hours = Math.floor(minutes / 60);
-    if (hours < 24) return `${hours}h ago`;
-    const days = Math.floor(hours / 24);
-    if (days < 7) return `${days}d ago`;
-    const weeks = Math.floor(days / 7);
-    if (weeks < 4) return `${weeks}w ago`;
-    const months = Math.floor(days / 30);
-    if (months < 12) return `${months}mo ago`;
-    const years = Math.floor(days / 365);
-    return `${years}y ago`;
-  };
-  const formatAbsoluteTime = (date, withSeconds) => {
-    if (withSeconds) {
-      return date.toLocaleTimeString();
-    }
-    return date.toLocaleTimeString([], {
-      hour: "2-digit",
-      minute: "2-digit"
-    });
-  };
-  const formatDuration = ms => {
-    if (ms < 1000) return `${ms}ms`;
-    const seconds = Math.floor(ms / 1000);
-    if (seconds < 60) return `${seconds}s`;
-    const minutes = Math.floor(seconds / 60);
-    const remainingSeconds = seconds % 60;
-    if (minutes < 60) {
-      return remainingSeconds > 0 ? `${minutes}m ${remainingSeconds}s` : `${minutes}m`;
-    }
-    const hours = Math.floor(minutes / 60);
-    const remainingMinutes = minutes % 60;
-    return remainingMinutes > 0 ? `${hours}h ${remainingMinutes}m` : `${hours}h`;
-  };
-  (0, _react.useEffect)(() => {
-    const formatMixed = date => {
-      const now = Date.now();
-      const diff = now - date.getTime();
-      const hours = Math.floor(diff / (1000 * 60 * 60));
-      if (hours < 24) {
-        return formatRelativeTime(date);
-      }
-      return date.toLocaleDateString([], {
-        month: "short",
-        day: "numeric",
-        year: date.getFullYear() !== new Date().getFullYear() ? "numeric" : undefined
-      });
-    };
-    const updateTime = () => {
-      if (format === "duration" && typeof time === "number") {
-        setDisplayTime(formatDuration(time));
-        return;
-      }
-      const date = new Date(time);
-      switch (format) {
-        case "relative":
-          setDisplayTime(formatRelativeTime(date));
-          break;
-        case "absolute":
-          setDisplayTime(formatAbsoluteTime(date, showSeconds));
-          break;
-        case "mixed":
-          setDisplayTime(formatMixed(date));
-          break;
-        default:
-          setDisplayTime(formatRelativeTime(date));
-      }
-    };
-    updateTime();
-    if (format === "relative" && updateInterval > 0) {
-      const interval = setInterval(updateTime, updateInterval);
-      return () => clearInterval(interval);
-    }
-  }, [time, format, updateInterval, showSeconds]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-    style: [defaultStyles.text, style],
-    children: prefix ? `${prefix} ${displayTime}` : displayTime
-  });
-}
-TimeDisplay.Timestamp = function Timestamp({
-  time,
-  style
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TimeDisplay, {
-    time: time,
-    format: "mixed",
-    style: style
-  });
-};
-TimeDisplay.Duration = function Duration({
-  milliseconds,
-  style
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TimeDisplay, {
-    time: milliseconds,
-    format: "duration",
-    style: style
-  });
-};
-TimeDisplay.Relative = function Relative({
-  time,
-  updateInterval = 60000,
-  style
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TimeDisplay, {
-    time: time,
-    format: "relative",
-    updateInterval: updateInterval,
-    style: style
-  });
-};
-const defaultStyles = {
-  text: {
-    fontSize: 12,
-    color: _index.gameUIColors.tertiary
-  }
-};
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.TimeDisplay=TimeDisplay;var _react=require("react");var _reactNative=require("react-native");var _index=require("../gameUI/index.js");var _jsxRuntime=require("react/jsx-runtime");function TimeDisplay({time:s,format:r="relative",updateInterval:n=6e4,style:f,showSeconds:h=false,prefix:d}){const[g,c]=(0,_react.useState)("");const m=o=>{const t=Date.now();const e=t-o.getTime();const u=Math.floor(e/1e3);if(u<60)return"just now";const i=Math.floor(u/60);if(i<60)return`${i}m ago`;const a=Math.floor(i/60);if(a<24)return`${a}h ago`;const l=Math.floor(a/24);if(l<7)return`${l}d ago`;const y=Math.floor(l/7);if(y<4)return`${y}w ago`;const v=Math.floor(l/30);if(v<12)return`${v}mo ago`;const M=Math.floor(l/365);return`${M}y ago`};const $=(o,t)=>{if(t){return o.toLocaleTimeString()}return o.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})};const x=o=>{if(o<1e3)return`${o}ms`;const t=Math.floor(o/1e3);if(t<60)return`${t}s`;const e=Math.floor(t/60);const u=t%60;if(e<60){return u>0?`${e}m ${u}s`:`${e}m`}const i=Math.floor(e/60);const a=e%60;return a>0?`${i}h ${a}m`:`${i}h`};(0,_react.useEffect)(()=>{const o=e=>{const u=Date.now();const i=u-e.getTime();const a=Math.floor(i/(1e3*60*60));if(a<24){return m(e)}return e.toLocaleDateString([],{month:"short",day:"numeric",year:e.getFullYear()!==new Date().getFullYear()?"numeric":void 0})};const t=()=>{if(r==="duration"&&typeof s==="number"){c(x(s));return}const e=new Date(s);switch(r){case"relative":c(m(e));break;case"absolute":c($(e,h));break;case"mixed":c(o(e));break;default:c(m(e))}};t();if(r==="relative"&&n>0){const e=setInterval(t,n);return()=>clearInterval(e)}},[s,r,n,h]);return(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[defaultStyles.text,f],children:d?`${d} ${g}`:g})}TimeDisplay.Timestamp=function s({time:r,style:n}){return(0,_jsxRuntime.jsx)(TimeDisplay,{time:r,format:"mixed",style:n})};TimeDisplay.Duration=function s({milliseconds:r,style:n}){return(0,_jsxRuntime.jsx)(TimeDisplay,{time:r,format:"duration",style:n})};TimeDisplay.Relative=function s({time:r,updateInterval:n=6e4,style:f}){return(0,_jsxRuntime.jsx)(TimeDisplay,{time:r,format:"relative",updateInterval:n,style:f})};const defaultStyles={text:{fontSize:12,color:_index.gameUIColors.tertiary}};

package/lib/commonjs/ui/components/ToggleRow.js

@@ -1,116 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ToggleRow = ToggleRow;
-var _reactNative = require("react-native");
-var _nightTheme = require("../night/nightTheme.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * ToggleRow — a labeled switch row for a tool's settings surface.
- *
- * Every settings screen (impersonate, image-overlay, highlight-updates,
- * perf-monitor, scenarios, storage, ask-buoy) drew its own `toggleRow` +
- * `<Switch>` pair with the same night track colors. The native switch stays
- * (a custom control would be a visible design change); the row chrome,
- * the label/description stack and the accent/warning tone are shared.
- *
- * - `variant="card"`  — an elevated bordered pill row (image-overlay)
- * - `variant="plain"` — a bare list row for use inside a card (impersonate)
- */
-
-function ToggleRow({
-  label,
-  description,
-  value,
-  onValueChange,
-  disabled = false,
-  tone = "accent",
-  accessory,
-  variant = "card",
-  emphasizeLabel = false,
-  testID,
-  style
-}) {
-  const onColor = tone === "warning" ? _nightTheme.night.color.warning : _nightTheme.night.color.accent;
-  const isCard = variant === "card";
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: [styles.row, isCard ? styles.rowCard : styles.rowPlain, style],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.info,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.header,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: [isCard ? styles.labelCard : styles.labelPlain, emphasizeLabel && {
-            color: onColor
-          }],
-          numberOfLines: 2,
-          children: label
-        }), accessory]
-      }), description ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.description,
-        children: description
-      }) : null]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Switch, {
-      value: value,
-      onValueChange: onValueChange,
-      disabled: disabled,
-      testID: testID,
-      accessibilityLabel: label,
-      trackColor: isCard ? {
-        false: _nightTheme.night.color.surfaceElevated,
-        true: onColor
-      } : {
-        false: _nightTheme.night.color.border,
-        true: `${onColor}50`
-      },
-      thumbColor: isCard ? undefined : value ? onColor : _nightTheme.night.color.knob
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  row: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  rowCard: {
-    backgroundColor: _nightTheme.night.color.surfaceElevated,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: _nightTheme.night.color.border,
-    paddingHorizontal: 12,
-    paddingVertical: 8
-  },
-  rowPlain: {
-    paddingVertical: 12,
-    paddingHorizontal: 12
-  },
-  info: {
-    flex: 1,
-    marginRight: 12
-  },
-  header: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    flexWrap: "wrap"
-  },
-  labelCard: {
-    fontSize: 13,
-    fontWeight: "500",
-    color: _nightTheme.night.color.textSecondary
-  },
-  labelPlain: {
-    fontSize: 14,
-    fontWeight: "500",
-    color: _nightTheme.night.color.text
-  },
-  description: {
-    fontSize: 12,
-    color: _nightTheme.night.color.textTertiary,
-    lineHeight: 16,
-    marginTop: 3
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ToggleRow=ToggleRow;var _reactNative=require("react-native");var _nightTheme=require("../night/nightTheme.js");var _jsxRuntime=require("react/jsx-runtime");function ToggleRow({label:t,description:o,value:i,onValueChange:n,disabled:l=false,tone:a="accent",accessory:c,variant:s="card",emphasizeLabel:d=false,testID:g,style:h}){const e=a==="warning"?_nightTheme.night.color.warning:_nightTheme.night.color.accent;const r=s==="card";return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.row,r?styles.rowCard:styles.rowPlain,h],children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.info,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.header,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[r?styles.labelCard:styles.labelPlain,d&&{color:e}],numberOfLines:2,children:t}),c]}),o?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.description,children:o}):null]}),(0,_jsxRuntime.jsx)(_reactNative.Switch,{value:i,onValueChange:n,disabled:l,testID:g,accessibilityLabel:t,trackColor:r?{false:_nightTheme.night.color.surfaceElevated,true:e}:{false:_nightTheme.night.color.border,true:`${e}50`},thumbColor:r?void 0:i?e:_nightTheme.night.color.knob})]})}const styles=_reactNative.StyleSheet.create({row:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},rowCard:{backgroundColor:_nightTheme.night.color.surfaceElevated,borderRadius:8,borderWidth:1,borderColor:_nightTheme.night.color.border,paddingHorizontal:12,paddingVertical:8},rowPlain:{paddingVertical:12,paddingHorizontal:12},info:{flex:1,marginRight:12},header:{flexDirection:"row",alignItems:"center",gap:8,flexWrap:"wrap"},labelCard:{fontSize:13,fontWeight:"500",color:_nightTheme.night.color.textSecondary},labelPlain:{fontSize:14,fontWeight:"500",color:_nightTheme.night.color.text},description:{fontSize:12,color:_nightTheme.night.color.textTertiary,lineHeight:16,marginTop:3}});

package/lib/commonjs/ui/components/ToolButton.js

@@ -1,93 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ToolButton = ToolButton;
-var _reactNative = require("react-native");
-var _gameUIColors = require("../gameUI/constants/gameUIColors.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * The shared action button for dev-tool surfaces. Fills the gap where every
- * tool hand-styled its own TouchableOpacity for "Clear", "Apply", "Reset".
- */
-function ToolButton({
-  label,
-  onPress,
-  variant = "primary",
-  size = "medium",
-  disabled = false,
-  icon,
-  style,
-  testID,
-  accessibilityLabel
-}) {
-  const palette = VARIANTS[variant];
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-    accessibilityRole: "button",
-    accessibilityLabel: accessibilityLabel ?? label,
-    testID: testID,
-    onPress: onPress,
-    disabled: disabled,
-    style: [styles.base, size === "small" ? styles.small : styles.medium, {
-      backgroundColor: palette.background,
-      borderColor: palette.border,
-      borderWidth: variant === "ghost" ? 0 : 1
-    }, disabled && styles.disabled, style],
-    children: [icon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: [styles.label, size === "small" && styles.labelSmall, {
-        color: palette.text
-      }],
-      children: label
-    })]
-  });
-}
-const VARIANTS = {
-  primary: {
-    background: _gameUIColors.buoyColors.primary + "22",
-    border: _gameUIColors.buoyColors.primary + "66",
-    text: _gameUIColors.buoyColors.primary
-  },
-  danger: {
-    background: _gameUIColors.gameUIColors.error + "15",
-    border: _gameUIColors.gameUIColors.error + "60",
-    text: _gameUIColors.gameUIColors.error
-  },
-  warning: {
-    background: _gameUIColors.gameUIColors.warning + "15",
-    border: _gameUIColors.gameUIColors.warning + "60",
-    text: _gameUIColors.gameUIColors.warning
-  },
-  ghost: {
-    background: "transparent",
-    border: "transparent",
-    text: _gameUIColors.buoyColors.textSecondary
-  }
-};
-const styles = _reactNative.StyleSheet.create({
-  base: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 6,
-    borderRadius: 8
-  },
-  medium: {
-    paddingVertical: 8,
-    paddingHorizontal: 14
-  },
-  small: {
-    paddingVertical: 5,
-    paddingHorizontal: 10
-  },
-  disabled: {
-    opacity: 0.4
-  },
-  label: {
-    fontSize: 12,
-    fontWeight: "600"
-  },
-  labelSmall: {
-    fontSize: 11
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ToolButton=ToolButton;var _reactNative=require("react-native");var _gameUIColors=require("../gameUI/constants/gameUIColors.js");var _jsxRuntime=require("react/jsx-runtime");function ToolButton({label:r,onPress:l,variant:o="primary",size:t="medium",disabled:a=false,icon:s,style:n,testID:i,accessibilityLabel:d}){const e=VARIANTS[o];return(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{accessibilityRole:"button",accessibilityLabel:d??r,testID:i,onPress:l,disabled:a,style:[styles.base,t==="small"?styles.small:styles.medium,{backgroundColor:e.background,borderColor:e.border,borderWidth:o==="ghost"?0:1},a&&styles.disabled,n],children:[s,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,t==="small"&&styles.labelSmall,{color:e.text}],children:r})]})}const VARIANTS={primary:{background:_gameUIColors.buoyColors.primary+"22",border:_gameUIColors.buoyColors.primary+"66",text:_gameUIColors.buoyColors.primary},danger:{background:_gameUIColors.gameUIColors.error+"15",border:_gameUIColors.gameUIColors.error+"60",text:_gameUIColors.gameUIColors.error},warning:{background:_gameUIColors.gameUIColors.warning+"15",border:_gameUIColors.gameUIColors.warning+"60",text:_gameUIColors.gameUIColors.warning},ghost:{background:"transparent",border:"transparent",text:_gameUIColors.buoyColors.textSecondary}};const styles=_reactNative.StyleSheet.create({base:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,borderRadius:8},medium:{paddingVertical:8,paddingHorizontal:14},small:{paddingVertical:5,paddingHorizontal:10},disabled:{opacity:.4},label:{fontSize:12,fontWeight:"600"},labelSmall:{fontSize:11}});

package/lib/commonjs/ui/components/ToolEmptyState.js

@@ -1,154 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ToolEmptyState = ToolEmptyState;
-exports.resolveListEmptyState = resolveListEmptyState;
-var _reactNative = require("react-native");
-var _index = require("../otto/index.js");
-var _nightTheme = require("../night/nightTheme.js");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * The one "nothing here" panel, for every tool that shows a list.
- *
- * WHY THIS EXISTS
- *
- * Every capture tool — network, events, highlight-updates, storage, zustand,
- * redux, jotai, console — renders the same panel with the same four causes and
- * different nouns. Written out per tool, that produced four copies of the same
- * layout (each of which had to be re-inset by hand the first time a sentence
- * was longer than "No events yet"), and four independent guesses at the
- * PRECEDENCE between those causes. The guesses disagreed, and the disagreements
- * were bugs:
- *
- *   - A search that matched nothing showed "Enable tracking to start
- *     capturing" — pointing at a toggle that was already on.
- *   - Turning every source chip off showed "Events will appear here as they
- *     occur" — inviting you to go generate events that were already in the
- *     store, behind your own filter.
- *   - Typing into a search box while the store was empty produced no
- *     acknowledgement of the query at all, which reads as a dead search box.
- *
- * So the precedence lives here, once, and each tool supplies only what is
- * genuinely its own: the noun, and what "switched on but waiting" looks like
- * for it (network fishes, events listens, the highlighter stares).
- *
- * SPLIT IN TWO ON PURPOSE
- *
- * `resolveListEmptyState` is a pure function returning `{ otto, title,
- * message }`, and `ToolEmptyState` renders that object. Tools with a cause
- * nobody else has — storage's "no issues found" (which is a PASS, not a
- * failure), zustand's unregistered store — resolve the common cases and
- * substitute their own, or skip the resolver and hand the shell a literal.
- * Adding a mascot to every tool at once is then one edit in this file, which is
- * also what makes the Flutter and Swift ports one component to mirror instead
- * of eight.
- */
-
-/** What a "nothing here" panel says. */
-
-/**
- * The panel itself: Otto, a heading, a sentence. Nothing else — this only ever
- * renders where the alternative is a blank body, so it has no actions and no
- * decoration to compete with the list it stands in for.
- */
-function ToolEmptyState({
-  otto,
-  title,
-  message,
-  testID,
-  style
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: [styles.container, style],
-    testID: testID,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Otto, {
-      state: otto,
-      pixelSize: 2
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: styles.title,
-      testID: testID ? `${testID}-title` : undefined,
-      numberOfLines: 2,
-      children: title
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: styles.message,
-      testID: testID ? `${testID}-text` : undefined,
-      children: message
-    })]
-  });
-}
-/**
- * Which "nothing here" this is, in the order the facts answer the question.
- *
- * A typed query first (see `search`), then the user's filters, then the
- * capture switch, then the honest "nothing yet".
- */
-function resolveListEmptyState(facts) {
-  const {
-    subject,
-    verb = "captured",
-    search,
-    total = 0,
-    capturing,
-    waiting,
-    paused,
-    blocked
-  } = facts;
-  const term = (search ?? "").trim();
-  if (term) {
-    return {
-      otto: "sad",
-      // The query goes in the HEADING because checking what you typed is the
-      // first thing you do; the body names whichever blocker is in the way.
-      title: `No results for “${term}”`,
-      message: blocked ?? (total > 0 ? `None of the ${total} ${verb} ${subject} match. Clear the search to see them.` : capturing === false ? `Nothing is ${verb} to search — capture is off. Turn it on to start.` : `Nothing has been ${verb} yet, so there is nothing to match.`)
-    };
-  }
-  if (blocked) {
-    return {
-      otto: "filtering",
-      title: "Filtered Out",
-      message: blocked
-    };
-  }
-  if (total > 0) {
-    return {
-      otto: "filtering",
-      title: "Filtered Out",
-      message: `${total} ${verb} ${subject} ${total === 1 ? "is" : "are"} hidden by the active filters.`
-    };
-  }
-  if (capturing === false) {
-    return {
-      otto: paused?.otto ?? "paused",
-      title: paused?.title ?? "Not capturing",
-      message: paused?.message ?? "Capture is off. Turn it on to start."
-    };
-  }
-  return waiting;
-}
-const styles = _reactNative.StyleSheet.create({
-  container: {
-    alignItems: "center",
-    paddingVertical: 40,
-    // The generated sentences are full sentences. Every tool that hand-rolled
-    // this panel shipped without an inset and had it run to both edges of the
-    // sheet the first time the copy grew past a few words.
-    paddingHorizontal: 24
-  },
-  title: {
-    color: _nightTheme.night.color.text,
-    fontSize: 14,
-    fontWeight: "600",
-    marginTop: 12,
-    marginBottom: 6,
-    textAlign: "center"
-  },
-  message: {
-    color: _nightTheme.night.color.textTertiary,
-    fontSize: 12,
-    textAlign: "center",
-    lineHeight: 17
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.ToolEmptyState=ToolEmptyState;exports.resolveListEmptyState=resolveListEmptyState;var _reactNative=require("react-native");var _index=require("../otto/index.js");var _nightTheme=require("../night/nightTheme.js");var _jsxRuntime=require("react/jsx-runtime");function ToolEmptyState({otto:n,title:r,message:i,testID:t,style:e}){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.container,e],testID:t,children:[(0,_jsxRuntime.jsx)(_index.Otto,{state:n,pixelSize:2}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.title,testID:t?`${t}-title`:void 0,numberOfLines:2,children:r}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.message,testID:t?`${t}-text`:void 0,children:i})]})}function resolveListEmptyState(n){const{subject:r,verb:i="captured",search:t,total:e=0,capturing:a,waiting:c,paused:o,blocked:s}=n;const l=(t??"").trim();if(l){return{otto:"sad",title:`No results for \u201C${l}\u201D`,message:s??(e>0?`None of the ${e} ${i} ${r} match. Clear the search to see them.`:a===false?`Nothing is ${i} to search \u2014 capture is off. Turn it on to start.`:`Nothing has been ${i} yet, so there is nothing to match.`)}}if(s){return{otto:"filtering",title:"Filtered Out",message:s}}if(e>0){return{otto:"filtering",title:"Filtered Out",message:`${e} ${i} ${r} ${e===1?"is":"are"} hidden by the active filters.`}}if(a===false){return{otto:o?.otto??"paused",title:o?.title??"Not capturing",message:o?.message??"Capture is off. Turn it on to start."}}return c}const styles=_reactNative.StyleSheet.create({container:{alignItems:"center",paddingVertical:40,paddingHorizontal:24},title:{color:_nightTheme.night.color.text,fontSize:14,fontWeight:"600",marginTop:12,marginBottom:6,textAlign:"center"},message:{color:_nightTheme.night.color.textTertiary,fontSize:12,textAlign:"center",lineHeight:17}});