import React from "react";
import { SpanProps } from "./type";
import { useLocale } from '../../hooks/useLocale';

export const Span: React.FC<SpanProps> = ({
  allCaps = false,
  isDisabled = false,
  onClick,
  children = '',
  className = '',
  style = {},
}) => {
  const label = useLocale(children)
  return (
    <span
      className={className}
      style={style}
      onClick={() => {
        if (onClick && !isDisabled) onClick;
      }}
    >
      {allCaps ? label.toUpperCase() : label}
    </span>
  );
};