GUIプロンプト
code:path-editor.txt
## **プロンプト**
「VueでSVGパスエディタを作成したい。IllustratorやFigmaのペンツールの動作を忠実に再現するため、以下の要件を満たすコードを生成してください。
### **基本機能**
- **クリックでポイントを作成**
- **ポイント作成後、ドラッグでハンドル（handleIn, handleOut）を移動可能**
- **デフォルトでハンドルは対称に配置される**
- **Altキーを押しながらドラッグでハンドルの対称性を解除可能**
- **始点をクリックすることでパスをループ（閉じる）**
- **SVG <path> をリアルタイムで更新する**
- ポイントの種類（スムーズ/コーナー）の切り替え機能
### **データモデル**
- **各ポイントは { x, y, handleIn, handleOut } を持つ**
- **handleIn, handleOut は { x, y } のオフセット値**
- **パスは配列 [{ x, y, handleIn, handleOut }] として管理**
- **閉じたパス（ループ）はデータモデルで考慮**
### **実装のポイント**
- **マウス操作でポイント・ハンドルを編集**
- **SVG <path> の d 属性を動的に更新**
- パス作成中やハンドル調整中にプレビューを行う
- ポイントを確定するときにドラッグすると、ドラッグした方向にハンドルの方向性を変更できる