해당 라이브러리는 React StrictMode 를 호환하지 않습니다. index.tsx에서 React.StrictMode 로 래핑된 경우 해당 래핑을 해제해야 사용 가능합니다.
npm install --save @mdi/font
@import "~@mdi/font/css/materialdesignicons.min.css";
mdi icon font를 사용하기위해 개별로 설치하여 global css파일에 import 를 해야 정상적인 사용이 가능합니다.
// index.tsx
import { ThemeProvider } from '@ktnexr/neb-ui'
ReactDOM.render(
<ThemeProvider>
<App />
</ThemeProvider>
,
document.getElementById('root')
);
- Icons
- Input
- CheckBox
- Input
- InputNumber
- Radio
- Search
- Select
- TextArea
- Button
- EmptyBox
- Form
- Form
- Group
- Item
- Loading
- OverlayLoading
- Table
- TableBase
- ThemeProvider
- defaultTheme
- Methods (type)
// index.tsx
import { ThemeProvider } from '@ktnexr/neb-ui'
ReactDOM.render(
<ThemeProvider
theme={{
primary: 'black',
primarystop1: 'white',
primarystop2: 'black',
}}
>
<App />
</ThemeProvider>
,
document.getElementById('root')
);
// index.tsx
import { ThemeProvider } from '@ktnexr/neb-ui'
ReactDOM.render(
<ThemeProvider
primary="#ff0000"
theme={{
primarystop1: 'white',
primarystop2: 'black',
}}
>
<App />
</ThemeProvider>
,
document.getElementById('root')
);
primary prop에 값을 추가 시 자동으로 해당값을 추출하여 rgba값을 생성합니다. 하지만 gradient color의 경우 primary값을 기준으로 추출할 방법이 없기 때문에 따로 입력을 해주셔야합니다.
- neb-ui 프로젝트 혹은 src/App.tsx 의 기본 예제를 확인 해주세요 :)