Convert Form Components to TypeScript

frontend/src/Components/Form/Select/HintedSelectInputOption.tsx

@@ -0,0 +1,52 @@
+import classNames from 'classnames';
+import React from 'react';
+import EnhancedSelectInputOption, {
+  EnhancedSelectInputOptionProps,
+} from './EnhancedSelectInputOption';
+import styles from './HintedSelectInputOption.css';
+
+interface HintedSelectInputOptionProps extends EnhancedSelectInputOptionProps {
+  value: string;
+  hint?: React.ReactNode;
+}
+
+function HintedSelectInputOption(props: HintedSelectInputOptionProps) {
+  const {
+    id,
+    value,
+    hint,
+    depth,
+    isSelected = false,
+    isDisabled,
+    isMobile,
+    ...otherProps
+  } = props;
+
+  return (
+    <EnhancedSelectInputOption
+      id={id}
+      depth={depth}
+      isSelected={isSelected}
+      isDisabled={isDisabled}
+      isHidden={isDisabled}
+      isMobile={isMobile}
+      {...otherProps}
+    >
+      <div
+        className={classNames(styles.optionText, isMobile && styles.isMobile)}
+      >
+        <div>{value}</div>
+
+        {hint != null && <div className={styles.hintText}>{hint}</div>}
+      </div>
+    </EnhancedSelectInputOption>
+  );
+}
+
+HintedSelectInputOption.defaultProps = {
+  isDisabled: false,
+  isHidden: false,
+  isMultiSelect: false,
+};
+
+export default HintedSelectInputOption;