Q. refが取れないので非制御コンポーネントに出来ない

非制御コンポーネントであることと、ref で値を取得することは無関係。

クラスコンポーネントの時代では、React 公式のドキュメントにそう思われても仕方ないような記述があった。

非制御コンポーネントを記述するには、各 state の更新に対してイベントハンドラを書く代わりに、ref を使用して DOM からフォームの値を取得します。”

https://ja.legacy.reactjs.org/docs/uncontrolled-components.html

現在は次のように書かれている。

一般的に、ローカル state を持つコンポーネントを “非制御 (uncontrolled)” であると呼びます。…対照的に、重要な情報がローカル state ではなく props によって駆動されるとき、コンポーネントは “制御された (controlled)” ものと呼ばれることがあります。…実際には、“制御された”、“非制御” は技術用語として厳密なものではありません。

https://ja.react.dev/learn/sharing-state-between-components#controlled-and-uncontrolled-components