408 lines
11 KiB
TypeScript
408 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { WebTypeRegistry } from "./WebTypeRegistry";
|
|
|
|
// 개별적으로 위젯 컴포넌트들을 import
|
|
import { TextWidget } from "@/components/screen/widgets/types/TextWidget";
|
|
import { NumberWidget } from "@/components/screen/widgets/types/NumberWidget";
|
|
import { DateWidget } from "@/components/screen/widgets/types/DateWidget";
|
|
import { SelectWidget } from "@/components/screen/widgets/types/SelectWidget";
|
|
import { TextareaWidget } from "@/components/screen/widgets/types/TextareaWidget";
|
|
import { CheckboxWidget } from "@/components/screen/widgets/types/CheckboxWidget";
|
|
import { RadioWidget } from "@/components/screen/widgets/types/RadioWidget";
|
|
import { FileWidget } from "@/components/screen/widgets/types/FileWidget";
|
|
import { CodeWidget } from "@/components/screen/widgets/types/CodeWidget";
|
|
import { EntitySearchInputWrapper } from "@/lib/registry/components/entity-search-input/EntitySearchInputWrapper";
|
|
import { ButtonWidget } from "@/components/screen/widgets/types/ButtonWidget";
|
|
|
|
// 개별적으로 설정 패널들을 import
|
|
import { TextConfigPanel } from "@/components/screen/config-panels/TextConfigPanel";
|
|
import { NumberConfigPanel } from "@/components/screen/config-panels/NumberConfigPanel";
|
|
import { DateConfigPanel } from "@/components/screen/config-panels/DateConfigPanel";
|
|
import { SelectConfigPanel } from "@/components/screen/config-panels/SelectConfigPanel";
|
|
import { TextareaConfigPanel } from "@/components/screen/config-panels/TextareaConfigPanel";
|
|
import { CheckboxConfigPanel } from "@/components/screen/config-panels/CheckboxConfigPanel";
|
|
import { RadioConfigPanel } from "@/components/screen/config-panels/RadioConfigPanel";
|
|
import { FileConfigPanel } from "@/components/screen/config-panels/FileConfigPanel";
|
|
import { CodeConfigPanel } from "@/components/screen/config-panels/CodeConfigPanel";
|
|
import { EntityConfigPanel } from "@/components/screen/config-panels/EntityConfigPanel";
|
|
import { ButtonConfigPanel } from "@/components/screen/config-panels/ButtonConfigPanel";
|
|
|
|
/**
|
|
* 웹타입 레지스트리 초기화
|
|
* 모든 기본 웹타입 컴포넌트와 설정 패널을 등록합니다.
|
|
*/
|
|
export function initializeWebTypeRegistry() {
|
|
// Text-based types
|
|
WebTypeRegistry.registerWebType({
|
|
id: "text",
|
|
name: "텍스트",
|
|
category: "input",
|
|
description: "단일 라인 텍스트 입력 필드",
|
|
component: TextWidget,
|
|
configPanel: TextConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "텍스트를 입력하세요",
|
|
maxLength: 255,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "email",
|
|
name: "이메일",
|
|
category: "input",
|
|
description: "이메일 주소 입력 필드",
|
|
component: TextWidget,
|
|
configPanel: TextConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "이메일을 입력하세요",
|
|
inputType: "email",
|
|
validation: "email",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "password",
|
|
name: "비밀번호",
|
|
category: "input",
|
|
description: "비밀번호 입력 필드",
|
|
component: TextWidget,
|
|
configPanel: TextConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "비밀번호를 입력하세요",
|
|
inputType: "password",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "tel",
|
|
name: "전화번호",
|
|
category: "input",
|
|
description: "전화번호 입력 필드",
|
|
component: TextWidget,
|
|
configPanel: TextConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "전화번호를 입력하세요",
|
|
inputType: "tel",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Number types
|
|
WebTypeRegistry.registerWebType({
|
|
id: "number",
|
|
name: "숫자",
|
|
category: "input",
|
|
description: "정수 입력 필드",
|
|
component: NumberWidget,
|
|
configPanel: NumberConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "숫자를 입력하세요",
|
|
min: undefined,
|
|
max: undefined,
|
|
step: 1,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "decimal",
|
|
name: "소수",
|
|
category: "input",
|
|
description: "소수점 숫자 입력 필드",
|
|
component: NumberWidget,
|
|
configPanel: NumberConfigPanel,
|
|
defaultConfig: {
|
|
placeholder: "소수를 입력하세요",
|
|
min: undefined,
|
|
max: undefined,
|
|
step: 0.01,
|
|
decimalPlaces: 2,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Date types
|
|
WebTypeRegistry.registerWebType({
|
|
id: "date",
|
|
name: "날짜",
|
|
category: "input",
|
|
description: "날짜 선택 필드",
|
|
component: DateWidget,
|
|
configPanel: DateConfigPanel,
|
|
defaultConfig: {
|
|
format: "YYYY-MM-DD",
|
|
showTime: false,
|
|
placeholder: "날짜를 선택하세요",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "datetime",
|
|
name: "날짜시간",
|
|
category: "input",
|
|
description: "날짜와 시간 선택 필드",
|
|
component: DateWidget,
|
|
configPanel: DateConfigPanel,
|
|
defaultConfig: {
|
|
format: "YYYY-MM-DD HH:mm",
|
|
showTime: true,
|
|
placeholder: "날짜와 시간을 선택하세요",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Selection types
|
|
WebTypeRegistry.registerWebType({
|
|
id: "select",
|
|
name: "선택박스",
|
|
category: "input",
|
|
description: "드롭다운 선택 필드",
|
|
component: SelectWidget,
|
|
configPanel: SelectConfigPanel,
|
|
defaultConfig: {
|
|
options: [
|
|
{ label: "옵션 1", value: "option1" },
|
|
{ label: "옵션 2", value: "option2" },
|
|
],
|
|
multiple: false,
|
|
searchable: false,
|
|
placeholder: "선택하세요",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "dropdown",
|
|
name: "드롭다운",
|
|
category: "input",
|
|
description: "검색 가능한 드롭다운 필드",
|
|
component: SelectWidget,
|
|
configPanel: SelectConfigPanel,
|
|
defaultConfig: {
|
|
options: [
|
|
{ label: "옵션 1", value: "option1" },
|
|
{ label: "옵션 2", value: "option2" },
|
|
],
|
|
multiple: false,
|
|
searchable: true,
|
|
placeholder: "검색하여 선택하세요",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Text area
|
|
WebTypeRegistry.registerWebType({
|
|
id: "textarea",
|
|
name: "텍스트영역",
|
|
category: "input",
|
|
description: "여러 줄 텍스트 입력 필드",
|
|
component: TextareaWidget,
|
|
configPanel: TextareaConfigPanel,
|
|
defaultConfig: {
|
|
rows: 4,
|
|
placeholder: "내용을 입력하세요",
|
|
resizable: true,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "text_area",
|
|
name: "텍스트 영역",
|
|
category: "input",
|
|
description: "여러 줄 텍스트 입력 필드 (언더스코어 형식)",
|
|
component: TextareaWidget,
|
|
configPanel: TextareaConfigPanel,
|
|
defaultConfig: {
|
|
rows: 4,
|
|
placeholder: "내용을 입력하세요",
|
|
resizable: true,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Boolean/Checkbox types
|
|
WebTypeRegistry.registerWebType({
|
|
id: "boolean",
|
|
name: "불린",
|
|
category: "input",
|
|
description: "참/거짓 선택 체크박스",
|
|
component: CheckboxWidget,
|
|
configPanel: CheckboxConfigPanel,
|
|
defaultConfig: {
|
|
label: "선택",
|
|
checkedValue: true,
|
|
uncheckedValue: false,
|
|
defaultChecked: false,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
WebTypeRegistry.registerWebType({
|
|
id: "checkbox",
|
|
name: "체크박스",
|
|
category: "input",
|
|
description: "체크박스 입력 필드",
|
|
component: CheckboxWidget,
|
|
configPanel: CheckboxConfigPanel,
|
|
defaultConfig: {
|
|
label: "체크박스",
|
|
checkedValue: "Y",
|
|
uncheckedValue: "N",
|
|
defaultChecked: false,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Radio button
|
|
WebTypeRegistry.registerWebType({
|
|
id: "radio",
|
|
name: "라디오버튼",
|
|
category: "input",
|
|
description: "라디오버튼 그룹 선택 필드",
|
|
component: RadioWidget,
|
|
configPanel: RadioConfigPanel,
|
|
defaultConfig: {
|
|
options: [
|
|
{ label: "옵션 1", value: "option1" },
|
|
{ label: "옵션 2", value: "option2" },
|
|
],
|
|
inline: true,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// File upload
|
|
WebTypeRegistry.registerWebType({
|
|
id: "file",
|
|
name: "파일 업로드",
|
|
category: "input",
|
|
description: "파일 업로드 필드",
|
|
component: FileWidget,
|
|
configPanel: FileConfigPanel,
|
|
defaultConfig: {
|
|
multiple: false,
|
|
maxFileSize: 10, // MB
|
|
acceptedTypes: [],
|
|
showPreview: true,
|
|
dragAndDrop: true,
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Code editor
|
|
WebTypeRegistry.registerWebType({
|
|
id: "code",
|
|
name: "코드 에디터",
|
|
category: "input",
|
|
description: "코드 편집 필드",
|
|
component: CodeWidget,
|
|
configPanel: CodeConfigPanel,
|
|
defaultConfig: {
|
|
language: "javascript",
|
|
theme: "light",
|
|
showLineNumbers: true,
|
|
height: 300,
|
|
required: false,
|
|
readOnly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Entity selection
|
|
WebTypeRegistry.registerWebType({
|
|
id: "entity",
|
|
name: "엔티티 선택",
|
|
category: "input",
|
|
description: "데이터베이스 엔티티 선택 필드",
|
|
component: EntitySearchInputWrapper,
|
|
configPanel: EntityConfigPanel,
|
|
defaultConfig: {
|
|
entityType: "",
|
|
valueField: "id",
|
|
labelField: "name",
|
|
multiple: false,
|
|
searchable: true,
|
|
placeholder: "엔티티를 선택하세요",
|
|
required: false,
|
|
readonly: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
|
|
// Button
|
|
WebTypeRegistry.registerWebType({
|
|
id: "button",
|
|
name: "버튼",
|
|
category: "action",
|
|
description: "클릭 가능한 버튼 컴포넌트",
|
|
component: ButtonWidget,
|
|
configPanel: ButtonConfigPanel,
|
|
defaultConfig: {
|
|
label: "버튼",
|
|
text: "",
|
|
tooltip: "",
|
|
variant: "primary",
|
|
size: "medium",
|
|
disabled: false,
|
|
fullWidth: false,
|
|
},
|
|
isActive: true,
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 애플리케이션 시작 시 호출되어야 하는 초기화 함수
|
|
*/
|
|
export function initializeRegistries() {
|
|
initializeWebTypeRegistry();
|
|
|
|
// Unified 컴포넌트 등록
|
|
try {
|
|
const { registerUnifiedComponents } = require("@/components/unified/registerUnifiedComponents");
|
|
registerUnifiedComponents();
|
|
} catch (error) {
|
|
console.warn("⚠️ Unified 컴포넌트 등록 실패:", error);
|
|
}
|
|
|
|
// 필요한 경우 버튼 액션 레지스트리도 여기서 초기화
|
|
// initializeButtonActionRegistry();
|
|
}
|