import { jsxs, jsx } from 'react/jsx-runtime';

const Typography = ({
  fontWeight = 'regular',
  fontSize = 12,
  lineHeight = 'normal',
  color = '',
  textAlign = 'left',
  as: Element = 'span',
  letterSpacing = '',
  className = '',
  children,
  htmlFor = '',
  onClick = () => {},
  required = false,
  style = {},
  cursor,
  onDoubleClick = () => {}
}) => {
  const fontSizeValue = typeof fontSize === 'number' ? `${fontSize}px` : fontSize;
  return jsxs(Element, {
    className: `ff-text ff-text--${fontWeight} ${className}`,
    ...(Element === 'label' && {
      htmlFor
    }),
    style: {
      fontSize: fontSizeValue,
      lineHeight,
      color,
      textAlign,
      letterSpacing,
      cursor,
      ...style
    },
    onClick: onClick,
    onDoubleClick: onDoubleClick,
    children: [required && jsx("span", {
      className: "required-asterisk",
      children: "*"
    }), children]
  });
};

export { Typography as default };
//# sourceMappingURL=Typography.js.map
