액션 · SINCE v0.1.0
Button — 로딩과 위험 작업까지 표현하는 타입 안전 Button
primary, outline, destructive, inverse 변형과 세 가지 크기, 로딩 상태를 제공하는 Expo·React Native 버튼입니다.
Button 사용 시점과 역할
Button은 label 또는 비어 있지 않은 children을 반드시 요구해 내용 없는 버튼을 타입 단계에서 막습니다. variant, size, icon 렌더 함수와 loading을 조합하면서 색상과 치수는 활성 테마에서 해석합니다.
- primary, primary-outline, secondary, destructive, destructive-outline, inverse 변형
- sm, md, lg 크기와 테마 기반 아이콘 크기·최대 글꼴 배율
- loading 중 ActivityIndicator를 표시하고 중복 입력을 차단
설치와 최소 예제
Button: 패키지 루트 엔트리에서 import한 뒤 앱이 소유한 상태와 이벤트를 연결하세요.
TypeScript
pnpm add @gj-kit/expo-ui
import { Button } from '@gj-kit/expo-ui';
<Button label="저장" loading={saving} onPress={save} />접근성과 플랫폼 동작
button 역할과 disabled·busy 상태를 네이티브 접근성 API와 웹 ARIA에 함께 전달합니다. 문자열 label은 기본 접근성 이름으로 사용되며 loading 중에는 버튼이 비활성화됩니다.
기본 스타일은 현재 UiProvider 테마의 color, spacing, radius, typography, metric 역할에서 파생됩니다. Expo, bare React Native와 React Native Web에서 같은 prop 계약을 사용합니다.