a1f3256923
* 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>
33 lines
911 B
TypeScript
33 lines
911 B
TypeScript
import { ScrollView, type LayoutChangeEvent, type StyleProp, type ViewStyle } from "react-native";
|
|
import { useWebScrollbarStyle } from "@/hooks/use-web-scrollbar-style";
|
|
|
|
interface DiffScrollProps {
|
|
children: React.ReactNode;
|
|
scrollViewWidth: number;
|
|
onScrollViewWidthChange: (width: number) => void;
|
|
style?: StyleProp<ViewStyle>;
|
|
contentContainerStyle?: StyleProp<ViewStyle>;
|
|
}
|
|
|
|
export function DiffScroll({
|
|
children,
|
|
onScrollViewWidthChange,
|
|
style,
|
|
contentContainerStyle,
|
|
}: DiffScrollProps) {
|
|
const webScrollbarStyle = useWebScrollbarStyle();
|
|
|
|
return (
|
|
<ScrollView
|
|
horizontal
|
|
nestedScrollEnabled
|
|
showsHorizontalScrollIndicator
|
|
style={[style, webScrollbarStyle]}
|
|
contentContainerStyle={contentContainerStyle}
|
|
onLayout={(e: LayoutChangeEvent) => onScrollViewWidthChange(e.nativeEvent.layout.width)}
|
|
>
|
|
{children}
|
|
</ScrollView>
|
|
);
|
|
}
|