init

src/components/ui-kit/BaseReactSelect/index.tsx

@@ -0,0 +1,31 @@
+import React, { ForwardedRef, forwardRef } from 'react';
+import ReactSelect, { StylesConfig } from 'react-select';
+
+export const selectDefaultStyles: StylesConfig = {
+    control(base, props) {
+        return {
+            ...base,
+            border: props.isFocused ? '2px solid #3489E4' : '2px solid #D8D8D8',
+            borderRadius: '8px',
+            boxShadow: '0',
+            minWidth: 200,
+        };
+    },
+    valueContainer(base, props) {
+        return {
+            ...base,
+            // border: '1px solid #D8D8D8',
+        };
+    },
+    indicatorSeparator(base, props) {
+        return {
+            display: 'none',
+        };
+    },
+};
+
+const BaseReactSelect = (props: any, ref: ForwardedRef<HTMLSelectElement>) => {
+    return <ReactSelect styles={selectDefaultStyles} {...props} ref={ref} />;
+};
+
+export default forwardRef(BaseReactSelect);