import React from 'react';
import { Blockquote as BlockquotePrimitive, BlockquoteProps as BlockquotePropsPrimitive } from '@modulz/primitives';

export type BlockquoteProps = BlockquotePropsPrimitive

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

export const Blockquote = React.forwardRef<PrimitiveRefType, BlockquoteProps>((props, ref) => {
  return (
    <BlockquotePrimitive {...props} ref={ref}  styleConfig={{"base":{"blockquote":{"normal":{"color":"hsl(240, 3%, 60%)","borderLeft":"4px solid","borderLeftColor":"hsl(240, 20%, 95%)","paddingLeft":"12px","paddingBottom":"4px","fontFamily":"-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"","paddingTop":"4px","fontSize":"16px","lineHeight":"20px"}}},"variants":{}}}/>
  );
});