import React from "react";

export interface EachProps<T = unknown> {
  /**
   * 数据源
   */
  data?: T[];
  /**
   * 自定义渲染器
   */
  render?: (item: T, index: number) => React.ReactNode;
}

export const Each = React.forwardRef<HTMLDivElement, EachProps>(
  (props, ref) => {
    const { data, ...rest } = props;
    return (
      <div ref={ref} {...rest}>
        {data?.map((item, index) => (
          <div key={`item${index.toString()}`}>
            {props.render?.(item, index) ?? null}
          </div>
        ))}
      </div>
    );
  }
);