VanillaFront

Va.MonthField — 라벨 + 년-월 선택 필드Va.MonthPicker가 순수 년-월 입력이라면, Va.MonthField는 그 위에 라벨·필수 표시·검증 메시지를 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.MonthPicker를 소유하는 Composition 구조. DateField·YearField와 같은 형제로, 월간 리포트·월별 필터 폼에 정확히 맞습니다.클래스: Va.MonthField — va_component.js:8743short name: monthField상속: Va.Field (다른 Field 형제들과 같음)내부 컴포넌트: Va.MonthPicker 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va-fiel..

Va.MonthPicker — 년-월을 선택하는 캘린더 팝업년도만 다루는 Va.YearPicker와 년-월-일을 다루는 Va.DatePicker의 중간 자리를 차지하는 컴포넌트입니다. 팝업엔 특정 년도의 12개월 격자가 표시되고, 좌우 화살표로 년도를 이동합니다. 월별 매출·월별 통계 필드에 정확히 어울려요.클래스: Va.MonthPicker — va_component.js:5947short name: monthPicker상속: Va.PureField (YearPicker·DatePicker와 형제)isContainer: true베이스 CSS: va-monthpicker (팝업 va-menu-pop, calendar-inner)1. 기본 사용{ tagName: 'monthPicker', val..

Va.YearField — 라벨 + 년도 선택 필드Va.YearPicker가 순수 년도 입력이라면, Va.YearField는 그 위에 라벨·필수 표시·검증 메시지를 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.YearPicker를 소유하는 Composition 구조. Date 계열 Field 중에서 가장 가볍고 단순합니다.클래스: Va.YearField — va_component.js:8645short name: yearField상속: Va.Field (다른 Field 형제들과 같음)내부 컴포넌트: Va.YearPicker 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va-field (role="date-field" 자동 부여)1. 기본..

Va.YearPicker — 년도만 선택하는 캘린더 팝업Va.DatePicker의 축소판. 년도 하나만 선택하는 데 특화된 컴포넌트입니다. 팝업엔 10년 단위 그리드가 표시되고, 화살표로 10년씩 이동합니다. 회계연도·연간 통계·설립연도 같은 필드에 적합해요.클래스: Va.YearPicker — va_component.js:6383short name: yearPicker상속: Va.PureField (DatePicker와 형제)isContainer: true베이스 CSS: va-yearpicker (팝업 va-menu-pop, calendar-inner) 1. 기본 사용{ tagName: 'yearPicker', value: '2024', onSelect: 'onYearChange'}화면..

Va.DateTimeField — 라벨 + 캘린더 팝업 + 시간까지Va.DateTimePicker가 순수 날짜+시간 입력이라면, Va.DateTimeField는 그 위에 라벨·필수 표시·검증 메시지까지 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.DateTimePicker를 소유하는 Composition 구조.클래스: Va.DateTimeField — va_component.js:8301short name: dateTimeField상속: Va.Field (다른 Field 형제들과 같음)내부 컴포넌트: Va.DateTimePicker 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va-field (role="date-field" 자동 부여)..