javascript - 일반 구성 요소에 대한 콘크리트 유형 정의

기본적으로 입력 구성 요소를 작성하기 위해 입력하고 있습니다. select 내 응용 프로그램의 열거 형에 대해 일련의 단일 라이너로 구체적인 유형에 대해 정의하십시오. 그러나 내가 시도하는 것이 무엇이든 입력 문제가 발생하는 것 같습니다. 내가 가진 가장 가까운 것은 이것입니다 :

import React from 'react';
type Props<T> = {
  enumType: T;
  value?: keyof T;
};
type IEnumInput<T = {}> = React.FC<Props<T>>;
const EnumInput: IEnumInput = ({ enumType, value }) => {
  const options = Object.values(enumType).map((x: any) => x.toString());
  return (
    <div>
      Will select from {options.join(',')}, current value is {value}
    </div>
  );
};
type CProps<T> = {
  value?: keyof T;
};
enum MyEnum {
  A = 'a',
  B = 'b',
  C = 'c',
}
const MyEnumInput = (props: React.PropsWithChildren<CProps<MyEnum>>) =>
  EnumInput({ ...props, enumType: MyEnum });

내가 얻는 오류는

  Type '{ enumType: typeof MyEnum; value?: number | "big" | "link" | "small" | "sub" | "sup" | "toString" | "charAt" | "charCodeAt" | "concat" | "indexOf" | "lastIndexOf" | "localeCompare" | ... 35 more ... | undefined; children?: React.ReactNode; }' is not assignable to type 'Props<{}>'.     Types of property 'value' are incompatible.
       Type 'number | "big" | "link" | "small" | "sub" | "sup" | "toString" | "charAt" | "charCodeAt" | "concat" | "indexOf" | "lastIndexOf" | "localeCompare" | "match" | "replace" | "search" | ... 32 more ... | undefined' is not assignable to type 'undefined'.
         Type 'number' is not assignable to type 'undefined'.

이것이 올바른 접근법입니까? 그렇다면 내가 뭘 잘못하고 있습니까?