셀렉트 박스 본체만 렌더링하는 단일 선택 컴포넌트입니다.
라벨·필수 표시(*)·하단 메시지는 포함하지 않습니다. 해당 요소가 필요하면
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
선택 가능한 항목은 Bottom sheet 로 제공하며, 선택 결과를 콜백으로 반환합니다.
var selectedData by remember { mutableStateOf<WantedSelectData?>(null)}val selectDataList =listOf(WantedSelectData(id ="1", text ="백엔드"),WantedSelectData(id ="2", text ="프론트엔드"))WantedFormControl(
label ="직무",
required =true,
description ="직무를 선택해 주세요."){WantedSelect(
selectData = selectedData,
placeHolder ="선택해 주세요.",
enabled =true,
selectDataList = selectDataList,
onSelectData ={ selectedData = it })}
Parameters
이름
타입
설명
selectData
WantedSelectData?
화면에 표시할 현재 선택된 값입니다. null 이거나 text 가 비어 있으면 placeHolder 를 표시합니다.
placeHolder
String
선택 전 표시되는 플레이스홀더 텍스트입니다.
enabled
Boolean
선택 가능 여부입니다. false 면 클릭이 막히고 disable 스타일이 적용됩니다.
selectDataList
List<WantedSelectData>
Bottom sheet 에 표시할 선택 가능한 항목 리스트입니다. 비어 있으면 Bottom sheet 를 열지 않습니다.
modifier
Modifier
레이아웃 및 스타일을 설정합니다.
status
WantedSelectDefaults.Status
셀렉트 박스의 상태입니다. (Normal, Negative) Negative 면 border 가 red 로 바뀌고 focus 시 red ring 을 표시합니다.
focused
Boolean
포커스 상태 여부입니다. true 면 primary ring 과 border 를 표시하고 chevron 이 위를 향합니다.
confirmText
String
Bottom sheet 확인 버튼 텍스트입니다. 비어 있으면 항목 선택 시 즉시 반영됩니다.
selectedData
WantedSelectData?
Bottom sheet 진입 시 체크 표시할 항목입니다.
bottomSheetType
WantedModalContract.ModalType
Bottom sheet 형식입니다. (Flexible, Fixed 등)
selectType
WantedSelectDefaults.SelectType
Bottom sheet 항목의 선택 UI 타입입니다. (CheckMark, CheckBox, Radio)
size
WantedSelectDefaults.Size
셀렉트 박스의 크기입니다. (Large, Medium)
background
Color
셀렉트 박스의 배경 색상입니다. enabled 가 false 면 무시됩니다.
leadingIcon
(@Composable () -> Unit)?
좌측 아이콘 슬롯입니다. Icon / Icon button / custom 을 넣을 수 있습니다.
셀렉트 박스 본체만 렌더링하는 다중 선택 컴포넌트입니다.
라벨·필수 표시(*)·하단 메시지는 포함하지 않습니다. 해당 요소가 필요하면
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
선택된 항목은 render 값에 따라 Chip 또는 텍스트로 표시합니다.
var selectedDataList by remember {mutableStateOf(listOf<WantedSelectData>())}val selectDataList =listOf(WantedSelectData(id ="1", text ="개발"),WantedSelectData(id ="2", text ="디자인"))WantedFormControl(
label ="관심 분야",
required =true){WantedSelect(
selectedDataList = selectedDataList,
placeHolder ="선택해 주세요.",
enabled =true,
selectDataList = selectDataList,
render = WantedSelectDefaults.MultiSelectRender.Chip,
onDeleteData ={ item -> selectedDataList = selectedDataList - item },
onSelectDataList ={ selectedDataList = it })}
Parameters
이름
타입
설명
selectedDataList
List<WantedSelectData>
현재 선택된 항목 리스트입니다. 비어 있으면 placeHolder 를 표시합니다.
placeHolder
String
선택 전 표시되는 플레이스홀더 텍스트입니다.
enabled
Boolean
선택 가능 여부입니다. false 면 클릭이 막히고 disable 스타일이 적용됩니다.
selectDataList
List<WantedSelectData>
Bottom sheet 에 표시할 선택 가능한 항목 리스트입니다. 비어 있으면 Bottom sheet 를 열지 않습니다.
modifier
Modifier
레이아웃 및 스타일을 설정합니다.
status
WantedSelectDefaults.Status
셀렉트 박스의 상태입니다. (Normal, Negative) Negative 면 border 가 red 로 바뀌고 focus 시 red ring 을 표시합니다.
errorDataList
List<WantedSelectData>
오류로 표시할 항목 리스트입니다. 포함된 Chip 이 negative 스타일로 표시됩니다. 컨테이너 상태는 status 가 결정합니다.
focused
Boolean
포커스 상태 여부입니다. true 면 primary ring 과 border 를 표시하고 chevron 이 위를 향합니다.
confirmText
String
Bottom sheet 확인 버튼 텍스트입니다. 비어 있으면 항목을 토글할 때마다 즉시 반영되고 Bottom sheet 가 열린 상태로 유지됩니다.
overflow
Boolean
선택 항목이 가로로 넘칠 때 줄바꿈할지 여부입니다. false 면 가로 스크롤로 표시합니다.
selectType
WantedSelectDefaults.SelectType
Bottom sheet 항목의 선택 UI 타입입니다. (CheckMark, CheckBox, Radio)
render
WantedSelectDefaults.MultiSelectRender
선택 항목 표시 방식입니다. (Chip, Text)
size
WantedSelectDefaults.Size
셀렉트 박스의 크기입니다. (Large, Medium)
background
Color
셀렉트 박스의 배경 색상입니다. Chip 가로 스크롤 시 gradient 색상으로도 사용됩니다.
leadingIcon
(@Composable () -> Unit)?
좌측 아이콘 슬롯입니다. Icon / Icon button / custom 을 넣을 수 있습니다.
셀렉트 박스 본체만 렌더링하는 문자열 기반 단일 선택 컴포넌트입니다.
항목이 텍스트뿐이라 WantedSelectData 가 필요 없을 때 사용하는 편의 오버로드입니다.
내부적으로 문자열을 WantedSelectData(text = it) 로 변환해 WantedSelect(selectData = ...) 에 위임합니다.
라벨·필수 표시(*)·하단 메시지가 필요하면 WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
var selectedValue by remember {mutableStateOf("")}WantedFormControl(label ="직무", required =true){WantedSelect(
value = selectedValue,
placeHolder ="선택해 주세요.",
enabled =true,
selectValueList =listOf("백엔드","프론트엔드","디자이너"),
onSelect ={ selectedValue = it })}
Parameters
이름
타입
설명
value
String
화면에 표시할 현재 선택된 값입니다. 비어 있으면 placeHolder 를 표시합니다.
placeHolder
String
선택 전 표시되는 플레이스홀더 텍스트입니다.
enabled
Boolean
선택 가능 여부입니다. false 면 클릭이 막히고 disable 스타일이 적용됩니다.
selectValueList
List<String>
Bottom sheet 에 표시할 선택 가능한 항목 리스트입니다. 비어 있으면 Bottom sheet 를 열지 않습니다.
modifier
Modifier
레이아웃 및 스타일을 설정합니다.
status
WantedSelectDefaults.Status
셀렉트 박스의 상태입니다. (Normal, Negative) Negative 면 border 가 red 로 바뀌고 focus 시 red ring 을 표시합니다.
focused
Boolean
포커스 상태 여부입니다. true 면 primary ring 과 border 를 표시하고 chevron 이 위를 향합니다.
confirmText
String
Bottom sheet 확인 버튼 텍스트입니다. 비어 있으면 항목 선택 시 즉시 반영됩니다.
selectedValue
String?
Bottom sheet 진입 시 체크 표시할 항목입니다.
bottomSheetType
WantedModalContract.ModalType
Bottom sheet 형식입니다. (Flexible, Fixed 등)
selectType
WantedSelectDefaults.SelectType
Bottom sheet 항목의 선택 UI 타입입니다. (CheckMark, CheckBox, Radio)
size
WantedSelectDefaults.Size
셀렉트 박스의 크기입니다. (Large, Medium)
background
Color
셀렉트 박스의 배경 색상입니다. enabled 가 false 면 무시됩니다.
leadingIcon
(@Composable () -> Unit)?
좌측 아이콘 슬롯입니다. Icon / Icon button / custom 을 넣을 수 있습니다.
셀렉트 박스 본체만 렌더링하는 문자열 기반 다중 선택 컴포넌트입니다.
항목이 텍스트뿐이라 WantedSelectData 가 필요 없을 때 사용하는 편의 오버로드입니다.
내부적으로 문자열을 WantedSelectData(text = it) 로 변환해 WantedSelect(selectedDataList = ...) 에 위임합니다.
라벨·필수 표시(*)·하단 메시지가 필요하면 WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
List<WantedSelectData> 오버로드와 JVM 시그니처가 겹치므로 @JvmName 으로 이름을 구분합니다.
(Deprecated) 제목·메시지 레이아웃을 함께 렌더링하는 문자열 기반 단일 선택 컴포넌트입니다.
title·isRequiredBadge·description 은 WantedFormControl 의 label·required·description 으로
대체되었습니다. 셀렉트 박스 본체만 담당하는 WantedSelect(selectData = ...) 를
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
(Deprecated) 제목·메시지 레이아웃을 함께 렌더링하는 WantedSelectData 기반 단일 선택 컴포넌트입니다.
title·isRequiredBadge·description 은 WantedFormControl 의 label·required·description 으로
대체되었습니다. 셀렉트 박스 본체만 담당하는 WantedSelect(selectData = ...) 를
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
(Deprecated) 제목·메시지 레이아웃을 함께 렌더링하는 WantedSelectData 기반 다중 선택 컴포넌트입니다.
title·isRequiredBadge·description 은 WantedFormControl 의 label·required·description 으로
대체되었습니다. 셀렉트 박스 본체만 담당하는 WantedSelect(selectedDataList = ...) 를
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
negativeDataList 는 errorDataList 로 이름이 바뀌었습니다.
(Deprecated) 제목·메시지 레이아웃을 함께 렌더링하는 문자열 리스트 기반 다중 선택 컴포넌트입니다.
title·isRequiredBadge·description 은 WantedFormControl 의 label·required·description 으로
대체되었습니다. 셀렉트 박스 본체만 담당하는 WantedSelect(selectedDataList = ...) 를
WantedFormControl 의 input 슬롯에 조합해서 사용합니다.
문자열은 WantedSelectData(text = it) 로 변환해서 전달합니다.
WantedSelect, WantedMultiSelect에서 사용되는 선택 항목 데이터 모델입니다.
선택 가능한 항목을 구성할 때 텍스트, 아이콘 리소스, URL, 부가 데이터 등을 함께 담을 수 있습니다.
val item =WantedSelectData(
id ="01",
text ="디자인",
iconUrl ="https://icon.url",
iconRes = R.drawable.ic_design,
tint = R.color.foreground_brand_primary,
any = DesignCategory.UI
)