1 files changed, 45 insertions, 0 deletions
diff --git a/src/components/shared/Selection.tsx b/src/components/shared/Selection.tsx
new file mode 100644
index 0000000..9cabb6a
--- /dev/null
+++ b/src/components/shared/Selection.tsx
@@ -0,0 +1,45 @@
+import cx from 'clsx';
+import React from 'react';
+
+import s from './Selection.module.scss';
+
+type SelectionProps = {
+  OptionComponent: (...args: any[]) => any;
+  optionPropsList: any[];
+  selectedIndex: number;
+  onChange: (value: string) => void;
+};
+
+export function Selection2({
+  OptionComponent,
+  optionPropsList,
+  selectedIndex,
+  onChange,
+}: SelectionProps) {
+  const inputCx = cx('visually-hidden', s.input);
+  const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    onChange(e.target.value);
+  };
+  return (
+    <fieldset className={s.fieldset}>
+      {optionPropsList.map((props, idx) => {
+        return (
+          <label key={idx}>
+            <input
+              type="radio"
+              checked={selectedIndex === idx}
+              name="selection"
+              value={idx}
+              aria-labelledby={'traffic chart type ' + idx}
+              onChange={onInputChange}
+              className={inputCx}
+            />
+            <div className={s.cnt}>
+              <OptionComponent {...props} />
+            </div>
+          </label>
+        );
+      })}
+    </fieldset>
+  );
+}