モノレポでアプリケーションとuiを作る時、uiはアプリケーション側で使用するライブラリに依存しないようにしたい。
例えばNext.jsでアプリケーションを作る場合にui層ではNext.jsの機能を使わないようにする。
このとき大きな課題は、ライブラリから提供されるコンポーネントを使う場合はどうするか？ということである。
Next.jsの例で言うと、リンクはLinkコンポーネントで作成するが、ui層でLinkコンポーネントは使えない。Reactの機能だけでリンクボタンを作ってアプリケーション層で使用する際は何がベストプラクティスか？という問題である。

案1 アプリケーション層にはimportでなくコピーして持ってくる

shadcn/uiのやり方。ui層ではaタグで作って、アプリケーション層に持ってきた時にLinkタグに置き換えれば良い。
デメリットとしては、アプリケーション層で自由に書き換えられるので破綻しやすい点、ui層での変更に追従できない点がある。

案2 見せる用（storybook用）と中身をpropsで出し分ける

ガワも含めて提供するコンポーネントか、中身だけ提供するか
中身だけ提供するとuiとして成立しないので微妙
ガワにつけたスタイルがアプリケーション層で反映されない

案3 アプリケーション層でラップする前提で作成

spanか何かで作成して、アプリケーション層ではサイズやborder-radiusが一致するように作る
無駄にラップされる、親にもCSSが必要になるという問題がある