Web Components / Custom Elements の使い所
（attachShadow している場合） #CSS が中に閉じる。外から style を変更できるのは :root ぐらい :root 以下はクライアントサイドでレンダリングされる
------
こういう感じのものなので、 #React でやるような Button コンポーネントの共通化を期待するとだいたい後悔する。 （ そういうケースの場合 Shadow DOM は使わない感じになるんじゃなかろうか ）
逆に、挙動だけが共通で見た目をいじる必要がない（サイト内の他のパーツと調和させる必要がない）ケースではしっくり来やすい。
外部埋め込みパーツ（ツイート埋め込みとか）
広告バナー（ iframe のラッパー的なやつ ）
コードブロック（ どのサイトでもどうせ見た目が同じ ）
アイコンライブラリ（SVG を特定サイズで埋め込むだけ。色は変更できる）
など