ページが 1 つで機能も 1 つだけだとコンポーネントに分けても結局データは全部最上位になる
あるデータを管理(ローカルに登録して表示と編集)するツール

機能を分けて 3 つのコンポーネント

● ルートコンポーネント
  (1) リスト表示
  (2) 選択中の項目のデータを編集
  (3) リストの全部を専用ライブラリでグラフィカル表示・選択中はマウス操作で編集可能

編集中データなどは (2) の編集用コンポーネントだけで持ちたいけど (3) のコンポーネントでも編集できる
ルートコンポーネントで編集中も持つと 保存ボタンやリセットボタンが (2) にあるけど 押したことをルートコンポーネントに伝えるだけ
ルートコンポーネントでデータのチェックや保存などが必要
ほとんどがルートコンポーネントの処理になって複雑になってくる
一応ページ全部で 1000 行は超える程度のコード量なので そのほとんどをルートコンポーネントに押し込むのはなんかイヤ

それに (1) ~ (3) はほとんどルートコンポーネントから受け取ったデータの表示と押されたボタンを親に伝えるだけになってる
WebComponents らしい機能は持ってないし WebComponents (lit-element) で書くと長くなるだけ
こういうタイプなら React のほうが楽にかけそう