ERP-node/frontend/lib/registry/components/button-primary

ButtonPrimary 컴포넌트

button-primary 컴포넌트입니다

개요

• ID: button-primary
• 카테고리: action
• 웹타입: button
• 작성자: 개발팀
• 버전: 1.0.0

특징

• ✅ 자동 등록 시스템
• ✅ 타입 안전성
• ✅ Hot Reload 지원
• ✅ 설정 패널 제공
• ✅ 반응형 디자인

사용법

기본 사용법

import { ButtonPrimaryComponent } from "@/lib/registry/components/button-primary";

<ButtonPrimaryComponent
  component={{
    id: "my-button-primary",
    type: "widget",
    webType: "button",
    position: { x: 100, y: 100, z: 1 },
    size: { width: 120, height: 36 },
    config: {
      // 설정값들
    }
  }}
  isDesignMode={false}
/>

설정 옵션

속성	타입	기본값	설명
text	string	"버튼"	버튼 텍스트
actionType	string	"button"	버튼 타입
variant	string	"primary"	버튼 스타일
disabled	boolean	false	비활성화 여부
required	boolean	false	필수 입력 여부
readonly	boolean	false	읽기 전용 여부

이벤트

• onChange: 값 변경 시
• onFocus: 포커스 시
• onBlur: 포커스 해제 시
• onClick: 클릭 시

스타일링

컴포넌트는 다음과 같은 스타일 옵션을 제공합니다:

• variant: "default" | "outlined" | "filled"
• size: "sm" | "md" | "lg"

예시

// 기본 예시
<ButtonPrimaryComponent
  component={{
    id: "sample-button-primary",
    config: {
      placeholder: "입력하세요",
      required: true,
      variant: "outlined"
    }
  }}
/>

개발자 정보

• 생성일: 2025-09-11
• CLI 명령어: node scripts/create-component.js button-primary --category=action --webType=button
• 경로: lib/registry/components/button-primary/

관련 문서

• 컴포넌트 시스템 가이드
• 개발자 문서