import React, { type ReactNode } from 'react';
import { Pressable, View } from 'react-native';

import { toolWidgetStyles } from './toolWidgetStyles';

// Unused by the slim batch-1 rows; later batches (entities, PRD, payments,
// clarifying questions…) render as bordered cards on this surface.
export function WidgetCard({
  accessibilityLabel,
  children,
  onPress,
}: {
  accessibilityLabel?: string;
  children: ReactNode;
  onPress?: () => void;
}) {
  if (onPress) {
    return (
      <Pressable
        accessibilityLabel={accessibilityLabel}
        accessibilityRole="button"
        onPress={onPress}
        style={toolWidgetStyles.card}
      >
        {children}
      </Pressable>
    );
  }

  return <View style={toolWidgetStyles.card}>{children}</View>;
}