import React from 'react';
import { Checkbox as CheckboxPrimitive, CheckboxProps as CheckboxPropsPrimitive } from '@modulz/primitives';

export type CheckboxProps = CheckboxPropsPrimitive

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

export const Checkbox = React.forwardRef<PrimitiveRefType, CheckboxProps>((props, ref) => {
  return (
    <CheckboxPrimitive {...props} ref={ref}  styleConfig={{"base":{"checkbox":{"normal":{"height":"24px","border":"1px solid","borderColor":"hsl(240, 10%, 90%)","borderBottomRightRadius":"2px","backgroundColor":"hsl(0, 0%, 100%)","width":"24px","borderTopLeftRadius":"2px","borderBottomLeftRadius":"2px","borderTopRightRadius":"2px"}},"icon":{"normal":{"color":"hsl(0, 0%, 0%)"}}},"variants":{}}}/>
  );
});


