Reactデフォルトプロパティwith children

React.FunctionComponentでES6のデフォルトパラメータ方式でchildrenプロパティを含めたデフォルトプロパティを設定する方法のメモ書きです。

import React, { FunctionComponent, PropsWithChildren } from "react";

type Property = {
  foo?: string;
  bar?: number;
}

export const SomeComponent: FunctionComponent<Property> =({
  foo="hoge",
  bar=0,
  children
}: Partial<PropsWithChildren<Property>>) =>(
  <div data-hoge={foo} data-bar={bar}>
    {children}
  </div>
);

プロパティの型がネストされていると複雑になるので上手く設計しないといけませんね。
なお全てのプロパティのデフォルト値を設定するならPartialは必要無いです。