Add IdeationScene component with 2x2 quadrant canvas - #75
Open
fnobi wants to merge 10 commits into
Open
Conversation
4分割キャンバス（グループA/B × 抽象/具体）上でキーワードを ドラッグ配置できるIdeationSceneを実装。右下の＋ボタンで 自由入力によるキーワード追加に対応。 https://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
- 左半分グループA・右半分グループBの2列レイアウトに変更 - 行単位でデータ管理（抽象/具体・グループAキーワード・グループBキーワード） - ＋ボタン→ボトムシートで行の追加、行タップで編集・削除 - ≡ハンドルのドラッグ（PointerEvents+setPointerCapture）で並び替え https://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw
- Row型からtypeフィールドを削除、バッジ表示も除去 - 列ヘッダーをクリックするとインライン入力に切り替わり自由に編集できる - 行編集シートのフィールドラベルにカスタム見出しを反映 https://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw
- キーワードをstring[]型に変更、チップ表示でラップ対応 - 鉛筆ボタンを左右各セルに配置し、セル単位でボトムシート編集 - 編集シートでキーワードの追加(Enter)・削除(×)が可能 - ＋ボタンで空行を即時追加（ポップアップなし） - 行削除はセル編集シートの「行を削除」ボタンに集約 https://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw
- ChipDragStateでドラッグ中チップの位置・移動元・ターゲットを管理 - Pointer Capture (setPointerCapture) でマウス・タッチを統一処理 - ドラッグ中はゴーストチップがポインタに追従、元チップは半透明表示 - ドロップ対象セルをハイライト（青枠） - セルのref mapで全セルの位置を管理しドロップ判定に使用 https://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Introduces a new
IdeationScenecomponent that provides an interactive 2x2 quadrant canvas for ideation and keyword mapping. This replaces the previousProfileFormSceneas the main page component.Key Changes
New IdeationScene component (
src/features/components/IdeationScene.tsx):Updated home page (
src/app/page.tsx):ProfileFormSceneimport withIdeationScenePageProfileFormtoPageImplementation Details
useState,useCallback,useRef) to track drag state and update keyword positions in real-timehttps://claude.ai/code/session_012g1zjH3rYR5cchtPisG8fw