Initial snapshot - OpenTelemetry demo 2.1.3 -f

1 files changed, 31 insertions, 0 deletions

diff --git a/src/frontend/components/Input/Input.tsx b/src/frontend/components/Input/Input.tsx
new file mode 100644
index 0000000..14782b0
--- /dev/null
+++ b/src/frontend/components/Input/Input.tsx
@@ -0,0 +1,31 @@
+// Copyright The OpenTelemetry Authors
+// SPDX-License-Identifier: Apache-2.0
+
+import { HTMLInputTypeAttribute, InputHTMLAttributes } from 'react';
+import * as S from './Input.styled';
+
+interface IProps extends InputHTMLAttributes<HTMLSelectElement | HTMLInputElement> {
+  type: HTMLInputTypeAttribute | 'select';
+  children?: React.ReactNode;
+  label: string;
+}
+
+const Input = ({ type, id = '', children, label, ...props }: IProps) => {
+  return (
+    <S.InputRow>
+      <S.InputLabel>{label}</S.InputLabel>
+      {type === 'select' ? (
+        <>
+          <S.Select id={id} {...props}>
+            {children}
+          </S.Select>
+          <S.Arrow />
+        </>
+      ) : (
+        <S.Input id={id} {...props} type={type} />
+      )}
+    </S.InputRow>
+  );
+};
+
+export default Input;