- 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>
36 lines
1.3 KiB
TypeScript
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);
|
|
}
|