VanillaFront

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

Va.DatePicker — 캘린더 팝업이 있는 날짜 선택 필드날짜를 입력받는 컴포넌트. 좌측에 날짜 마스킹(YYYY-MM-DD) 입력창, 우측에 캘린더 아이콘이 있고, 아이콘 클릭 또는 Enter 시 월간 캘린더 팝업이 열립니다. ColorPicker와 같은 팝업 패턴을 따르되, 내부에 달력 렌더링 로직이 붙어 있습니다.클래스: Va.DatePicker — va_component.js:6654short name: datePicker상속: Va.PureField (Input/Combobox와 형제)isContainer: true베이스 CSS: va-input (팝업은 va-menu-pop, 달력은 calendar-inner)소스 크기: 약 566줄1. 기본 사용{ tagName: 'datePicke..

Va.FilterboxField — 라벨 + 실시간 필터링 드롭다운 + 검증Va.Filterbox가 순수 필터박스라면, Va.FilterboxField는 그 위에 라벨·필수 표시·검증 메시지를 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.Filterbox를 소유하는 Composition 구조. ComboboxField의 사촌.클래스: Va.FilterboxField — va_component.js:5797short name: filterboxField상속: Va.Field (ComboboxField·TagField 등과 형제)내부 컴포넌트: Va.Filterbox 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va-combobox-fiel..

Va.Filterbox — 타이핑으로 실시간 필터링되는 드롭다운Va.Combobox가 "옵션에서 선택"이라면, Va.Filterbox는 "옵션이 많을 때 타이핑으로 좁혀 찾아 선택" 하는 컴포넌트입니다. 코드 구조는 Combobox와 판박이지만, 자유 입력 + 실시간 필터링 로직이 추가되어 있어 옵션이 수십·수백 개일 때 진가를 발휘합니다.클래스: Va.Filterbox — va_component.js:2841short name: filterbox상속: Va.PureField (Combobox와 형제)isContainer: true베이스 CSS: va-filterbox (팝업은 va-menu-pop)소스 크기: 약 1632줄 — Combobox와 함께 최대 크기 1. 기본 사용{ tagName: '..

Va.TagField — 라벨 + 태그(칩) 입력 + 검증까지 감싼 완성 폼 필드Va.Tag가 순수 태그 칩 입력이라면, Va.TagField는 그 위에 라벨·필수 표시·검증 메시지·설명 텍스트 + 부모-자식 필드 바인딩을 얹은 완성 폼 필드입니다. ComboboxField와 완전히 같은 아키텍처 패턴을 따르되, 내부에 Va.Combobox 대신 Va.Tag 를 소유합니다.클래스: Va.TagField — va_tag.js:1407short name: tagField상속: Va.Field (ComboboxField·InputField 등과 형제)파일: va_tag.js (import 필요)내부 컴포넌트: Va.Tag 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va..