Initial commit

client/src/lib/custom-ui/components/Input/Input.jsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Input as SemanticUIInput } from 'semantic-ui-react';
+
+import MaskedInput from './MaskedInput';
+
+const Input = React.forwardRef(({ mask, maskChar, ...props }, ref) => {
+  const nextProps = props;
+
+  if (mask) {
+    nextProps.input = <MaskedInput mask={mask} maskChar={maskChar} />;
+  }
+
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  return <SemanticUIInput {...nextProps} ref={ref} />;
+});
+
+Input.propTypes = {
+  mask: PropTypes.string,
+  maskChar: PropTypes.string,
+};
+
+Input.defaultProps = {
+  mask: undefined,
+  maskChar: undefined,
+};
+
+export default React.memo(Input);

client/src/lib/custom-ui/components/Input/MaskedInput.jsx

@@ -0,0 +1,11 @@
+import InputMask from 'react-input-mask';
+
+export default class MaskedInput extends InputMask {
+  focus() {
+    this.getInputDOMNode().focus();
+  }
+
+  select() {
+    this.getInputDOMNode().select();
+  }
+}

client/src/lib/custom-ui/components/Input/index.js

@@ -0,0 +1,3 @@
+import Input from './Input';
+
+export default Input;