@navios/commander-tui 1.2.0 → 1.3.0

package/lib/adapters/react/index.cjs

@@ -0,0 +1,1768 @@
+const require_filter_engine = require('../../filter_engine-DXqu9Vaq.cjs');
+let _opentui_core = require("@opentui/core");
+let _navios_core = require("@navios/core");
+let _opentui_react = require("@opentui/react");
+let react = require("react");
+let _opentui_react_jsx_runtime = require("@opentui/react/jsx-runtime");
+
+//#region src/adapters/react/context/logger_context.tsx
+const LoggerContext = /* @__PURE__ */ (0, react.createContext)(null);
+/**
+* LoggerProvider - Provides shared context for logger components.
+*
+* This context provides:
+* - Shared SyntaxStyle instance for consistent code highlighting
+* - Optional TreeSitterClient for advanced parsing
+* - Theme configuration for consistent styling
+* - Log level color configuration (for backwards compatibility)
+*
+* @example
+* // Using a preset theme
+* <LoggerProvider theme="dark">
+*   <ScreenManager screens={screens} activeScreenId={activeId}>
+*     <Screen name="Logs">
+*       <LogMessage level="info">Hello</LogMessage>
+*     </Screen>
+*   </ScreenManager>
+* </LoggerProvider>
+*
+* @example
+* // Using a custom theme
+* <LoggerProvider theme={myCustomTheme}>
+*   ...
+* </LoggerProvider>
+*/ function LoggerProvider({ children, syntaxStyle: customSyntaxStyle, treeSitterClient, theme: themeProp = "dark", levelColors: customLevelColors }) {
+	const syntaxStyle = (0, react.useMemo)(() => customSyntaxStyle ?? _opentui_core.SyntaxStyle.create(), [customSyntaxStyle]);
+	const theme = (0, react.useMemo)(() => require_filter_engine.resolveTheme(themeProp), [themeProp]);
+	const levelColors = (0, react.useMemo)(() => ({
+		...theme.logLevels,
+		...customLevelColors
+	}), [theme.logLevels, customLevelColors]);
+	const value = (0, react.useMemo)(() => ({
+		syntaxStyle,
+		treeSitterClient,
+		levelColors,
+		theme
+	}), [
+		syntaxStyle,
+		treeSitterClient,
+		levelColors,
+		theme
+	]);
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(LoggerContext.Provider, {
+		value,
+		children
+	});
+}
+/**
+* Hook to access logger context.
+* Returns default values if used outside LoggerProvider.
+*/ function useLoggerContext() {
+	const context = (0, react.useContext)(LoggerContext);
+	if (!context) return {
+		syntaxStyle: void 0,
+		treeSitterClient: void 0,
+		levelColors: require_filter_engine.darkTheme.logLevels,
+		theme: require_filter_engine.darkTheme
+	};
+	return context;
+}
+
+//#endregion
+//#region src/adapters/react/hooks/use_theme.ts
+/**
+* Hook to access the current theme.
+* Returns the theme from LoggerContext.
+*/ function useTheme() {
+	const { theme } = useLoggerContext();
+	return theme;
+}
+
+//#endregion
+//#region src/adapters/react/components/filter/filter_bar.tsx
+const LEVEL_LABELS = {
+	verbose: "V",
+	debug: "D",
+	log: "L",
+	warn: "W",
+	error: "E",
+	fatal: "F"
+};
+function FilterBar({ filter, levelCounts }) {
+	const theme = useTheme();
+	const isSearchFocused = filter.focusedField === "search";
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		backgroundColor: theme.filter.background,
+		borderColor: theme.filter.border,
+		border: ["bottom"],
+		paddingLeft: 1,
+		paddingRight: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				gap: 1,
+				children: [
+					/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+						fg: isSearchFocused ? theme.colors.primary : theme.filter.textDim,
+						children: "/"
+					}),
+					/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+						fg: filter.searchQuery ? theme.filter.inputText : theme.filter.inputPlaceholder,
+						children: filter.searchQuery || "Search logs..."
+					}),
+					isSearchFocused && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+						fg: theme.filter.cursor,
+						attributes: _opentui_core.TextAttributes.BLINK,
+						children: "_"
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				gap: 1,
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.filter.textDim,
+					children: "Levels:"
+				}), require_filter_engine.ALL_LOG_LEVELS.map((level, index) => {
+					const isEnabled = filter.enabledLevels.has(level);
+					const count = levelCounts[level];
+					const levelColor = theme.logLevels[level].border;
+					const isLevelsFocused = filter.focusedField === "levels";
+					return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+						flexDirection: "row",
+						children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+							fg: isEnabled ? levelColor : theme.filter.inactiveLevel,
+							attributes: isLevelsFocused ? _opentui_core.TextAttributes.BOLD : void 0,
+							children: [
+								index + 1,
+								":",
+								LEVEL_LABELS[level]
+							]
+						}), count > 0 && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+							fg: theme.filter.textDim,
+							children: [
+								"(",
+								count > 99 ? "99+" : count,
+								")"
+							]
+						})]
+					}, level);
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				flexDirection: "row",
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.filter.textDim,
+					children: "Tab: switch fields | 1-7: toggle levels | Esc: close"
+				})
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/help/help_overlay.tsx
+const CATEGORY_ORDER = [
+	"general",
+	"navigation",
+	"screen",
+	"filter",
+	"prompt"
+];
+const CATEGORY_LABELS = {
+	general: "General",
+	navigation: "Navigation",
+	screen: "Screen",
+	filter: "Filter",
+	prompt: "Prompts"
+};
+function groupByCategory(bindings) {
+	const grouped = {
+		general: [],
+		navigation: [],
+		screen: [],
+		filter: [],
+		prompt: []
+	};
+	for (const binding of bindings) if (binding.description) grouped[binding.category].push(binding);
+	return grouped;
+}
+function HelpOverlay({ bindings }) {
+	const theme = useTheme();
+	const grouped = groupByCategory(bindings);
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		position: "absolute",
+		top: 1,
+		left: 2,
+		right: 2,
+		bottom: 1,
+		backgroundColor: theme.help.background,
+		borderColor: theme.help.border,
+		border: [
+			"top",
+			"bottom",
+			"left",
+			"right"
+		],
+		flexDirection: "column",
+		paddingLeft: 2,
+		paddingRight: 2,
+		paddingTop: 1,
+		paddingBottom: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				marginBottom: 1,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.help.title,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: "Keyboard Shortcuts"
+				})
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("scrollbox", {
+				scrollY: true,
+				flexGrow: 1,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+					flexDirection: "column",
+					gap: 1,
+					children: CATEGORY_ORDER.map((category) => {
+						const categoryBindings = grouped[category];
+						if (categoryBindings.length === 0) return null;
+						return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+							flexDirection: "column",
+							children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+								fg: theme.help.category,
+								attributes: _opentui_core.TextAttributes.BOLD,
+								children: CATEGORY_LABELS[category]
+							}), categoryBindings.map((binding, index) => /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+								flexDirection: "row",
+								paddingLeft: 2,
+								children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+									fg: theme.help.key,
+									width: 14,
+									children: require_filter_engine.formatKeyBinding(binding)
+								}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+									fg: theme.help.description,
+									children: binding.description
+								})]
+							}, `${binding.key}-${index}`))]
+						}, category);
+					})
+				})
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				marginTop: 1,
+				borderColor: theme.separator.line,
+				border: ["top"],
+				paddingTop: 1,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.help.hint,
+					children: "Press ? or Esc to close"
+				})
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/prompt/prompt_renderer.tsx
+function PromptRenderer({ prompt }) {
+	const theme = useTheme();
+	const timeoutRemaining = getTimeoutRemaining(prompt);
+	switch (prompt.type) {
+		case "choice": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(ChoicePromptRenderer, {
+			prompt,
+			timeoutRemaining,
+			colors: theme.prompt
+		});
+		case "confirm": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(ConfirmPromptRenderer, {
+			prompt,
+			timeoutRemaining,
+			colors: theme.prompt
+		});
+		case "input": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(InputPromptRenderer, {
+			prompt,
+			timeoutRemaining,
+			colors: theme.prompt
+		});
+		case "multiChoice": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(MultiChoicePromptRenderer, {
+			prompt,
+			timeoutRemaining,
+			colors: theme.prompt
+		});
+		default: return null;
+	}
+}
+function getTimeoutRemaining(prompt) {
+	if (!prompt.timeout || !prompt.timeoutStarted) return null;
+	const elapsed = Date.now() - prompt.timeoutStarted;
+	const remaining = Math.max(0, prompt.timeout - elapsed);
+	return Math.ceil(remaining / 1e3);
+}
+function TimeoutIndicator({ seconds, colors }) {
+	if (seconds === null) return null;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+		fg: colors.optionTextDim,
+		attributes: _opentui_core.TextAttributes.DIM,
+		children: [
+			" ",
+			"(auto-select in ",
+			seconds,
+			"s)"
+		]
+	});
+}
+function ChoicePromptRenderer({ prompt, timeoutRemaining, colors }) {
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		borderColor: colors.focusBorder,
+		border: ["left"],
+		paddingLeft: 1,
+		paddingRight: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: colors.question,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: ["? ", prompt.question]
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(TimeoutIndicator, {
+					seconds: timeoutRemaining,
+					colors
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				flexDirection: "column",
+				children: prompt.choices.map((choice, index) => {
+					const isSelected = index === prompt.selectedIndex;
+					const showInput = isSelected && choice.input && prompt.inputMode;
+					return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+						flexDirection: "row",
+						children: [
+							/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+								fg: isSelected ? colors.optionSelected : "transparent",
+								children: [">", " "]
+							}),
+							/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+								fg: isSelected ? colors.optionText : colors.optionTextDim,
+								attributes: isSelected ? _opentui_core.TextAttributes.BOLD : void 0,
+								children: choice.label
+							}),
+							showInput && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+								flexDirection: "row",
+								marginLeft: 1,
+								children: [
+									/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+										fg: colors.inputText,
+										children: ": "
+									}),
+									/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+										fg: colors.inputText,
+										children: prompt.inputValue
+									}),
+									/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+										fg: colors.inputCursor,
+										attributes: _opentui_core.TextAttributes.BLINK,
+										children: "_"
+									})
+								]
+							}),
+							isSelected && choice.input && !prompt.inputMode && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+								fg: colors.optionTextDim,
+								children: " (press Enter to type)"
+							})
+						]
+					}, choice.value);
+				})
+			}),
+			prompt.inputMode ? /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: colors.optionTextDim,
+				attributes: _opentui_core.TextAttributes.DIM,
+				children: "Type your answer, Enter to submit, Esc to cancel"
+			}) : /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: colors.optionTextDim,
+				attributes: _opentui_core.TextAttributes.DIM,
+				children: "↑/↓ to navigate, Enter to select"
+			})
+		]
+	});
+}
+function ConfirmPromptRenderer({ prompt, timeoutRemaining, colors }) {
+	const confirmSelected = prompt.selectedValue === true;
+	const cancelSelected = prompt.selectedValue === false;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		borderColor: colors.focusBorder,
+		border: ["left"],
+		paddingLeft: 1,
+		paddingRight: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: colors.question,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: ["? ", prompt.question]
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(TimeoutIndicator, {
+					seconds: timeoutRemaining,
+					colors
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				gap: 2,
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+					backgroundColor: confirmSelected ? colors.buttonSelectedBackground : void 0,
+					paddingLeft: 1,
+					paddingRight: 1,
+					children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+						fg: confirmSelected ? colors.confirmButton : colors.optionTextDim,
+						attributes: confirmSelected ? _opentui_core.TextAttributes.BOLD : void 0,
+						children: [
+							confirmSelected ? ">" : " ",
+							" ",
+							prompt.confirmText
+						]
+					})
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+					backgroundColor: cancelSelected ? colors.buttonSelectedBackground : void 0,
+					paddingLeft: 1,
+					paddingRight: 1,
+					children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+						fg: cancelSelected ? colors.cancelButton : colors.optionTextDim,
+						attributes: cancelSelected ? _opentui_core.TextAttributes.BOLD : void 0,
+						children: [
+							cancelSelected ? ">" : " ",
+							" ",
+							prompt.cancelText
+						]
+					})
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: colors.optionTextDim,
+				attributes: _opentui_core.TextAttributes.DIM,
+				children: "←/→ to select, Enter to confirm"
+			})
+		]
+	});
+}
+function InputPromptRenderer({ prompt, timeoutRemaining, colors }) {
+	const hasValue = prompt.value.length > 0;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		borderColor: colors.focusBorder,
+		border: ["left"],
+		paddingLeft: 1,
+		paddingRight: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: colors.question,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: ["? ", prompt.question]
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(TimeoutIndicator, {
+					seconds: timeoutRemaining,
+					colors
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				borderColor: colors.inputBorder,
+				border: ["left"],
+				paddingLeft: 1,
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: hasValue ? colors.inputText : colors.inputPlaceholder,
+					children: hasValue ? prompt.value : prompt.placeholder
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: colors.inputCursor,
+					attributes: _opentui_core.TextAttributes.BLINK,
+					children: "_"
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: colors.optionTextDim,
+				attributes: _opentui_core.TextAttributes.DIM,
+				children: "Type your answer, Enter to submit"
+			})
+		]
+	});
+}
+function MultiChoicePromptRenderer({ prompt, timeoutRemaining, colors }) {
+	const selectedCount = prompt.selectedIndices.size;
+	const canSubmit = selectedCount >= prompt.minSelect;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		borderColor: colors.focusBorder,
+		border: ["left"],
+		paddingLeft: 1,
+		paddingRight: 1,
+		gap: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				children: [
+					/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+						fg: colors.question,
+						attributes: _opentui_core.TextAttributes.BOLD,
+						children: ["? ", prompt.question]
+					}),
+					/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+						fg: colors.optionTextDim,
+						children: [
+							" ",
+							"(",
+							selectedCount,
+							"/",
+							prompt.maxSelect,
+							" selected)"
+						]
+					}),
+					/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(TimeoutIndicator, {
+						seconds: timeoutRemaining,
+						colors
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				flexDirection: "column",
+				children: prompt.choices.map((choice, index) => {
+					const isFocused = index === prompt.focusedIndex;
+					const isChecked = prompt.selectedIndices.has(index);
+					return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+						flexDirection: "row",
+						children: [
+							/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+								fg: isFocused ? colors.optionSelected : "transparent",
+								children: [">", " "]
+							}),
+							/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+								fg: isChecked ? colors.optionSelected : colors.optionTextDim,
+								children: [isChecked ? "[✓]" : "[ ]", " "]
+							}),
+							/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+								fg: isFocused ? colors.optionText : colors.optionTextDim,
+								attributes: isFocused ? _opentui_core.TextAttributes.BOLD : void 0,
+								children: choice.label
+							})
+						]
+					}, choice.value);
+				})
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "column",
+				children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: colors.optionTextDim,
+					attributes: _opentui_core.TextAttributes.DIM,
+					children: "↑/↓ to navigate, Space to toggle"
+				}), canSubmit ? /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: colors.optionTextDim,
+					attributes: _opentui_core.TextAttributes.DIM,
+					children: "Enter to confirm"
+				}) : /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: colors.cancelButton,
+					attributes: _opentui_core.TextAttributes.DIM,
+					children: [
+						"Select at least ",
+						prompt.minSelect,
+						" option",
+						prompt.minSelect > 1 ? "s" : ""
+					]
+				})]
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/file/file_log.tsx
+/**
+* FileLog - Displays file content, diffs, or partial files with error highlighting.
+*
+* Three modes:
+* 1. "full" - Display complete file with syntax highlighting
+* 2. "diff" - Display unified diff using <diff> component
+* 3. "partial" - Display file excerpt with optional error line highlighting
+*
+* @example Full file
+* <FileLog
+*   mode="full"
+*   filePath="src/index.ts"
+*   content={fileContent}
+* />
+*
+* @example Diff
+* <FileLog
+*   mode="diff"
+*   filePath="src/api.ts"
+*   diff={unifiedDiff}
+*   view="unified"
+* />
+*
+* @example Partial with error
+* <FileLog
+*   mode="partial"
+*   filePath="src/utils.ts"
+*   content={excerpt}
+*   startLine={42}
+*   errorLines={[45, 46]}
+* />
+*/ function FileLog(props) {
+	const { syntaxStyle, treeSitterClient } = useLoggerContext();
+	const filetype = props.filetype ?? require_filter_engine.resolveFiletype(props.filePath);
+	const showHeader = props.showHeader ?? true;
+	const showLineNumbers = props.showLineNumbers ?? true;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		marginBottom: 1,
+		children: [
+			showHeader && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				backgroundColor: props.headerBackgroundColor ?? require_filter_engine.HEADER_COLORS.background,
+				paddingLeft: 1,
+				paddingRight: 1,
+				border: ["bottom"],
+				borderColor: require_filter_engine.HEADER_COLORS.border,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: require_filter_engine.HEADER_COLORS.text,
+					children: props.filePath
+				})
+			}),
+			props.mode === "full" && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLogFull, {
+				...props,
+				filetype,
+				syntaxStyle,
+				treeSitterClient,
+				showLineNumbers
+			}),
+			props.mode === "diff" && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLogDiff, {
+				...props,
+				filetype,
+				syntaxStyle,
+				treeSitterClient
+			}),
+			props.mode === "partial" && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLogPartial, {
+				...props,
+				filetype,
+				syntaxStyle,
+				treeSitterClient,
+				showLineNumbers
+			})
+		]
+	});
+}
+/**
+* Full file display with syntax highlighting.
+*/ function FileLogFull({ content, filetype, syntaxStyle, treeSitterClient }) {
+	if (!syntaxStyle) return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+		paddingLeft: 1,
+		paddingRight: 1,
+		children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", { children: content })
+	});
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("code", {
+		content,
+		filetype,
+		syntaxStyle,
+		treeSitterClient
+	});
+}
+/**
+* Diff display using the built-in <diff> component.
+*/ function FileLogDiff({ diff, view = "unified", filetype, syntaxStyle, treeSitterClient }) {
+	if (!syntaxStyle) return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+		paddingLeft: 1,
+		paddingRight: 1,
+		children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", { children: diff })
+	});
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("diff", {
+		diff,
+		view,
+		filetype,
+		syntaxStyle,
+		treeSitterClient
+	});
+}
+/**
+* Partial file display with error line highlighting.
+*
+* This component renders a file excerpt and highlights specific lines
+* as errors using box overlays with colored backgrounds.
+*/ function FileLogPartial({ content, startLine, errorLines = [], errorLineBackground, errorLineBorderColor, filetype, syntaxStyle, treeSitterClient, showLineNumbers }) {
+	const lines = (0, react.useMemo)(() => content.split("\n"), [content]);
+	const errorLineSet = (0, react.useMemo)(() => new Set(errorLines), [errorLines]);
+	const errorBg = errorLineBackground ?? require_filter_engine.ERROR_HIGHLIGHT_COLORS.background;
+	const errorBorder = errorLineBorderColor ?? require_filter_engine.ERROR_HIGHLIGHT_COLORS.border;
+	const maxLineNum = startLine + lines.length - 1;
+	const lineNumWidth = Math.max(4, String(maxLineNum).length + 1);
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+		flexDirection: "column",
+		children: lines.map((line, index) => {
+			const lineNumber = startLine + index;
+			const isError = errorLineSet.has(lineNumber);
+			return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				backgroundColor: isError ? errorBg : void 0,
+				border: isError ? ["left"] : void 0,
+				borderColor: isError ? errorBorder : void 0,
+				children: [showLineNumbers && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+					width: lineNumWidth,
+					backgroundColor: isError ? require_filter_engine.ERROR_HIGHLIGHT_COLORS.gutterBackground : require_filter_engine.HEADER_COLORS.background,
+					paddingRight: 1,
+					children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+						fg: "#6B7280",
+						children: String(lineNumber).padStart(lineNumWidth - 1)
+					})
+				}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+					flexGrow: 1,
+					paddingLeft: 1,
+					children: syntaxStyle ? /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("code", {
+						content: line,
+						filetype,
+						syntaxStyle,
+						treeSitterClient
+					}) : /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", { children: line })
+				})]
+			}, lineNumber);
+		})
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/log/log_message.tsx
+/**
+* LogMessage - A chat-like styled log message with level-based coloring.
+*
+* Features:
+* - Left border with prominent color based on log level
+* - Subtle tinted background matching the log level
+* - Optional timestamp and label display
+* - Supports both simple text and complex React children
+* - Optional variant for semantic styling (e.g., 'success', 'trace')
+*
+* @example
+* <LogMessage level="error">
+*   Connection failed: timeout after 30s
+* </LogMessage>
+*
+* @example
+* <LogMessage level="log" timestamp={new Date()} label="API">
+*   Request completed successfully
+* </LogMessage>
+*
+* @example
+* <LogMessage level="log" variant="success">
+*   Operation completed successfully
+* </LogMessage>
+*/ function LogMessage({ level, variant, children, timestamp, label, trace, borderColor: customBorderColor, backgroundColor: customBackgroundColor, borderStyle = "thin", padding = 1, margin = 0 }) {
+	const theme = useTheme();
+	const levelColors = variant ? require_filter_engine.VARIANT_COLORS[variant] : theme.logLevels[level];
+	const borderColor = customBorderColor ?? levelColors.border;
+	const backgroundColor = customBackgroundColor ?? levelColors.background;
+	const textColor = levelColors.text ?? theme.colors.foreground;
+	const borderSides = borderStyle === "thin" ? ["left"] : [
+		"left",
+		"top",
+		"bottom"
+	];
+	const formattedTimestamp = timestamp ? timestamp instanceof Date ? timestamp.toLocaleTimeString() : timestamp : null;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		border: borderSides,
+		borderColor,
+		backgroundColor,
+		paddingLeft: padding,
+		paddingRight: padding,
+		marginBottom: margin,
+		children: [
+			(formattedTimestamp || label) && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+				flexDirection: "row",
+				gap: 1,
+				children: [formattedTimestamp && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.colors.muted,
+					children: formattedTimestamp
+				}), label && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: levelColors.border,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: [
+						"[",
+						label,
+						"]"
+					]
+				})]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: textColor,
+				children
+			}),
+			trace && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				marginTop: 1,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.colors.muted,
+					children: trace
+				})
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/loading_message.tsx
+const SPINNER_FRAMES = [
+	"⠋",
+	"⠙",
+	"⠹",
+	"⠸",
+	"⠼",
+	"⠴",
+	"⠦",
+	"⠧",
+	"⠇",
+	"⠏"
+];
+function LoadingMessage({ message }) {
+	const [frameIndex, setFrameIndex] = (0, react.useState)(0);
+	const intervalRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		if (message.status === "loading") intervalRef.current = setInterval(() => {
+			setFrameIndex((prev) => (prev + 1) % SPINNER_FRAMES.length);
+		}, 80);
+		return () => {
+			if (intervalRef.current) clearInterval(intervalRef.current);
+		};
+	}, [message.status]);
+	const level = message.status === "fail" ? "error" : "log";
+	const variant = message.status === "success" ? "success" : void 0;
+	const displayContent = message.resolvedContent ?? message.content;
+	const spinner = message.status === "loading" ? SPINNER_FRAMES[frameIndex] + " " : "";
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(LogMessage, {
+		level,
+		variant,
+		timestamp: message.timestamp,
+		children: spinner + displayContent
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/progress_message.tsx
+function ProgressMessage({ message }) {
+	const theme = useTheme();
+	const percent = Math.round(message.current / message.total * 100);
+	const barWidth = 20;
+	const filled = Math.round(percent / 100 * barWidth);
+	const empty = barWidth - filled;
+	const barFilled = "█".repeat(filled);
+	const barEmpty = "░".repeat(empty);
+	const borderColor = message.status === "complete" ? theme.progress.complete : message.status === "failed" ? theme.progress.failed : theme.progress.border;
+	const backgroundColor = message.status === "complete" ? theme.progress.completeBackground : message.status === "failed" ? theme.progress.failedBackground : theme.progress.background;
+	const barColor = message.status === "complete" ? theme.progress.complete : message.status === "failed" ? theme.progress.failed : theme.progress.barFilled;
+	const displayLabel = message.resolvedContent ?? message.label;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+		flexDirection: "column",
+		border: ["left"],
+		borderColor,
+		backgroundColor,
+		paddingLeft: 1,
+		paddingRight: 1,
+		children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+			flexDirection: "row",
+			gap: 1,
+			children: [
+				/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: barColor,
+					children: ["[", barFilled]
+				}),
+				/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: theme.progress.barEmpty,
+					children: [barEmpty, "]"]
+				}),
+				/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+					fg: theme.progress.textDim,
+					children: [percent, "%"]
+				}),
+				/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.progress.text,
+					children: displayLabel
+				})
+			]
+		})
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/table_message.tsx
+function TableMessage({ message }) {
+	const colWidths = message.headers.map((h, i) => {
+		const headerLen = h.length;
+		const maxRowLen = message.rows.length > 0 ? Math.max(...message.rows.map((r) => (r[i] ?? "").length)) : 0;
+		return Math.max(headerLen, maxRowLen);
+	});
+	const pad = (str, width) => str.padEnd(width);
+	const headerRow = message.headers.map((h, i) => pad(h, colWidths[i] ?? 0)).join(" │ ");
+	const separator = colWidths.map((w) => "─".repeat(w)).join("─┼─");
+	const dataRows = message.rows.map((row) => row.map((cell, i) => pad(cell, colWidths[i] ?? 0)).join(" │ "));
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		border: ["left"],
+		borderColor: require_filter_engine.TABLE_COLORS.border,
+		backgroundColor: require_filter_engine.TABLE_COLORS.background,
+		paddingLeft: 1,
+		paddingRight: 1,
+		children: [
+			message.title && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: require_filter_engine.TABLE_COLORS.title,
+				attributes: _opentui_core.TextAttributes.BOLD,
+				children: message.title
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: require_filter_engine.TABLE_COLORS.headerText,
+				attributes: _opentui_core.TextAttributes.BOLD,
+				children: headerRow
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: require_filter_engine.TABLE_COLORS.separator,
+				children: separator
+			}),
+			dataRows.map((row, i) => /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: require_filter_engine.TABLE_COLORS.cellText,
+				children: row
+			}, i))
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/message_renderer.tsx
+function MessageRenderer({ message }) {
+	const theme = useTheme();
+	switch (message.type) {
+		case "log": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(LogMessage, {
+			level: message.level,
+			timestamp: message.timestamp,
+			variant: message.variant,
+			label: message.label,
+			trace: message.trace,
+			children: message.content
+		});
+		case "file": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+			flexDirection: "column",
+			border: ["left"],
+			borderColor: theme.file.border,
+			backgroundColor: theme.file.background,
+			children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLog, {
+				mode: "full",
+				filePath: message.filePath,
+				content: message.content,
+				headerBackgroundColor: theme.file.headerBackground
+			})
+		});
+		case "diff": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+			flexDirection: "column",
+			border: ["left"],
+			borderColor: theme.file.border,
+			backgroundColor: theme.file.background,
+			children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLog, {
+				mode: "diff",
+				filePath: message.filePath,
+				diff: message.diff,
+				view: message.view,
+				headerBackgroundColor: theme.file.headerBackground
+			})
+		});
+		case "fileError": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+			flexDirection: "column",
+			border: ["left"],
+			borderColor: theme.file.border,
+			backgroundColor: theme.file.background,
+			children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FileLog, {
+				mode: "partial",
+				filePath: message.filePath,
+				content: message.content,
+				startLine: message.startLine,
+				errorLines: message.errorLines,
+				headerBackgroundColor: theme.file.headerBackground
+			})
+		});
+		case "loading": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(LoadingMessage, { message });
+		case "progress": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(ProgressMessage, { message });
+		case "group": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(GroupMessageRenderer, { message });
+		case "table": return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(TableMessage, { message });
+		default: return null;
+	}
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/group_renderer.tsx
+function GroupRenderer({ label, messages }) {
+	const theme = useTheme();
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		border: ["left"],
+		borderColor: theme.group.border,
+		backgroundColor: theme.group.background,
+		paddingLeft: 1,
+		children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+			flexDirection: "row",
+			marginBottom: 1,
+			children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: theme.group.icon,
+				children: "▼ "
+			}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: theme.group.headerText,
+				attributes: _opentui_core.TextAttributes.BOLD,
+				children: label
+			})]
+		}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+			flexDirection: "column",
+			gap: 1,
+			children: messages.map((msg) => /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(MessageRenderer, { message: msg }, msg.id))
+		})]
+	});
+}
+/**
+* Fallback renderer for group markers (when not processed at higher level)
+*/ function GroupMessageRenderer({ message }) {
+	const theme = useTheme();
+	if (message.isEnd) return null;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+		flexDirection: "row",
+		borderColor: theme.group.border,
+		border: ["left"],
+		paddingLeft: 1,
+		children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+			fg: theme.group.headerText,
+			attributes: _opentui_core.TextAttributes.BOLD,
+			children: ["▼ ", message.label]
+		})
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen/screen_bridge.tsx
+function processMessagesIntoGroups(messages) {
+	const result = [];
+	let i = 0;
+	while (i < messages.length) {
+		const msg = messages[i];
+		if (msg.type === "group" && !msg.isEnd) {
+			const groupLabel = msg.label;
+			const groupMessages = [];
+			i++;
+			while (i < messages.length) {
+				const innerMsg = messages[i];
+				if (innerMsg.type === "group" && innerMsg.isEnd) {
+					i++;
+					break;
+				}
+				groupMessages.push(innerMsg);
+				i++;
+			}
+			result.push({
+				type: "group",
+				label: groupLabel,
+				messages: groupMessages
+			});
+		} else if (msg.type === "group" && msg.isEnd) i++;
+		else {
+			result.push({
+				type: "single",
+				message: msg
+			});
+			i++;
+		}
+	}
+	return result;
+}
+function ScreenBridge({ screen, focused, filteredMessages, isFiltering, totalMessages }) {
+	const theme = useTheme();
+	const [, forceUpdate] = (0, react.useState)({});
+	(0, react.useEffect)(() => {
+		return screen.onChange(() => forceUpdate({}));
+	}, [screen]);
+	const messages = filteredMessages ?? screen.getMessages();
+	const activePrompt = screen.getActivePrompt();
+	const processedMessages = processMessagesIntoGroups(messages);
+	const filteredCount = messages.length;
+	const total = totalMessages ?? messages.length;
+	const showFilterStatus = isFiltering && filteredCount !== total;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		flexGrow: 1,
+		children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+			backgroundColor: theme.header.background,
+			borderColor: focused ? theme.sidebar.focusBorder : theme.header.border,
+			border: ["bottom"],
+			paddingLeft: 1,
+			paddingRight: 1,
+			flexDirection: "row",
+			justifyContent: "space-between",
+			children: [/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: theme.header.text,
+				attributes: _opentui_core.TextAttributes.BOLD,
+				children: screen.getName()
+			}), showFilterStatus && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+				fg: theme.sidebar.textDim,
+				children: [
+					filteredCount,
+					"/",
+					total,
+					" messages"
+				]
+			})]
+		}), /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("scrollbox", {
+			flexGrow: 1,
+			scrollY: true,
+			stickyScroll: true,
+			stickyStart: "bottom",
+			contentOptions: {
+				paddingLeft: 1,
+				paddingRight: 1,
+				paddingTop: 1,
+				paddingBottom: 1,
+				gap: 1
+			},
+			children: [processedMessages.map((item, index) => {
+				if (item.type === "group") return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(GroupRenderer, {
+					label: item.label,
+					messages: item.messages
+				}, `group-${index}`);
+				else return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(MessageRenderer, { message: item.message }, item.message.id);
+			}), activePrompt && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(PromptRenderer, { prompt: activePrompt })]
+		})]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/sidebar/sidebar_item.tsx
+function SidebarItem({ screen, isSelected, isActive, focused }) {
+	const theme = useTheme();
+	const status = screen.getStatus();
+	const statusIndicator = theme.statusIndicators[status];
+	let backgroundColor = void 0;
+	if (isSelected && focused) backgroundColor = theme.sidebar.selectedBackground;
+	else if (isActive) backgroundColor = theme.sidebar.selectedBackground + "80";
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "row",
+		paddingLeft: 1,
+		paddingRight: 1,
+		backgroundColor,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+				fg: isSelected && focused ? theme.sidebar.focusBorder : "transparent",
+				children: [">", " "]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("text", {
+				fg: statusIndicator.color,
+				children: [statusIndicator.icon, " "]
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: isActive ? theme.sidebar.text : theme.sidebar.textDim,
+				flexGrow: 1,
+				children: screen.getName()
+			}),
+			screen.getBadgeCount() > 0 && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				backgroundColor: theme.sidebar.badge,
+				paddingLeft: 1,
+				paddingRight: 1,
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.colors.foreground,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: screen.getBadgeCount() > 99 ? "99+" : screen.getBadgeCount()
+				})
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/sidebar/sidebar_separator.tsx
+function SidebarSeparator() {
+	const theme = useTheme();
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "row",
+		paddingTop: 1,
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", { flexGrow: 1 }),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+				fg: theme.separator.line,
+				children: "· · ·"
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", { flexGrow: 1 })
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/sidebar/sidebar.tsx
+function Sidebar({ screens, selectedIndex, activeScreenId, focused, width, title }) {
+	const theme = useTheme();
+	const pendingScreens = [];
+	const otherScreens = [];
+	screens.forEach((screen, index) => {
+		if (screen.getStatus() === "pending") pendingScreens.push({
+			screen,
+			originalIndex: index
+		});
+		else otherScreens.push({
+			screen,
+			originalIndex: index
+		});
+	});
+	const hasPending = pendingScreens.length > 0;
+	const hasOther = otherScreens.length > 0;
+	const showSeparator = hasPending && hasOther;
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		width,
+		borderColor: focused ? theme.sidebar.focusBorder : theme.sidebar.border,
+		border: ["right"],
+		children: [
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				backgroundColor: theme.header.background,
+				paddingLeft: 1,
+				paddingRight: 1,
+				borderColor: theme.header.border,
+				border: ["bottom"],
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.header.text,
+					attributes: _opentui_core.TextAttributes.BOLD,
+					children: title
+				})
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("scrollbox", {
+				scrollY: true,
+				stickyScroll: false,
+				flexGrow: 1,
+				contentOptions: { flexGrow: 1 },
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+					flexDirection: "column",
+					children: [
+						pendingScreens.map(({ screen, originalIndex }) => /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(SidebarItem, {
+							screen,
+							isSelected: originalIndex === selectedIndex,
+							isActive: screen.getId() === activeScreenId,
+							focused
+						}, screen.getId())),
+						showSeparator && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(SidebarSeparator, {}),
+						otherScreens.map(({ screen, originalIndex }) => /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(SidebarItem, {
+							screen,
+							isSelected: originalIndex === selectedIndex,
+							isActive: screen.getId() === activeScreenId,
+							focused
+						}, screen.getId()))
+					]
+				})
+			}),
+			/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("box", {
+				paddingLeft: 1,
+				paddingRight: 1,
+				borderColor: theme.sidebar.border,
+				border: ["top"],
+				children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)("text", {
+					fg: theme.sidebar.text,
+					children: "q: exit | Tab: focus | ?: help"
+				})
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/adapters/react/components/screen_manager_bridge.tsx
+function ScreenManagerBridge({ manager, theme }) {
+	const [, forceUpdate] = (0, react.useState)({});
+	const [showHelp, setShowHelp] = (0, react.useState)(false);
+	const [filter, setFilter] = (0, react.useState)(require_filter_engine.createDefaultFilterState);
+	(0, react.useEffect)(() => {
+		return manager.onChange(() => forceUpdate({}));
+	}, [manager]);
+	const getActiveScreen = (0, react.useCallback)(() => manager.getActiveScreen(), [manager]);
+	const toggleHelp = (0, react.useCallback)(() => {
+		setShowHelp((prev) => !prev);
+	}, []);
+	const toggleFilter = (0, react.useCallback)(() => {
+		setFilter((prev) => ({
+			...prev,
+			isVisible: !prev.isVisible,
+			focusedField: "search"
+		}));
+	}, []);
+	const closeFilter = (0, react.useCallback)(() => {
+		setFilter((prev) => ({
+			...prev,
+			isVisible: false
+		}));
+	}, []);
+	const filterAppendChar = (0, react.useCallback)((char) => {
+		setFilter((prev) => ({
+			...prev,
+			searchQuery: prev.searchQuery + char
+		}));
+	}, []);
+	const filterDeleteChar = (0, react.useCallback)(() => {
+		setFilter((prev) => ({
+			...prev,
+			searchQuery: prev.searchQuery.slice(0, -1)
+		}));
+	}, []);
+	const filterToggleLevel = (0, react.useCallback)((index) => {
+		setFilter((prev) => {
+			const level = require_filter_engine.ALL_LOG_LEVELS[index];
+			if (!level) return prev;
+			const newLevels = new Set(prev.enabledLevels);
+			if (newLevels.has(level)) newLevels.delete(level);
+			else newLevels.add(level);
+			return {
+				...prev,
+				enabledLevels: newLevels
+			};
+		});
+	}, []);
+	const filterCycleField = (0, react.useCallback)(() => {
+		setFilter((prev) => ({
+			...prev,
+			focusedField: prev.focusedField === "search" ? "levels" : "search"
+		}));
+	}, []);
+	const keyboardManager = (0, react.useMemo)(() => {
+		const km = new require_filter_engine.KeyboardManager();
+		const bindings = require_filter_engine.createDefaultBindings({
+			manager,
+			getActiveScreen,
+			toggleHelp,
+			toggleFilter,
+			closeFilter,
+			filterAppendChar,
+			filterDeleteChar,
+			filterToggleLevel,
+			filterCycleField
+		});
+		km.addBindings(bindings);
+		return km;
+	}, [
+		manager,
+		getActiveScreen,
+		toggleHelp,
+		toggleFilter,
+		closeFilter,
+		filterAppendChar,
+		filterDeleteChar,
+		filterToggleLevel,
+		filterCycleField
+	]);
+	(0, _opentui_react.useKeyboard)((0, react.useCallback)((key) => {
+		const screens$1 = manager.getScreens();
+		const activeScreen$1 = manager.getActiveScreen();
+		const context = {
+			hasSidebar: screens$1.length > 1,
+			focusArea: manager.focusArea,
+			hasPrompt: activeScreen$1?.hasActivePrompt() ?? false,
+			inInputMode: activeScreen$1?.isPromptInInputMode() ?? false,
+			isFilterActive: filter.isVisible,
+			isHelpVisible: showHelp
+		};
+		if (keyboardManager.handleKey(key, context)) return;
+		require_filter_engine.handlePrintableInput(key, context, {
+			manager,
+			getActiveScreen,
+			toggleHelp,
+			toggleFilter,
+			closeFilter,
+			filterAppendChar,
+			filterDeleteChar,
+			filterToggleLevel,
+			filterCycleField
+		});
+	}, [
+		manager,
+		keyboardManager,
+		filter.isVisible,
+		showHelp,
+		getActiveScreen,
+		toggleHelp,
+		toggleFilter,
+		closeFilter,
+		filterAppendChar,
+		filterDeleteChar,
+		filterToggleLevel,
+		filterCycleField
+	]));
+	const screens = manager.getScreens();
+	const activeScreen = manager.getActiveScreen();
+	const activeScreenId = activeScreen?.getId() ?? screens[0]?.getId() ?? "";
+	const bindOptions = manager.getBindOptions();
+	const hasSidebar = screens.length > 1;
+	const activeScreenVersion = (0, react.useSyncExternalStore)((updater) => activeScreen?.onChange(updater) ?? (() => {}), () => activeScreen?.getVersion() ?? -1);
+	const levelCounts = (0, react.useMemo)(() => {
+		if (!activeScreen) return {
+			verbose: 0,
+			debug: 0,
+			log: 0,
+			warn: 0,
+			error: 0,
+			fatal: 0
+		};
+		return require_filter_engine.FilterEngine.countByLevel(activeScreen.getMessages());
+	}, [activeScreenVersion, activeScreen]);
+	const filteredMessages = (0, react.useMemo)(() => {
+		if (!activeScreen) return [];
+		return require_filter_engine.FilterEngine.filterMessages(activeScreen.getMessages(), filter);
+	}, [
+		activeScreenVersion,
+		activeScreen,
+		filter
+	]);
+	const isFiltering = (0, react.useMemo)(() => require_filter_engine.hasActiveFilter(filter), [filter]);
+	return /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(LoggerProvider, {
+		theme,
+		children: /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+			flexDirection: "row",
+			flexGrow: 1,
+			children: [
+				hasSidebar && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(Sidebar, {
+					screens,
+					selectedIndex: manager.selectedIndex,
+					activeScreenId,
+					focused: manager.focusArea === "sidebar",
+					width: bindOptions.sidebarWidth ?? 25,
+					title: bindOptions.sidebarTitle ?? "Screens"
+				}),
+				/* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsxs)("box", {
+					flexDirection: "column",
+					flexGrow: 1,
+					children: [filter.isVisible && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(FilterBar, {
+						filter,
+						levelCounts
+					}), activeScreen && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(ScreenBridge, {
+						screen: activeScreen,
+						focused: manager.focusArea === "content",
+						filteredMessages,
+						isFiltering,
+						totalMessages: activeScreen.getMessages().length
+					}, activeScreen.getId())]
+				}),
+				showHelp && /* @__PURE__ */ (0, _opentui_react_jsx_runtime.jsx)(HelpOverlay, { bindings: keyboardManager.getBindingsForHelp() })
+			]
+		})
+	});
+}
+
+//#endregion
+//#region src/adapters/react/index.ts
+function applyDecs2203RFactory() {
+	function createAddInitializerMethod(initializers, decoratorFinishedRef) {
+		return function addInitializer(initializer) {
+			assertNotFinished(decoratorFinishedRef, "addInitializer");
+			assertCallable(initializer, "An initializer");
+			initializers.push(initializer);
+		};
+	}
+	function memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value) {
+		var kindStr;
+		switch (kind) {
+			case 1:
+				kindStr = "accessor";
+				break;
+			case 2:
+				kindStr = "method";
+				break;
+			case 3:
+				kindStr = "getter";
+				break;
+			case 4:
+				kindStr = "setter";
+				break;
+			default: kindStr = "field";
+		}
+		var ctx = {
+			kind: kindStr,
+			name: isPrivate ? "#" + name : name,
+			static: isStatic,
+			private: isPrivate,
+			metadata
+		};
+		var decoratorFinishedRef = { v: false };
+		ctx.addInitializer = createAddInitializerMethod(initializers, decoratorFinishedRef);
+		var get, set;
+		if (kind === 0) if (isPrivate) {
+			get = desc.get;
+			set = desc.set;
+		} else {
+			get = function() {
+				return this[name];
+			};
+			set = function(v) {
+				this[name] = v;
+			};
+		}
+		else if (kind === 2) get = function() {
+			return desc.value;
+		};
+		else {
+			if (kind === 1 || kind === 3) get = function() {
+				return desc.get.call(this);
+			};
+			if (kind === 1 || kind === 4) set = function(v) {
+				desc.set.call(this, v);
+			};
+		}
+		ctx.access = get && set ? {
+			get,
+			set
+		} : get ? { get } : { set };
+		try {
+			return dec(value, ctx);
+		} finally {
+			decoratorFinishedRef.v = true;
+		}
+	}
+	function assertNotFinished(decoratorFinishedRef, fnName) {
+		if (decoratorFinishedRef.v) throw new Error("attempted to call " + fnName + " after decoration was finished");
+	}
+	function assertCallable(fn, hint) {
+		if (typeof fn !== "function") throw new TypeError(hint + " must be a function");
+	}
+	function assertValidReturnValue(kind, value) {
+		var type = typeof value;
+		if (kind === 1) {
+			if (type !== "object" || value === null) throw new TypeError("accessor decorators must return an object with get, set, or init properties or void 0");
+			if (value.get !== void 0) assertCallable(value.get, "accessor.get");
+			if (value.set !== void 0) assertCallable(value.set, "accessor.set");
+			if (value.init !== void 0) assertCallable(value.init, "accessor.init");
+		} else if (type !== "function") {
+			var hint;
+			if (kind === 0) hint = "field";
+			else if (kind === 10) hint = "class";
+			else hint = "method";
+			throw new TypeError(hint + " decorators must return a function or void 0");
+		}
+	}
+	function applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata) {
+		var decs = decInfo[0];
+		var desc, init, value;
+		if (isPrivate) if (kind === 0 || kind === 1) desc = {
+			get: decInfo[3],
+			set: decInfo[4]
+		};
+		else if (kind === 3) desc = { get: decInfo[3] };
+		else if (kind === 4) desc = { set: decInfo[3] };
+		else desc = { value: decInfo[3] };
+		else if (kind !== 0) desc = Object.getOwnPropertyDescriptor(base, name);
+		if (kind === 1) value = {
+			get: desc.get,
+			set: desc.set
+		};
+		else if (kind === 2) value = desc.value;
+		else if (kind === 3) value = desc.get;
+		else if (kind === 4) value = desc.set;
+		var newValue, get, set;
+		if (typeof decs === "function") {
+			newValue = memberDec(decs, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
+			if (newValue !== void 0) {
+				assertValidReturnValue(kind, newValue);
+				if (kind === 0) init = newValue;
+				else if (kind === 1) {
+					init = newValue.init;
+					get = newValue.get || value.get;
+					set = newValue.set || value.set;
+					value = {
+						get,
+						set
+					};
+				} else value = newValue;
+			}
+		} else for (var i = decs.length - 1; i >= 0; i--) {
+			var dec = decs[i];
+			newValue = memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
+			if (newValue !== void 0) {
+				assertValidReturnValue(kind, newValue);
+				var newInit;
+				if (kind === 0) newInit = newValue;
+				else if (kind === 1) {
+					newInit = newValue.init;
+					get = newValue.get || value.get;
+					set = newValue.set || value.set;
+					value = {
+						get,
+						set
+					};
+				} else value = newValue;
+				if (newInit !== void 0) if (init === void 0) init = newInit;
+				else if (typeof init === "function") init = [init, newInit];
+				else init.push(newInit);
+			}
+		}
+		if (kind === 0 || kind === 1) {
+			if (init === void 0) init = function(instance, init$1) {
+				return init$1;
+			};
+			else if (typeof init !== "function") {
+				var ownInitializers = init;
+				init = function(instance, init$1) {
+					var value$1 = init$1;
+					for (var i$1 = 0; i$1 < ownInitializers.length; i$1++) value$1 = ownInitializers[i$1].call(instance, value$1);
+					return value$1;
+				};
+			} else {
+				var originalInitializer = init;
+				init = function(instance, init$1) {
+					return originalInitializer.call(instance, init$1);
+				};
+			}
+			ret.push(init);
+		}
+		if (kind !== 0) {
+			if (kind === 1) {
+				desc.get = value.get;
+				desc.set = value.set;
+			} else if (kind === 2) desc.value = value;
+			else if (kind === 3) desc.get = value;
+			else if (kind === 4) desc.set = value;
+			if (isPrivate) if (kind === 1) {
+				ret.push(function(instance, args) {
+					return value.get.call(instance, args);
+				});
+				ret.push(function(instance, args) {
+					return value.set.call(instance, args);
+				});
+			} else if (kind === 2) ret.push(value);
+			else ret.push(function(instance, args) {
+				return value.call(instance, args);
+			});
+			else Object.defineProperty(base, name, desc);
+		}
+	}
+	function applyMemberDecs(Class, decInfos, metadata) {
+		var ret = [];
+		var protoInitializers;
+		var staticInitializers;
+		var existingProtoNonFields = /* @__PURE__ */ new Map();
+		var existingStaticNonFields = /* @__PURE__ */ new Map();
+		for (var i = 0; i < decInfos.length; i++) {
+			var decInfo = decInfos[i];
+			if (!Array.isArray(decInfo)) continue;
+			var kind = decInfo[1];
+			var name = decInfo[2];
+			var isPrivate = decInfo.length > 3;
+			var isStatic = kind >= 5;
+			var base;
+			var initializers;
+			if (isStatic) {
+				base = Class;
+				kind = kind - 5;
+				staticInitializers = staticInitializers || [];
+				initializers = staticInitializers;
+			} else {
+				base = Class.prototype;
+				protoInitializers = protoInitializers || [];
+				initializers = protoInitializers;
+			}
+			if (kind !== 0 && !isPrivate) {
+				var existingNonFields = isStatic ? existingStaticNonFields : existingProtoNonFields;
+				var existingKind = existingNonFields.get(name) || 0;
+				if (existingKind === true || existingKind === 3 && kind !== 4 || existingKind === 4 && kind !== 3) throw new Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + name);
+				else if (!existingKind && kind > 2) existingNonFields.set(name, kind);
+				else existingNonFields.set(name, true);
+			}
+			applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata);
+		}
+		pushInitializers(ret, protoInitializers);
+		pushInitializers(ret, staticInitializers);
+		return ret;
+	}
+	function pushInitializers(ret, initializers) {
+		if (initializers) ret.push(function(instance) {
+			for (var i = 0; i < initializers.length; i++) initializers[i].call(instance);
+			return instance;
+		});
+	}
+	function applyClassDecs(targetClass, classDecs, metadata) {
+		if (classDecs.length > 0) {
+			var initializers = [];
+			var newClass = targetClass;
+			var name = targetClass.name;
+			for (var i = classDecs.length - 1; i >= 0; i--) {
+				var decoratorFinishedRef = { v: false };
+				try {
+					var nextNewClass = classDecs[i](newClass, {
+						kind: "class",
+						name,
+						addInitializer: createAddInitializerMethod(initializers, decoratorFinishedRef),
+						metadata
+					});
+				} finally {
+					decoratorFinishedRef.v = true;
+				}
+				if (nextNewClass !== void 0) {
+					assertValidReturnValue(10, nextNewClass);
+					newClass = nextNewClass;
+				}
+			}
+			return [defineMetadata(newClass, metadata), function() {
+				for (var i$1 = 0; i$1 < initializers.length; i$1++) initializers[i$1].call(newClass);
+			}];
+		}
+	}
+	function defineMetadata(Class, metadata) {
+		return Object.defineProperty(Class, Symbol.metadata || Symbol.for("Symbol.metadata"), {
+			configurable: true,
+			enumerable: true,
+			value: metadata
+		});
+	}
+	return function applyDecs2203R(targetClass, memberDecs, classDecs, parentClass) {
+		if (parentClass !== void 0) var parentMetadata = parentClass[Symbol.metadata || Symbol.for("Symbol.metadata")];
+		var metadata = Object.create(parentMetadata === void 0 ? null : parentMetadata);
+		var e = applyMemberDecs(targetClass, memberDecs, metadata);
+		if (!classDecs.length) defineMetadata(targetClass, metadata);
+		return {
+			e,
+			get c() {
+				return applyClassDecs(targetClass, classDecs, metadata);
+			}
+		};
+	};
+}
+function _apply_decs_2203_r(targetClass, memberDecs, classDecs, parentClass) {
+	return (_apply_decs_2203_r = applyDecs2203RFactory())(targetClass, memberDecs, classDecs, parentClass);
+}
+var _dec, _initClass;
+let _ReactAdapter;
+_dec = (0, _navios_core.Injectable)({ token: require_filter_engine.Adapter });
+var ReactAdapter = class {
+	static {
+		({c: [_ReactAdapter, _initClass]} = _apply_decs_2203_r(this, [], [_dec]));
+	}
+	createRoot(renderer) {
+		const root = (0, _opentui_react.createRoot)(renderer);
+		return {
+			render(element) {
+				root.render(element);
+			},
+			unmount() {
+				root.unmount();
+			}
+		};
+	}
+	renderToRoot(root, props) {
+		const element = (0, react.createElement)(ScreenManagerBridge, props);
+		root.render(element);
+	}
+	static {
+		_initClass();
+	}
+};
+
+//#endregion
+exports.LoggerProvider = LoggerProvider;
+Object.defineProperty(exports, 'ReactAdapter', {
+  enumerable: true,
+  get: function () {
+    return _ReactAdapter;
+  }
+});
+exports.useLoggerContext = useLoggerContext;
+exports.useTheme = useTheme;
+//# sourceMappingURL=index.cjs.map