import React from "react";
import classNames from "classnames";
import { useTranslation } from "../i18n";
import { StyledProps } from "../_type";
import { useConfig } from "../_util/config-context";

export interface EmptyTipProps extends StyledProps {
  /**
   * 空数据提示文案
   * @default "暂无数据"
   */
  emptyText?: React.ReactNode;
}

export const EmptyTip = React.forwardRef(function EmptyTip(
  props: EmptyTipProps,
  ref: React.Ref<HTMLSpanElement>
) {
  const { classPrefix } = useConfig();
  const t = useTranslation();
  const { emptyText = t.emptyText, className, ...restProps } = props;
  return (
    <span
      ref={ref}
      className={classNames(`${classPrefix}-action-state`, className)}
      {...restProps}
    >
      {typeof emptyText === "string" ? (
        <span className={`${classPrefix}-action-state__text`} title={emptyText}>
          {emptyText}
        </span>
      ) : (
        emptyText
      )}
    </span>
  );
});

EmptyTip.displayName = "EmptyTip";