How to use the @crave/farmblocks-theme.fontTypes.NORMAL function in @crave/farmblocks-theme

const { checked } = this.state;
    const inputProps = {
      ...remainingProps,
      defaultChecked: checked,
      onClick: this.handleClick,
    };

    const { disabled } = inputProps;

    const labelProps = {
      className,
      checked,
      disabled,
    };

    const fontColor = (disabled && fontTypes.SUBTLE) || fontTypes.NORMAL;

    return (
      <label>
        <input type="radio">
        <div>
          <div>
        </div>
        {label &amp;&amp; (
          
        )}
      
    );
  }
}</div></label>

import { fontTypes } from "@crave/farmblocks-theme";

export default {
  FEATURED: fontTypes.FEATURED,
  NEUTRAL: fontTypes.NEUTRAL,
  NORMAL: fontTypes.NORMAL,
  WHITE: fontTypes.WHITE,
};

export default {
  [linkTypes.PRIMARY]: {
    color: fontTypes.FEATURED,
    hoverColor: colorConstants.BLUE_CORN
  },
  [linkTypes.DISABLED]: {
    color: fontTypes.SUBTLE,
    hoverColor: fontTypes.SUBTLE
  },
  [linkTypes.NEUTRAL]: {
    color: fontTypes.NEUTRAL,
    hoverColor: fontTypes.FEATURED
  },
  [linkTypes.ROW_TITLE]: {
    color: fontTypes.NORMAL,
    hoverColor: colorConstants.BLUE_CORN
  },  
  [linkTypes.WHITE]: {
    color: fontTypes.WHITE,
    hoverColor: colorConstants.WHITE_56
  }
};

    withInfo()(() =&gt; <title type="{fontTypes.NORMAL}">Awesome title</title>)
  )

export default class Caption extends React.Component {
  render() {
    const { children, ...props } = this.props;
    return {children};
  }

  static propTypes = {
    children: PropTypes.node.isRequired,
    size: PropTypes.oneOf(Object.values(fontSizes)),
    type: PropTypes.oneOf(Object.values(fontTypes)),
    align: PropTypes.oneOf(["left", "right"])
  };

  static defaultProps = {
    size: fontSizes.LARGE,
    type: fontTypes.NORMAL,
    align: "left"
  };
}

const labelProps = {
        onMouseUp: this.onMouseUp,
        switch: isSwitch,
        checked,
        disabled: inputProps.disabled || loading,
        hasText: !!label,
        className,
      };

      inputProps.checked = checked;
      inputProps.onChange = this.onChange;

      const fontColor = inputProps.disabled
        ? fontTypes.SUBTLE
        : fontTypes.NORMAL;

      return (
        
          <input type="checkbox">
          <div>
            
            {label &amp;&amp; (
              
            )}</div>

.add("NORMAL type", () => (
    
  ))
  .add("NEUTRAL type", () => (

return (
      
        {this.props.children}
      
    );
  }

  static propTypes = {
    children: PropTypes.node.isRequired,
    size: PropTypes.oneOf(Object.values(fontSizes)),
    type: PropTypes.oneOf(Object.values(fontTypes))
  };

  static defaultProps = {
    size: fontSizes.LARGE,
    type: fontTypes.NORMAL
  };
}

Text.propTypes = {
  children: PropTypes.node,
  size: PropTypes.number,
  type: PropTypes.string,
  align: PropTypes.oneOf(["left", "center", "right", "justify"]),
  lineHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  paragraph: PropTypes.bool,
  title: PropTypes.bool,
  letterSpacing: PropTypes.string,
  light: PropTypes.bool,
};

Text.defaultProps = {
  size: fontSizes.LARGE,
  type: fontTypes.NORMAL,
  align: "left",
  paragraph: false,
  title: false,
};

export default Text;