続・hoge: ReactNode ってイマイチな書き方かも？と思った

この記事で以下のような記述を書いたのですが。

import React, { DetailedHTMLProps, FC, HTMLAttributes } from "react";

export type HogeProps = {
  fuga: DetailedHTMLProps<
    HTMLAttributes<HTMLDivElement>,
    HTMLDivElement
  >["children"];
};

const Hoge: FC<HogeProps> = ({ fuga }) => <div>{fuga}</div>;

export default Hoge;

もう少しシンプルに書きたいなーとずーっと考えていまして。

さっきもっと良い書き方を見つけたので、備忘録がてら。

import React, { FC } from "react";

export type HogeProps = {
  fuga: JSX.IntrinsicElements["div"]["children"];
};

const Hoge: FC<HogeProps> = ({ fuga }) => <div>{fuga}</div>;

export default Hoge;

さらにスッキリ。