선택 · SINCE v0.1.0
SelectableRow — 행 전체를 선택 대상으로 만드는 SelectableRow
선택 표시와 임의의 행 콘텐츠를 결합하고 selected·disabled 상태를 노출하는 React Native 선택 행입니다.
SelectableRow 사용 시점과 역할
SelectableRow는 SelectionIndicator와 children을 하나의 Pressable 행으로 묶습니다. 선택 상태는 외부에서 제어하며 indicator 크기나 마크 렌더러를 바꿔 목록·갤러리 선택 패턴에 맞출 수 있습니다.
- 행 전체 클릭 영역과 SelectionIndicator를 기본 조합
- selected 상태를 앱에서 관리하는 controlled 계약
- indicatorSize와 renderMark로 선택 마크를 교체
설치와 최소 예제
SelectableRow: 패키지 루트 엔트리에서 import한 뒤 앱이 소유한 상태와 이벤트를 연결하세요.
TypeScript
pnpm add @gj-kit/expo-ui
import { SelectableRow } from '@gj-kit/expo-ui';
<SelectableRow selected={selected} onPress={toggle}>앨범 선택</SelectableRow>접근성과 플랫폼 동작
button 역할과 selected·disabled 상태를 함께 노출합니다. children만으로 동작 목적이 명확하지 않을 때 accessibilityLabel을 지정할 수 있습니다.
기본 스타일은 현재 UiProvider 테마의 color, spacing, radius, typography, metric 역할에서 파생됩니다. Expo, bare React Native와 React Native Web에서 같은 prop 계약을 사용합니다.