Files
vexplor/frontend/components/pop/designer/PopDesignerContext.tsx
SeongHyun Kim df8cbb3e80 feat(pop): 액션 아키텍처 + 모달 시스템 구현 (STEP 0~7)
- executePopAction / usePopAction 훅 신규 생성
- pop-button을 usePopAction 기반으로 리팩토링
- PopModalDefinition 타입 + MODAL_SIZE_PRESETS 정의
- PopDesignerContext 신규 생성 (모달 탭 상태 공유)
- PopDesigner에 모달 탭 UI 추가 (메인 캔버스 / 모달 캔버스 전환)
- PopCanvas에 접이식 ModalSizeSettingsPanel + ModalThumbnailPreview 구현
- PopViewerWithModals 신규 생성 (뷰어 모달 렌더링 + 스택 관리)
- FULL 모달 전체화면 지원 (h-dvh, w-screen, rounded-none)
- pop-string-list 카드 버튼 액션 연동
- pop-icon / SelectedItemsDetailInput lucide import 최적화
- tsconfig skipLibCheck 설정 추가

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-23 13:54:49 +09:00

36 lines
1.3 KiB
TypeScript

/**
* PopDesignerContext - 디자이너 전역 컨텍스트
*
* ConfigPanel 등 하위 컴포넌트에서 디자이너 레벨 동작을 트리거하기 위한 컨텍스트.
* 예: pop-button 설정 패널에서 "모달 캔버스 생성" 버튼 클릭 시
* 디자이너의 activeCanvasId를 변경하고 새 모달을 생성.
*
* Provider: PopDesigner.tsx
* Consumer: pop-button ConfigPanel (ModalCanvasButton)
*/
"use client";
import { createContext, useContext } from "react";
export interface PopDesignerContextType {
/** 새 모달 캔버스 생성하고 해당 탭으로 전환 (모달 ID 반환) */
createModalCanvas: (buttonComponentId: string, title: string) => string;
/** 특정 캔버스(메인 또는 모달)로 전환 */
navigateToCanvas: (canvasId: string) => void;
/** 현재 활성 캔버스 ID ("main" 또는 모달 ID) */
activeCanvasId: string;
/** 현재 선택된 컴포넌트 ID */
selectedComponentId: string | null;
}
export const PopDesignerContext = createContext<PopDesignerContextType | null>(null);
/**
* 디자이너 컨텍스트 사용 훅
* 뷰어 모드에서는 null 반환 (Provider 없음)
*/
export function usePopDesignerContext(): PopDesignerContextType | null {
return useContext(PopDesignerContext);
}