fix: select component types

src/admin/components/elements/ReactSelect/types.ts

@@ -11,7 +11,7 @@ export type Value = {
 export type Props = {
   className?: string
   value?: Value | Value[],
-  onChange?: (value: Value) => void,
+  onChange?: (value: any) => void, // eslint-disable-line @typescript-eslint/no-explicit-any
   disabled?: boolean,
   showError?: boolean,
   options: Options

src/admin/components/forms/field-types/Select/Input.tsx

@@ -2,15 +2,15 @@ import React from 'react';
 import Label from '../../Label';
 import Error from '../../Error';
 import FieldDescription from '../../FieldDescription';
-import { SelectField } from '../../../../../fields/config/types';
+import { OptionObject, SelectField } from '../../../../../fields/config/types';
 import { Description } from '../../FieldDescription/types';
 import ReactSelect from '../../../elements/ReactSelect';
-import { Value as ReactSelectValue, Options as ReactSelectOptions } from '../../../elements/ReactSelect/types';
+import { Value as ReactSelectValue } from '../../../elements/ReactSelect/types';
 // import { FieldType } from '../../useField/types';
 
 import './index.scss';
 
-export type SelectInputProps = Omit<SelectField, 'type' | 'value'> & {
+export type SelectInputProps = Omit<SelectField, 'type' | 'value' | 'options'> & {
   showError: boolean
   errorMessage?: string
   readOnly?: boolean
@@ -22,7 +22,7 @@ export type SelectInputProps = Omit<SelectField, 'type' | 'value'> & {
   style?: React.CSSProperties
   width?: string
   hasMany?: boolean
-  options?: ReactSelectOptions
+  options?: OptionObject[]
 }
 
 const SelectInput: React.FC<SelectInputProps> = (props) => {
@@ -70,7 +70,7 @@ const SelectInput: React.FC<SelectInputProps> = (props) => {
       />
       <ReactSelect
         onChange={onChange}
-        value={selectedOption}
+        value={selectedOption as ReactSelectValue}
         showError={showError}
         isDisabled={readOnly}
         options={options}

src/admin/components/forms/field-types/Select/index.tsx

@@ -2,19 +2,19 @@ import React, { useCallback, useState } from 'react';
 import withCondition from '../../withCondition';
 import useField from '../../useField';
 import { select } from '../../../../../fields/validations';
-import { Option } from '../../../../../fields/config/types';
-import { Props, ReactSelectOption } from './types';
+import { Option, OptionObject } from '../../../../../fields/config/types';
+import { Props } from './types';
 import SelectInput from './Input';
 
-const formatOptions = (options: Option[]): ReactSelectOption[] => options.map((option) => {
+const formatOptions = (options: Option[]): OptionObject[] => options.map((option) => {
   if (typeof option === 'object' && option.value) {
     return option;
   }
 
   return {
-    label: option as string,
+    label: option,
     value: option,
-  };
+  } as OptionObject;
 });
 
 const Select: React.FC<Props> = (props) => {

src/admin/components/views/collections/List/Cell/field-types/Select/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { OptionObject, optionsAreObjects, SelectField } from '../../../../../../../../fields/config/types';
 
-const SelectCell = ({ data, field }: {data: any, field: SelectField}) => {
+const SelectCell = ({ data, field }: { data: any, field: SelectField }) => {
   const findLabel = (items: string[]) => items.map((i) => {
     const found = (field.options as OptionObject[])
       .filter((f: OptionObject) => f.value === i)?.[0]?.label;

src/fields/config/types.ts

@@ -48,10 +48,13 @@ export type Labels = {
 
 export type Validate<T = any> = (value?: T, options?: any) => string | true | Promise<string | true>;
 
-export type Option = {
+export type OptionObject = {
   label: string
   value: string
 }
+
+export type Option = OptionObject | string
+
 export interface FieldBase {
   name: string;
   label?: string | false;