AIエージェントに数値入力欄を実装させる

AIエージェントにUIを実装する際、数値入力欄が意図せず数値形式になってしまう問題を解決するためのプロンプトを紹介。HTMLのinput type="number"のように、より適切な数値入力欄をAIに生成させる方法を解説している。

• AIエージェントにUIを作成させる際、<input type="number"> の使用は、途中入力や範囲外入力のブロックにより不便が生じることがあります。
• 数値入力欄は `type="text"` を使用し、stateやフォーム変数は `string` 型で保持し、後から `parseFloat` で数値に変換するべきだと提案されています。
• 入力値のバリデーションは `error` propsや `helperText` でユーザーに明示し、確定ボタンは `disabled` にすることが推奨されています。
• 最小値・最大値の制約はinputの `min`/`max` 属性ではなく、変換後の数値に `Math.max`/`Math.min` で適用することが提案されています。
• UI生成AIに数値入力欄を実装させる際の具体的なプロンプト例が、React向けに示されています。