API Reference
`@flemo/react`의 모든 export
컴포넌트
| Export | 요약 | 패키지 | 자세히 |
|---|---|---|---|
Router | 루트 컨테이너. 활성 화면을 렌더해요. | @flemo/react | Router |
Route | 경로(또는 경로 배열)를 element와 연결해요. | @flemo/react | Router |
Screen | 라우트별 화면 컨테이너. 앱·네비·안전영역 슬롯을 가져요. | @flemo/react | Screen |
LayoutScreen | 화면 사이 layoutId 모핑을 지원하는 Screen 변형. | @flemo/react-layout | LayoutScreen |
LayoutConfig | 현재 화면의 전환 타이밍을 motion 자식에 전달해요. | @flemo/react-layout | LayoutScreen |
훅
| Export | 반환 | 자세히 |
|---|---|---|
useNavigate() | { push, replace, pop } | Navigation |
useParams<T>() | 현재 라우트의 파라미터 (경로 + 쿼리 병합) | Navigation |
useStep<T>() | sub-state 전환용 { pushStep, replaceStep, popStep } | Navigation |
useScreen() | 현재 화면의 메타 (id, isActive, zIndex …) | — |
useViewportScrollHeight() | visualViewport 기반 스크롤 정보. 모바일 키보드 처리에 유용해요. | — |
전환 팩토리
| Export | 사용 시점 |
|---|---|
createTransition | 여섯 단계 전환 (idle / enter / exit / enterBack / exitBack) |
createRawTransition | 모든 navigate 상태를 직접 제어 |
createDecorator | 여섯 단계 데코레이터 |
createRawDecorator | 상태별 완전 제어가 가능한 데코레이터 |
예제는 Transitions에 있어요.
내장 전환 이름
"cupertino" · "material" · "layout" · "none"
내장 데코레이터 이름
"overlay"
타입 레지스트리
| 인터페이스 | 용도 |
|---|---|
RegisterRoute | 라우트 등록 — navigate.push, useParams의 타입 안전 |
RegisterTransition | 커스텀 전환 이름 등록 |
RegisterDecorator | 커스텀 데코레이터 이름 등록 |
declare module "@flemo/react" {
interface RegisterRoute {
/* … */
}
interface RegisterTransition {
/* … */
}
interface RegisterDecorator {
/* … */
}
}타입 export
ScreenProps · TransitionName · RegisterTransition · DecoratorName · RegisterDecorator
Peer dependencies
@flemo/react는 react ^19, react-dom ^19만 peer로 요구해요. @flemo/react-layout은 motion ^12을
추가 peer로 가져요 — <LayoutScreen>이나 <LayoutConfig>를 쓸 때 같이 설치하세요.