* style(app): theme native scrollbars in tool call detail views Apply CSS scrollbar-color to all ScrollViews in ToolCallDetailsContent and DiffViewer so the browser scrollbar matches the app's dark theme instead of showing the default white native scrollbar. * refactor: split useWebScrollbarStyle into .web.ts/.native.ts platform files - Native shim returns undefined without calling useUnistyles - Web variant uses properly typed WebScrollbarStyle interface instead of `as any` - Add .d.ts for TypeScript module resolution --------- Co-authored-by: Mohamed Boudra <boudra.moha@gmail.com>
22 lines
677 B
TypeScript
22 lines
677 B
TypeScript
import { useMemo } from "react";
|
|
import type { ViewStyle } from "react-native";
|
|
import { useUnistyles } from "react-native-unistyles";
|
|
|
|
// CSS scrollbar properties are supported by React Native Web at runtime
|
|
// but are not included in React Native's ViewStyle type definition.
|
|
interface WebScrollbarStyle extends ViewStyle {
|
|
scrollbarColor: string;
|
|
scrollbarWidth: string;
|
|
}
|
|
|
|
export function useWebScrollbarStyle(): WebScrollbarStyle {
|
|
const { theme } = useUnistyles();
|
|
return useMemo(
|
|
(): WebScrollbarStyle => ({
|
|
scrollbarColor: `${theme.colors.scrollbarHandle} transparent`,
|
|
scrollbarWidth: "thin",
|
|
}),
|
|
[theme.colors.scrollbarHandle],
|
|
);
|
|
}
|