import React from 'react';
import { Text as TextPrimitive, TextProps as TextPropsPrimitive } from '@modulz/primitives';

export type TextProps = TextPropsPrimitive & {
  variant?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'large' | 'small';
}

type ExtractRefType<TypesThatMayContainReactRef> = TypesThatMayContainReactRef extends {ref?: React.Ref<infer T>} ? T : any;
type PrimitiveRefType = ExtractRefType<TextPropsPrimitive>  

export const Text = React.forwardRef<PrimitiveRefType, TextProps>((props, ref) => {
  return (
    <TextPrimitive {...props} ref={ref}  styleConfig={{"base":{"text":{"normal":{"lineHeight":"160%","fontFamily":"Inter,sans-serif","color":"rgba(0, 0, 0, 1)","fontSize":"18px"}}},"variants":{"variant":{"h1":{"text":{"normal":{"color":"rgba(0, 0, 0, 1)","lineHeight":"80px","fontSize":"88px","fontStyle":"normal","fontFamily":"TT Firs Neue","fontWeight":"700"}}},"h2":{"text":{"normal":{"fontWeight":"800","lineHeight":"88px","fontSize":"72px","color":"rgba(0, 0, 0, 1)","fontStyle":"normal","fontFamily":"Inter,sans-serif"}}},"h3":{"text":{"normal":{"fontSize":"64px","fontStyle":"normal","lineHeight":"64px","fontWeight":"800","color":"rgba(0, 0, 0, 1)","fontFamily":"Inter,sans-serif"}}},"h4":{"text":{"normal":{"lineHeight":"58px","fontWeight":"700","fontSize":"48px","fontStyle":"normal","fontFamily":"Inter,sans-serif"}}},"h5":{"text":{"normal":{"lineHeight":"160%","color":"rgba(102, 102, 102, 1)","fontWeight":"500","fontSize":"24px","fontStyle":"normal"}}},"large":{"text":{"normal":{"fontSize":"24px"}}},"small":{"text":{"normal":{"fontSize":"16px"}}}}}}}/>
  );
});