antsev-ui
v0.0.4
Published
antsev react component lib
Downloads
14
Readme
antsev-ui
antsev react component lib
Usage
使用 pnpm 安装
pnpm add antsev-ui
组件引用
import * as React from 'react';
import {
Demo,
Input,
Form,
FormItem,
Button,
Select,
useForm,
RadioGroup,
Radio,
Checkbox,
CheckboxGroup,
} from 'antsev-ui'
export default () => {
const form = useForm({
initialValues: {
name:'',
sex: '',
radios: 1964,
keys: [],
radio: '',
isProgress: false,
},
onSubmit: (values) => {
},
})
const mockOptions = [
{
label: 'Dr. Strangelove or: How I Learned to Stop Worrying and Love the Bomb',
value: 1964,
},
{ label: 'The Great Dictator', value: 1940 },
{ label: 'The Lives of Others', value: 2006 },
{ label: 'Grave of the Fireflies', value: 1988 },
{ label: 'Paths of Glory', value: 1957 },
{ label: 'Django Unchained', value: 2012 },
{ label: 'The Shining', value: 1980 },
]
const handleChange = (e) => {
console.log('----')
}
return (
<Demo>
<Demo grey>
{JSON.stringify(form.values)}
</Demo>
<Form {...form}>
<FormItem
label='名称'
required
name='name'
max={10}
/>
<FormItem
label='性别'
name='sex'
required
options={mockOptions}
/>
<FormItem
name='radios'
sx={{ height: 'auto'}}
>
<RadioGroup row={false} onChange={handleChange} options={mockOptions} />
</FormItem>
</Form>
<Button onClick={form.handleReset} variant='outlined' sx={{ mr:1 }}>
重置
</Button>
<Button onClick={form.handleSubmit}>
提交
</Button>
</Demo>
)
}
Development
# install dependencies
$ pnpm install
# develop library by docs demo
$ pnpm start
# build library source code
$ pnpm run build
# build library source code in watch mode
$ pnpm run build:watch
# build docs
$ pnpm run docs:build
# Locally preview the production build.
$ pnpm run docs:preview
# check your project for potential problems
$ pnpm run doctor