reopt designreopt design
DocsExploreToolsPricingBuilder
Explore/
opt-ui161opt-charts21opt-datagrid5opt-editor5opt-chat6opt-shell14brandapp-ui8Examples12
Overview161Core55Blocks75Pages31
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • GitHub
  • 서비스 약관
  • 개인정보처리방침

© 2026 reopt-ai. All rights reserved.

Explore/Core/Form

Form

컴포넌트

접근성 폼 시스템. opt-ui-primitives Form API 기반. 31 exports: FormRoot, FormProvider, FormGroup, FormGroupLabel, FormDescription, FormField, FormControl, FormInput, FormTextarea, FormSelect, FormSelectPopover, FormSelectItem, FormSwitch, FormLabel, FormError, FormSubmit, FormCheckbox, FormRadioGroup, FormRadio, FormPush, FormRemove, FormReset, FormNumberInput, FormSlider, FormStarRating, FormColorPicker, FormIconPicker, FormTagInput, FormDateRangePicker + useFormStore, useFormContext hooks.

formtrigger
관련 문서
bun add @reopt-ai/opt-ui
100%

기본 사용

회사 이메일을 입력해주세요.

FormGroup — 필드 시맨틱 그룹핑

개인 정보
직무 정보

FormField + FormControl + FormDescription

영문, 숫자, 하이픈만 사용 가능합니다.

최대 200자까지 입력할 수 있습니다.

FormCheckbox + FormRadioGroup — Form Store 바인딩

구독 설정
요금제 선택

FormPush + FormRemove — 동적 배열 필드

태그 목록

태그를 추가하거나 제거할 수 있습니다.

FormProvider — Context 기반 폼 공유

프로필 설정 — Textarea + Switch

마케팅 알림 수신

FormSelect — 드롭다운 선택

종합 — 회원가입 폼

계정 정보

영문, 숫자를 포함하여 8자 이상 입력해주세요.

역할
보유 기술

보유한 기술 스택을 입력해주세요.

관련 컴포넌트

SettingsForm

데이터 기반 설정 폼. 유효성 검증, 라디오, 체크박스 지원.

폼

AuthForm

로그인/회원가입 모드 전환 가능한 인증 폼. 이메일·비밀번호 검증, FormSwitch로 로그인 상태 유지 옵션 지원.

폼

WizardForm

다단계 순차 입력 폼. FormFieldDef 기반 필드 정의, 단계별 검증, 진행 표시기, 리뷰 단계 지원.

폼

DynamicFieldForm

런타임 필드 추가/제거 폼. 최소/최대 필드 수 제약, 개별 검증, 동적 스토어 업데이트 지원.

폼

FileUploadForm

파일 선택, 메타데이터 표시, 이미지 미리보기를 포함한 업로드 폼. 파일 크기 제한, 설명 입력 지원.

폼

StepBuilder

순서가 있는 단계를 추가, 제거, 재정렬할 수 있는 빌더 컴포넌트.

트리거
이전Toolbar다음Button

기본 사용

테마

로그인 / 회원가입 폼

다단계 폼 (Wizard)

1
기본 정보
2
상세 정보
3
확인

동적 필드 추가/제거

파일 업로드 폼

Funnel Steps

Conversion Funnel
1
2
3

3 steps defined