New: Project Aphrodite

frontend/src/Components/Form/FormInputHelpText.js

@@ -0,0 +1,63 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import classNames from 'classnames';
+import { icons } from 'Helpers/Props';
+import Icon from 'Components/Icon';
+import Link from 'Components/Link/Link';
+import styles from './FormInputHelpText.css';
+
+function FormInputHelpText(props) {
+  const {
+    className,
+    text,
+    link,
+    linkTooltip,
+    isError,
+    isWarning,
+    isCheckInput
+  } = props;
+
+  return (
+    <div className={classNames(
+      className,
+      isError && styles.isError,
+      isWarning && styles.isWarning,
+      isCheckInput && styles.isCheckInput
+    )}
+    >
+      {text}
+
+      {
+        !!link &&
+          <Link
+            className={styles.link}
+            to={link}
+            title={linkTooltip}
+          >
+            <Icon
+              name={icons.EXTERNAL_LINK}
+            />
+          </Link>
+      }
+    </div>
+  );
+}
+
+FormInputHelpText.propTypes = {
+  className: PropTypes.string.isRequired,
+  text: PropTypes.string.isRequired,
+  link: PropTypes.string,
+  linkTooltip: PropTypes.string,
+  isError: PropTypes.bool,
+  isWarning: PropTypes.bool,
+  isCheckInput: PropTypes.bool
+};
+
+FormInputHelpText.defaultProps = {
+  className: styles.helpText,
+  isError: false,
+  isWarning: false,
+  isCheckInput: false
+};
+
+export default FormInputHelpText;