CP design
React hooks Typescript H5 Mobile Component
English | 简体中文

CP Design Mobile

A configurable Mobile UI specification and React-based implementation.
Features
- Follow CP Design Mobile UI specification.
- Configurable UI style for different products.
- Develop in TypeScript.
🖥 Environment Support
- Modern browsers and Internet Explorer 11+ (with polyfills)
- Server-side Rendering
- Electron
 IE / Edge |
 Firefox |
 Chrome |
 Safari |
 Electron |
IE11, Edge |
last 2 versions |
last 2 versions |
last 2 versions |
last 2 versions |
📦 Install
npm install cp-design --save
yarn add cp-design
✨ Notice
SASS is used in the component library, remember to install node-sass when installing
npm install node-sass --save-dev
yarn add node-sass -D
🔨 Usage
import { Button } from 'cp-design'
const App = () => (
<>
<Button type="primary">PRESS ME</Button>
</>
)
Componets
- [x] Icon,
- [x] Button,
- [x] Input,
- [x] Row,
- [x] Col,
- [x] Affix,
- [x] Avatar,
- [x] Badge,
- [x] Card,
- [x] CheckboxGroup,
- [x] Checkbox,
- [x] Accordion,
- [x] Divider,
- [x] Modal,
- [x] Overlay,
- [x] Pagination,
- [x] Progress,
- [x] Radio,
- [x] Slider,
- [x] Step,
- [x] Spin,
- [x] Switch,
- [x] Tabs,
- [x] Tag,
- [x] ImagePicker,
- [x] Toast,
- [x] ActionSheet,
- [x] TabBar,
- [x] PickerPanel,
- [x] Picker,
- [x] SegmentedControl,
- [x] Popover,
- [x] NoticeBar,
- [x] SwipeAction
- [x] ListView
Demo
mobile web demo

https://10086xiaozhang.github.io/CP-DESIGN
Install & Usage
introduce
Browser Support
Links
Contributing
We welcome all contributions, You can submit any ideas. If you'd like to improve code, check out the Development Instruction and have a good time! :)