@heejun-com/theme-eclipse
v2.0.0-beta.16
Published
Orbit UI Eclipse 테마 컴포넌트
Readme
@orbit-ui/theme-eclipse
Eclipse 테마 컴포넌트
설치
pnpm add @orbit-ui/theme-eclipse사용법
import { SolidButton, OutlinedButton, ForgeRoot } from '@orbit-ui/theme-eclipse'
import '@orbit-ui/theme-eclipse/style.css'
function App() {
return (
<ForgeRoot>
<SolidButton variant="primary" size="medium">
확인
</SolidButton>
<OutlinedButton variant="primary" size="medium">
취소
</OutlinedButton>
</ForgeRoot>
)
}Next.js
// app/layout.tsx
import { ForgeRoot } from '@orbit-ui/theme-eclipse/server'
import '@orbit-ui/theme-eclipse/style.css'
export default function RootLayout({ children }) {
return (
<html>
<body>
<ForgeRoot>{children}</ForgeRoot>
</body>
</html>
)
}컴포넌트
버튼
SolidButton- 채워진 버튼OutlinedButton- 외곽선 버튼TextButton- 텍스트 버튼IconButton- 아이콘 버튼
입력
TextField- 텍스트 입력FloatingTextField- 플로팅 라벨 입력Dropdown- 드롭다운Checkbox- 체크박스RadioButton- 라디오Toggle- 토글 스위치
피드백
AlertDialog- 알림 다이얼로그Toast- 토스트Badge- 배지
내비게이션
TabItem- 탭NavigationBar- 네비게이션 바
레이아웃
Flex- 플렉스박스Spacer- 여백Divider- 구분선
테마 커스터마이징
<SolidButton
theme={{
enabledFill: '#FF6B6B',
enabledForeground: '#FFFFFF',
}}
>
커스텀
</SolidButton>라이선스
MIT