import { View } from "@tarojs/components";
import IconArrowThin from "@/components/icon/icon-arrow-thin";
export interface IndexProps {
  figure: () => JSX.Element;
  arrow?: boolean;
  rightRenderer?: () => JSX.Element[] | JSX.Element;
  children?: JSX.Element[] | JSX.Element;
  className?: string;
  underline?: boolean;
  onClick?: () => void;
}
// todo: 改了好几版，需要根据新 ui 重新规划组件
const Index = ({ figure, arrow, underline, rightRenderer, children, className, onClick }: IndexProps) => {
  return (
    <View className={`flex items-start gap-12 w-full ${underline ? 'border-bottom1-gray pb-12' : ''} ${className}`} onClick={ ()=> { onClick && onClick()}}>
      {figure()}
      <View className="flex flex-col flex-1 gap-2 w-full overflow-hidden">{children}</View>
      {rightRenderer && rightRenderer()}
      {arrow && (
        <View className="flex items-center justify-center">
          <IconArrowThin />
        </View>
      )}
    </View>
  );
};

export default Index;
