@para-ui/core 2.1.35 → 2.1.38

package/docs/view/cascader/index.tsx

@@ -1,261 +0,0 @@
-import React, {FunctionComponent} from 'react';
-import CodeBox from '../../components/codeBox';
-import Cascader from 'src/Cascader';
-import APITable from '../../components/apiTable';
-import Title from '../../components/title';
-import {
-    basicCascader,
-    valueCascader,
-    customJoinCascader,
-    customExpandIconCascader,
-    disabledCascader,
-    triggerCascader,
-    downChangeCascader,
-    changeUpdateCascader,
-    customFieldCascader,
-    placeholderCascader,
-    loadCascader,
-    iconCascader
-} from './codeString';
-import apiData, {apiOptionData} from './api';
-import './index.scss';
-
-const data = [
-    {
-        'label': '福建',
-        'value': 'fj',
-        'children': [{
-            'label': '福州',
-            'value': 'fuzhou',
-            'children': [{
-                'label': '马尾',
-                'value': 'mawei',
-            }],
-        }, {
-            'label': '泉州',
-            'value': 'quanzhou',
-        }],
-    }, {
-        'label': '浙江',
-        'value': 'zj',
-        'children': [{
-            'label': '杭州',
-            'value': 'hangzhou',
-            'children': [{
-                'label': '余杭',
-                'value': 'yuhang',
-            }],
-        }],
-    }, {
-        'label': '北京',
-        'value': 'bj',
-        'children': [{
-            'label': '朝阳区',
-            'value': 'chaoyang',
-        }, {
-            'label': '海淀区',
-            'value': 'haidian',
-        }],
-    }
-];
-const addressOptions = [
-    {
-        label: '福建',
-        isLeaf: false,
-        value: 'fj',
-    },
-    {
-        label: '浙江',
-        isLeaf: false,
-        value: 'zj',
-    },
-];
-
-const ParaCascader: FunctionComponent = () => {
-
-    return (
-        <div className={'paraui-cascader-demo'}>
-            <Title name={'级联选择器'}>代码演示</Title>
-            <CodeBox
-                code={basicCascader}
-                title={'基本'}
-                description={'基本。'}
-            >
-                <Cascader data={data} onChange={(val) => {
-                    console.log(val)
-                }} />
-            </CodeBox>
-            <CodeBox
-                code={valueCascader}
-                title={'带默认值'}
-                description={'带默认值。'}
-            >
-                <Cascader data={data}
-                    value={['fj', 'fuzhou', 'mawei']}
-                    onChange={(val, o) => {
-                        console.log(val)
-                        console.log(o)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={customJoinCascader}
-                title={'自定义分隔符:如 - '}
-                description={'自定义分隔符:如 - 。'}
-            >
-                <Cascader data={data}
-                    expandJoin=" - "
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={customExpandIconCascader}
-                title={'自定义箭头'}
-                description={'自定义箭头。'}
-            >
-                <Cascader data={data}
-                    expandIcon={<span>&gt;</span>}
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={disabledCascader}
-                title={'禁用状态'}
-                description={'禁用状态 。'}
-            >
-                <Cascader data={data} disabled />
-            </CodeBox>
-            <CodeBox
-                code={triggerCascader}
-                title={'触发选择：hover | click'}
-                description={'触发选择：hover | click。'}
-            >
-                <Cascader data={data}
-                    expandTrigger="hover"
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={downChangeCascader}
-                title={'级联是否触发'}
-                description={'级联是否触发 。'}
-            >
-                <Cascader data={data}
-                    onDropdownVisibleChange={(visible) => {
-                        console.log(visible)
-                        alert(visible ? '显示' : '隐藏')
-                    }}
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={changeUpdateCascader}
-                title={'每次选则触发修改'}
-                description={'每次选则触发修改 。'}
-            >
-                <Cascader data={data}
-                    changeOnSelect
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={customFieldCascader}
-                title={'自定义级联字段'}
-                description={'自定义级联字段 。'}
-            >
-                <Cascader data={data} onChange={(val) => {
-                    console.log(val)
-                }} />
-            </CodeBox>
-            <CodeBox
-                code={placeholderCascader}
-                title={'自定义placeholder'}
-                description={'自定义placeholder 。'}
-            >
-                <Cascader data={data} placeholder="来选我呀" onChange={(val) => {
-                    console.log(val)
-                }} />
-            </CodeBox>
-            <CodeBox
-                code={loadCascader}
-                title={'动态加载数据'}
-                description={'动态加载数据 。'}
-            >
-                <Cascader data={addressOptions}
-                    loadData={(selectedOptions) => {
-                        console.log(selectedOptions)
-                        const targetOption = selectedOptions[selectedOptions.length - 1];
-                        targetOption.loading = true;
-                        // 动态加载下级数据
-                        return new Promise((resolve) => {
-                            setTimeout(() => {
-                                targetOption.loading = false;
-                                targetOption.children = [
-                                    {
-                                        label: `${targetOption.label}动态加载1`,
-                                        value: 'dynamic1',
-                                        isLeaf: false
-
-                                    },
-                                    {
-                                        label: `${targetOption.label}动态加载2`,
-                                        value: 'dynamic2',
-                                    },
-                                ];
-                                resolve(targetOption);
-                            }, 1000);
-                        })
-                    }}
-
-                    onChange={(val) => {
-                        console.log(val)
-                    }} />
-            </CodeBox>
-            <CodeBox
-                code={iconCascader}
-                title={'自定义加载icon'}
-                description={'自定义加载icon 。'}
-            >
-                <Cascader data={addressOptions}
-                    loadData={(selectedOptions) => {
-                        console.log(selectedOptions)
-                        const targetOption = selectedOptions[selectedOptions.length - 1];
-                        targetOption.loading = true;
-                        // 动态加载下级数据
-                        return new Promise((resolve) => {
-                            setTimeout(() => {
-                                targetOption.loading = false;
-                                targetOption.children = [
-                                    {
-                                        label: `${targetOption.label}动态加载1`,
-                                        value: 'dynamic1',
-                                        isLeaf: false
-
-                                    },
-                                    {
-                                        label: `${targetOption.label}动态加载2`,
-                                        value: 'dynamic2',
-                                    },
-                                ];
-                                resolve(targetOption);
-                            }, 1000);
-                        })
-                    }}
-
-                    onChange={(val) => {
-                        console.log(val)
-                    }}
-                    loadingIcon="loading..."
-                />
-            </CodeBox>
-            <APITable data={apiData} subTitle={'CascaderProps'} />
-            <APITable data={apiOptionData} subTitle={'Option'} showApi={false} />
-        </div>
-    );
-};
-
-export default ParaCascader;

package/docs/view/checkbox/api.tsx

@@ -1,148 +0,0 @@
-/**
- * @author linhd
- * @date 2022/2/14 2:04 PM
- * @description api
- */
-import {RowsData} from '../../components/apiTable';
-
-const apiData: RowsData = [
-    {
-        name: 'className',
-        desc: 'class样式名',
-        type: 'string'
-    },
-    {
-        name: 'style',
-        desc: 'style',
-        type: 'CSSProperties'
-    },
-    {
-        name: 'label',
-        desc: '标题',
-        type: 'ReactNode'
-    },
-    {
-        name: 'labelTooltip',
-        desc: '提示语配置,看表单label组件用法',
-        type: 'LabelTooltipProps'
-    },
-    {
-        name: 'size',
-        desc: '尺寸',
-        type: 'small | medium | large',
-        default: 'large'
-    },
-    {
-        name: 'defaultChecked',
-        desc: '默认值  有值不受控组件 初始化第一次',
-        type: 'boolean'
-    },
-    {
-        name: 'checked',
-        desc: '默认值 有值受控组件',
-        type: 'boolean'
-    },
-    {
-        name: 'disabled',
-        desc: '禁用',
-        type: 'boolean',
-        default: 'false'
-    },
-    {
-        name: 'indeterminate',
-        desc: '半选',
-        type: 'boolean',
-        default: 'false'
-    },
-    {
-        name: 'inputProps',
-        desc: 'input身上的所有属性',
-        type: 'object'
-    },
-    {
-        name: 'onChange',
-        desc: '改变事件',
-        type: '(e: any, checked: boolean) => void'
-    }
-];
-
-export const apiDataGroup: RowsData = [
-    {
-        name: 'className',
-        desc: 'class样式名',
-        type: 'string'
-    },
-    {
-        name: 'label',
-        desc: '标题',
-        type: 'ReactNode'
-    },
-    {
-        name: 'labelTooltip',
-        desc: '提示语配置,看表单label组件用法',
-        type: 'LabelTooltipProps'
-    },
-    {
-        name: 'size',
-        desc: '尺寸',
-        type: 'small | medium | large',
-        default: 'large'
-    },
-    {
-        name: 'disabled',
-        desc: '禁用',
-        type: 'boolean',
-        default: 'false'
-    },
-    {
-        name: 'required',
-        desc: '是否必填',
-        type: 'boolean',
-        default: 'false'
-    },
-    {
-        name: 'row',
-        desc: '布局方式 横向/竖向',
-        type: 'boolean',
-        default: 'true'
-    },
-    {
-        name: 'error',
-        desc: '是否显示错误',
-        type: 'boolean',
-        default: 'false'
-    },
-    {
-        name: 'helperText',
-        desc: '错误提示',
-        type: 'ReactNode',
-    },
-    {
-        name: 'defaultValue',
-        desc: '默认值 不受控',
-        type: 'any',
-    },
-    {
-        name: 'value',
-        desc: '默认值 受控',
-        type: 'any',
-    },
-    {
-        name: 'id',
-        desc: '选中选值的key,默认name',
-        type: 'string',
-        default: 'name'
-    },
-    {
-        name: 'list',
-        desc: '选项数据',
-        type: 'CheckboxProps[]',
-    },
-    {
-        name: 'onChange',
-        desc: '改变值',
-        type: '(val: any, item?: ListProps) => void',
-    }
-]
-
-export default apiData;

package/docs/view/checkbox/codeString.tsx

@@ -1,215 +0,0 @@
-/**
- * @author linhd
- * @date 2022/2/14 2:04 PM
- * @description 源码字符串
- */
-export const basicCheckbox = `
-import Checkbox from '@para-ui/core/Checkbox';
-
-<Checkbox
-    label="默认"
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-/>
-<br />
-<br />
-<Checkbox
-    label="默认"
-    disabled={true}
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-    disabled={true}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-    disabled={true}
-/>
-<br />
-<br />
-<Checkbox
-    label="默认"
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<br />
-<br />
-<Checkbox
-    label="默认"
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<br />
-<br />
-<Checkbox
-    label="默认"
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<br />
-<br />
-<Checkbox
-    label="默认"
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<Checkbox
-    label="选中"
-    checked={true}
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<Checkbox
-    label="半选"
-    indeterminate={true}
-    disabled={true}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-<br/>
-<br/>
-<Checkbox
-    label="默认默认默认默认默认"
-    style={{width: '100px'}}
-/>
-<Checkbox
-    label="默认"
-/>
-`;
-
-export const basicCheckboxGroup = `
-import CheckboxGroup, {ListProps} from '@para-ui/core/CheckboxGroup';
-import ButtonGroup from '@para-ui/core/ButtonGroup';
-
-const [value, setValue] = useState<any>('1');
-const [size, setSize] = useState<any>('large');
-
-const list: ListProps[] = [
-    {
-        label: '选项1',
-        name: '1'
-    },
-    {
-        label: '选项2',
-        name: '2'
-    },
-    {
-        label: '选项3',
-        name: '3'
-    }
-];
-
-const clickBtnSize = (item: any) => {
-    setSize(item.value)
-}
-
-const onChange = (val: any) => {
-    setValue(val);
-}
-
-<div style={{marginBottom: '20px'}}>
-    <ButtonGroup
-        mode={'text'}
-        onClick={clickBtnSize}
-        data={[
-            {
-                text: '小(small)',
-                value: 'small'
-            },
-            {
-                text: '中(medium)',
-                value: 'medium'
-            },
-            {
-                text: '大(large)',
-                value: 'large'
-            },
-        ]}
-    />
-</div>
-<CheckboxGroup
-    label={'复选框组'}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-/>
-<CheckboxGroup
-    required={true}
-    label={'复选框组'}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-/>
-<CheckboxGroup
-    label={'复选框组'}
-    error={true}
-    helperText={'请选择'}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-/>
-<CheckboxGroup
-    label={'复选框组'}
-    row={false}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-/>
-<CheckboxGroup
-    label={'复选框组'}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-    labelTooltip={{tooltip: '帮组提示'}}
-/>
-<CheckboxGroup
-    label={'复选框组'}
-    list={list}
-    onChange={onChange}
-    value={value}
-    size={size}
-    labelTooltip={{tooltip: '帮组提示', tooltipType: 'line'}}
-/>
-`;