p85126437
/
amis
forked from p96170835/amis
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

修复 tsc 错误

This commit is contained in:
2betop 2020-05-27 19:31:50 +08:00
parent e15b98aced
commit 4f7a0bfa62
36 changed files with 483 additions and 394 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
publish.sh
View File

@ -11,15 +11,14 @@ rm -rf lib/node_modules
rm -rf sdk && fis3 release publish-sdk -c
# 生成 .d.ts 文件
tsc --allowJs --declaration || true
tsc --allowJs --declaration
cd output;
cd output
for f in `find . -name "*.d.ts"`;
do mkdir -p ../lib/`dirname $f` && mv $f ../lib/`dirname $f`;
for f in $(find . -name "*.d.ts"); do
mkdir -p ../lib/$(dirname $f) && mv $f ../lib/$(dirname $f)
done
cd ..;
cd ..
rm -rf output

4
src/components/ColorPicker.tsx
View File

@ -7,7 +7,7 @@
import React from 'react';
import cx from 'classnames';
import {findDOMNode} from 'react-dom';
import {SketchPicker, GithubPicker, ColorResult} from 'react-color';
import {SketchPicker, GithubPicker, ColorState} from 'react-color';
import {Icon} from './icons';
import Overlay from './Overlay';
import uncontrollable from 'uncontrollable';
@ -177,7 +177,7 @@ export class ColorControl extends React.PureComponent<
return image.style.color !== 'rgb(255, 255, 255)';
}
handleChange(color: ColorResult) {
handleChange(color: ColorState) {
const {
onChange,
format

4
src/components/Input.tsx
View File

@ -66,4 +66,6 @@ class InputInner extends React.Component<InputProps, InputState> {
export default React.forwardRef<HTMLInputElement>((props, ref) => {
return <InputInner {...props} forwardedRef={ref} />;
}) as React.ReactType<React.InputHTMLAttributes<HTMLInputElement>>;
}) as React.ComponentType<
React.InputHTMLAttributes<HTMLInputElement> & {ref?: any}
>;

1
src/components/LazyComponent.tsx
View File

@ -5,6 +5,7 @@
*/
import React from 'react';
// @ts-ignore
import VisibilitySensor from 'react-visibility-sensor';
import Spinner from './Spinner';

2
src/components/Overlay.tsx
View File

@ -21,7 +21,7 @@ BasePosition.propTypes.placement = () => null;
class Position extends BasePosition {
props: any;
_lastTarget: any;
setState: Function;
setState: (state: any) => void;
updatePosition(target: any) {
this._lastTarget = target;

4
src/components/Radios.tsx
View File

@ -146,9 +146,7 @@ export class Radios extends React.Component<RadioProps, any> {
multiple: false,
delimiter,
valueField,
options,
joinValues,
extractValue
options
});
let body: Array<React.ReactNode> = [];

3
src/components/Range.tsx
View File

@ -24,6 +24,7 @@ interface RangeProps extends RendererProps {
| number;
classPrefix: string;
classnames: ClassNamesFn;
onChange: (value: any) => void;
}
export class Range extends React.Component<RangeProps, any> {
@ -53,12 +54,10 @@ export class Range extends React.Component<RangeProps, any> {
return (
<InputRange
{...this.props}
className={className}
classNames={classNames}
minValue={min}
maxValue={max}
value={value}
multiple={multiple}
/>
);
}

17
src/components/RichText.tsx
View File

@ -88,16 +88,9 @@ export default class FroalaEditor extends React.Component<any, any> {
this.$element = $(ref);
this.setContent(true);
this.registerEvents();
resizeSensor(
ref.parentElement,
() => {
$(ref)
.prev('.fr-box')
.find('.fr-toolbar')
.css('width', '');
},
true
);
resizeSensor(ref.parentElement, () => {
$(ref).prev('.fr-box').find('.fr-toolbar').css('width', '');
});
this.$editor = this.$element
.froalaEditor(this.config)
.data('froala.editor').$el;
@ -164,12 +157,12 @@ export default class FroalaEditor extends React.Component<any, any> {
this.registerEvent(
this.$element,
'froalaEditor.contentChanged',
function() {
function () {
self.updateModel();
}
);
if (this.config.immediateReactModelUpdate) {
this.registerEvent(this.$editor, 'keyup', function() {
this.registerEvent(this.$editor, 'keyup', function () {
self.updateModel();
});
}

1
src/components/Textarea.tsx
View File

@ -1,2 +1,3 @@
// @ts-ignore
import Textarea from 'react-textarea-autosize';
export default Textarea;

10
src/components/Tree.tsx
View File

@ -132,8 +132,6 @@ export class TreeSelector extends React.Component<
this.setState({
value: value2array(props.value, {
joinValues: props.joinValues,
extractValue: props.extractValue,
multiple: props.multiple,
delimiter: props.delimiter,
valueField: props.valueField,
@ -157,8 +155,6 @@ export class TreeSelector extends React.Component<
this.props.options !== nextProps.options
) {
toUpdate.value = value2array(nextProps.value, {
joinValues: nextProps.joinValues,
extractValue: nextProps.extractValue,
multiple: nextProps.multiple,
delimiter: nextProps.delimiter,
valueField: nextProps.valueField,
@ -597,8 +593,10 @@ export class TreeSelector extends React.Component<
{showIcon ? (
<i
className={cx(
`Tree-itemIcon ${item[iconField] ||
(childrenItems ? 'Tree-folderIcon' : 'Tree-leafIcon')}`
`Tree-itemIcon ${
item[iconField] ||
(childrenItems ? 'Tree-folderIcon' : 'Tree-leafIcon')
}`
)}
/>
) : null}

4
src/renderers/Audio.tsx
View File

@ -33,8 +33,8 @@ export interface AudioState {
export class Audio extends React.Component<AudioProps, AudioState> {
audio: any;
progressTimeout: number;
durationTimeout: number;
progressTimeout: NodeJS.Timeout;
durationTimeout: NodeJS.Timeout;
static defaultProps: Pick<
AudioProps,

4
src/renderers/Carousel.tsx
View File

@ -74,8 +74,8 @@ const defaultSchema = {
export class Carousel extends React.Component<CarouselProps, CarouselState> {
wrapperRef: React.RefObject<HTMLDivElement> = React.createRef();
intervalTimeout: number;
durationTimeout: number;
intervalTimeout: NodeJS.Timer;
durationTimeout: NodeJS.Timer;
static defaultProps: Pick<
CarouselProps,

4
src/renderers/Container.tsx
View File

@ -24,10 +24,10 @@ export default class Container<T> extends React.Component<
<div className={cx('Container-body', bodyClassName)}>
{children
? typeof children === 'function'
? (children(this.props) as JSX.Element)
? ((children as any)(this.props) as JSX.Element)
: (children as JSX.Element)
: body
? (render('body', body) as JSX.Element)
? (render('body', body as any) as JSX.Element)
: null}
</div>
);

2
src/renderers/Form/Array.tsx
View File

@ -37,7 +37,7 @@ export default class ArrayControl extends React.Component<ArrayProps> {
return (
<Combo
{...rest}
{...(rest as any)}
controls={[items]}
flat
multiple

2
src/renderers/Form/Button.tsx
View File

@ -3,7 +3,7 @@ import {FormItem, FormControlProps} from './Item';
import cx from 'classnames';
import {Button} from '../../types';
export interface ButtonProps extends FormControlProps, Button {}
export interface ButtonProps extends FormControlProps, Omit<Button, 'size'> {}
export class ButtonControl extends React.Component<ButtonProps, any> {
static defaultProps: Partial<ButtonProps> = {};

400
src/renderers/Form/Combo.tsx
View File

@ -22,7 +22,7 @@ import {dataMapping, resolveVariable} from '../../utils/tpl-builtin';
import {isEffectiveApi} from '../../utils/api';
import {Alert2} from '../../components';
import memoize from 'lodash/memoize';
import {Icon}from '../../components/icons'
import {Icon} from '../../components/icons';
export interface Condition {
test: string;
controls: Array<Schema>;
@ -31,11 +31,11 @@ export interface Condition {
mode?: string;
}
function pickVars(vars:any, fields: Array<string>) {
return fields.reduce((data:any, key: string) => {
function pickVars(vars: any, fields: Array<string>) {
return fields.reduce((data: any, key: string) => {
data[key] = resolveVariable(key, vars);
return data;
}, {})
}, {});
}
export interface ComboProps extends FormControlProps {
@ -80,7 +80,25 @@ export interface ComboProps extends FormControlProps {
}
export default class ComboControl extends React.Component<ComboProps> {
static defaultProps = {
static defaultProps: Pick<
ComboProps,
| 'minLength'
| 'maxLength'
| 'multiple'
| 'multiLine'
| 'addButtonClassName'
| 'formClassName'
| 'subFormMode'
| 'draggableTip'
| 'addButtonText'
| 'canAccessSuperData'
| 'addIcon'
| 'dragIcon'
| 'deleteIcon'
| 'tabsMode'
| 'tabsStyle'
| 'placeholder'
> = {
minLength: 0,
maxLength: 0,
multiple: false,
@ -188,13 +206,19 @@ export default class ComboControl extends React.Component<ComboProps> {
// combo 进来了新的值，且这次 form 初始化时带来的新值变化，但是之前的值已经 onInit 过了
// 所以，之前 onInit 设置进去的初始值是过时了的。这个时候修复一下。
if (nextProps.value !== props.value && !props.formInited && this.subFormDefaultValues.length) {
this.subFormDefaultValues = this.subFormDefaultValues.map((item, index) => {
return {
...item,
values: values[index]
if (
nextProps.value !== props.value &&
!props.formInited &&
this.subFormDefaultValues.length
) {
this.subFormDefaultValues = this.subFormDefaultValues.map(
(item, index) => {
return {
...item,
values: values[index]
};
}
})
);
}
}
}
@ -390,7 +414,10 @@ export default class ComboControl extends React.Component<ComboProps> {
setted: false
});
if (syncDefaultValue === false || this.subFormDefaultValues.length !== this.subForms.length) {
if (
syncDefaultValue === false ||
this.subFormDefaultValues.length !== this.subForms.length
) {
return;
}
@ -429,11 +456,15 @@ export default class ComboControl extends React.Component<ComboProps> {
handleSingleFormInit(values: any) {
const {syncDefaultValue, setPrinstineValue, value, nullable} = this.props;
if (syncDefaultValue !== false && !nullable && isObjectShallowModified(value, values) && setPrinstineValue) {
if (
syncDefaultValue !== false &&
!nullable &&
isObjectShallowModified(value, values) &&
setPrinstineValue
) {
setPrinstineValue({
...values
})
});
}
}
@ -559,17 +590,33 @@ export default class ComboControl extends React.Component<ComboProps> {
}
memoizedFormatValue = memoize(
(strictMode: boolean, syncFields: Array<string> | void, value: any, index: number, data: any) => {
(
strictMode: boolean,
syncFields: Array<string> | void,
value: any,
index: number,
data: any
) => {
return createObject(
extendObject(data, {index, __index: index, ...data}),
{
...value,
...Array.isArray(syncFields) ? pickVars(data, syncFields!) : null
...(Array.isArray(syncFields) ? pickVars(data, syncFields!) : null)
}
);
},
(strictMode: boolean, syncFields: Array<string> | void, value: any, index: number, data: any) =>
Array.isArray(syncFields) ? JSON.stringify([value, index, data, pickVars(data, syncFields)]): strictMode ? JSON.stringify([value, index]) : JSON.stringify([value, index, data])
(
strictMode: boolean,
syncFields: Array<string> | void,
value: any,
index: number,
data: any
) =>
Array.isArray(syncFields)
? JSON.stringify([value, index, data, pickVars(data, syncFields)])
: strictMode
? JSON.stringify([value, index])
: JSON.stringify([value, index, data])
);
formatValue(value: any, index: number = -1) {
@ -583,7 +630,13 @@ export default class ComboControl extends React.Component<ComboProps> {
value = value || this.defaultValue;
return this.memoizedFormatValue(strictMode !== false, syncFields, value, index, data);
return this.memoizedFormatValue(
strictMode !== false,
syncFields,
value,
index,
data
);
}
pickCondition(value: any): Condition | null {
@ -633,14 +686,15 @@ export default class ComboControl extends React.Component<ComboProps> {
}
@autobind
setNull(e:React.MouseEvent) {
setNull(e: React.MouseEvent) {
e.preventDefault();
const {onChange} = this.props;
onChange(null);
Array.isArray(this.subForms) && this.subForms.forEach(subForm => {
subForm.clearErrors();
});
Array.isArray(this.subForms) &&
this.subForms.forEach(subForm => {
subForm.clearErrors();
});
}
renderPlaceholder() {
@ -694,7 +748,7 @@ export default class ComboControl extends React.Component<ComboProps> {
return (
<CTabs
className={"ComboTabs"}
className={'ComboTabs'}
mode={tabsStyle}
activeKey={store.activeKey}
onSelect={this.handleTabSelect}
@ -724,7 +778,11 @@ export default class ComboControl extends React.Component<ComboProps> {
}
)
) : (
<a onClick={this.addItem} data-position="left" data-tooltip="新增一条数据">
<a
onClick={this.addItem}
data-position="left"
data-tooltip="新增一条数据"
>
{addIcon ? <i className={cx('m-r-xs', addIcon)} /> : null}
<span>{addButtonText || '新增'}</span>
</a>
@ -753,7 +811,11 @@ export default class ComboControl extends React.Component<ComboProps> {
data-tooltip="删除"
data-position="bottom"
>
{deleteIcon ? <i className={deleteIcon} /> : <Icon icon="close" /> }
{deleteIcon ? (
<i className={deleteIcon} />
) : (
<Icon icon="close" />
)}
</a>
);
}
@ -891,145 +953,150 @@ export default class ComboControl extends React.Component<ComboProps> {
multiLine ? `Combo--ver` : `Combo--hor`,
noBorder ? `Combo--noBorder` : '',
disabled ? 'is-disabled' : '',
(!disabled && draggable && Array.isArray(value) && value.length > 1) ? 'is-draggable' : '',
!disabled && draggable && Array.isArray(value) && value.length > 1
? 'is-draggable'
: ''
)}
>
<div className={cx(`Combo-items`)}>
{Array.isArray(value) && value.length
? value.map((value, index, thelist) => {
const toolbar: Array<any> = [];
{Array.isArray(value) && value.length ? (
value.map((value, index, thelist) => {
const toolbar: Array<any> = [];
// if (!disabled && draggable && thelist.length > 1) {
// toolbar.push(
// <a
// key="drag"
// className={cx(`Combo-toolbarBtn Combo-itemDrager`)}
// data-tooltip="拖拽排序"
// data-position="bottom"
// >
// <i className={dragIcon} />
// </a>
// );
// }
// if (!disabled && draggable && thelist.length > 1) {
// toolbar.push(
// <a
// key="drag"
// className={cx(`Combo-toolbarBtn Combo-itemDrager`)}
// data-tooltip="拖拽排序"
// data-position="bottom"
// >
// <i className={dragIcon} />
// </a>
// );
// }
if (
finnalRemovable && // 表达式判断单条是否可删除
(!itemRemovableOn ||
evalExpression(itemRemovableOn, value) !== false)
) {
toolbar.push(
<a
onClick={this.removeItem.bind(this, index)}
key="remove"
className={cx(
`Combo-toolbarBtn ${
!store.removable ? 'is-disabled' : ''
}`
)}
data-tooltip="删除"
data-position="bottom"
>
{deleteIcon ? <i className={deleteIcon} /> : <Icon icon="close" /> }
</a>
);
}
const data = this.formatValue(value, index);
let condition: Condition | null = null;
if (Array.isArray(conditions) && conditions.length) {
condition = this.pickCondition(data);
controls = condition ? condition.controls : undefined;
}
let finnalControls =
flat && controls
? [
{
...(controls && controls[0]),
name: 'flat'
}
]
: controls;
return (
<div
className={cx(`Combo-item`)}
key={this.keys[index] || (this.keys[index] = guid())}
if (
finnalRemovable && // 表达式判断单条是否可删除
(!itemRemovableOn ||
evalExpression(itemRemovableOn, value) !== false)
) {
toolbar.push(
<a
onClick={this.removeItem.bind(this, index)}
key="remove"
className={cx(
`Combo-toolbarBtn ${
!store.removable ? 'is-disabled' : ''
}`
)}
data-tooltip="删除"
data-position="bottom"
>
{!disabled && draggable && thelist.length > 1 ? (
<div className={cx('Combo-itemDrager')}>
<a
key="drag"
data-tooltip="拖拽排序"
data-position="bottom"
>
{dragIcon ? ( <i className={dragIcon} /> ): <Icon icon="combo-dragger"/> }
</a>
</div>
): null}
{condition && typeSwitchable !== false ? (
<div className={cx('Combo-itemTag')}>
<label>类型</label>
<Select
onChange={this.handleComboTypeChange.bind(
this,
index
)}
options={(conditions as Array<Condition>).map(
item => ({
label: item.label,
value: item.label
})
)}
value={condition.label}
clearable={false}
/>
</div>
) : null}
<div className={cx(`Combo-itemInner`)}>
{finnalControls ? (
render(
`multiple/${index}`,
{
type: 'form',
controls: finnalControls,
wrapperComponent: 'div',
wrapWithPanel: false,
mode: multiLine ? subFormMode : 'row',
className: cx(`Combo-form`, formClassName)
},
{
index,
disabled,
data,
onChange: this.handleChange,
onInit: this.handleFormInit,
onAction: this.handleAction,
ref: this.makeFormRef(index),
lazyChange: changeImmediately ? false : true,
lazyFormChange: changeImmediately ? false : true,
lazyLoad,
canAccessSuperData,
value: undefined,
formItemValue: undefined
}
)
) : (
<Alert2 level="warning" className="m-b-none">
数据非法，或者数据已失效，请移除
</Alert2>
)}
</div>
{toolbar.length ? (
<div className={cx(`Combo-itemToolbar`)}>{toolbar}</div>
) : null}
</div>
{deleteIcon ? (
<i className={deleteIcon} />
) : (
<Icon icon="close" />
)}
</a>
);
})
: placeholder ? (
}
const data = this.formatValue(value, index);
let condition: Condition | null = null;
if (Array.isArray(conditions) && conditions.length) {
condition = this.pickCondition(data);
controls = condition ? condition.controls : undefined;
}
let finnalControls =
flat && controls
? [
{
...(controls && controls[0]),
name: 'flat'
}
]
: controls;
return (
<div
className={cx(`Combo-item`)}
key={this.keys[index] || (this.keys[index] = guid())}
>
{!disabled && draggable && thelist.length > 1 ? (
<div className={cx('Combo-itemDrager')}>
<a
key="drag"
data-tooltip="拖拽排序"
data-position="bottom"
>
{dragIcon ? (
<i className={dragIcon} />
) : (
<Icon icon="combo-dragger" />
)}
</a>
</div>
) : null}
{condition && typeSwitchable !== false ? (
<div className={cx('Combo-itemTag')}>
<label>类型</label>
<Select
onChange={this.handleComboTypeChange.bind(this, index)}
options={(conditions as Array<Condition>).map(item => ({
label: item.label,
value: item.label
}))}
value={condition.label}
clearable={false}
/>
</div>
) : null}
<div className={cx(`Combo-itemInner`)}>
{finnalControls ? (
render(
`multiple/${index}`,
{
type: 'form',
controls: finnalControls,
wrapperComponent: 'div',
wrapWithPanel: false,
mode: multiLine ? subFormMode : 'row',
className: cx(`Combo-form`, formClassName)
},
{
index,
disabled,
data,
onChange: this.handleChange,
onInit: this.handleFormInit,
onAction: this.handleAction,
ref: this.makeFormRef(index),
lazyChange: changeImmediately ? false : true,
lazyFormChange: changeImmediately ? false : true,
lazyLoad,
canAccessSuperData,
value: undefined,
formItemValue: undefined
}
)
) : (
<Alert2 level="warning" className="m-b-none">
数据非法，或者数据已失效，请移除
</Alert2>
)}
</div>
{toolbar.length ? (
<div className={cx(`Combo-itemToolbar`)}>{toolbar}</div>
) : null}
</div>
);
})
) : placeholder ? (
<div className={cx(`Combo-placeholder`)}>{placeholder}</div>
) : null}
) : null}
</div>
{!disabled ? (
<div className={cx(`Combo-toolbar`)}>
@ -1092,7 +1159,7 @@ export default class ComboControl extends React.Component<ComboProps> {
noBorder,
disabled,
typeSwitchable,
nullable,
nullable
} = this.props;
let controls = this.props.controls;
@ -1157,13 +1224,24 @@ export default class ComboControl extends React.Component<ComboProps> {
)}
</div>
</div>
{value && nullable ? (<a className={cx('Combo-setNullBtn')} href="#" onClick={this.setNull}>清空数据</a>) : null}
{value && nullable ? (
<a className={cx('Combo-setNullBtn')} href="#" onClick={this.setNull}>
清空数据
</a>
) : null}
</div>
);
}
render() {
const {formInited, multiple, className, classPrefix: ns, classnames: cx, disabled} = this.props;
const {
formInited,
multiple,
className,
classPrefix: ns,
classnames: cx,
disabled
} = this.props;
return formInited ? (
<div className={cx(`ComboControl`, className)}>

5
src/renderers/Form/Container.tsx
View File

@ -3,8 +3,11 @@ import {Renderer} from '../../factory';
import cx from 'classnames';
import Container from '../Container';
import FormItem, {FormControlProps} from './Item';
import {IIRendererStore} from '../../store/iRenderer';
export interface ContainerProps extends FormControlProps {}
export interface ContainerProps extends FormControlProps {
store: IIRendererStore;
}
@FormItem({
type: 'container',

23
src/renderers/Form/Grid.tsx
View File

@ -6,8 +6,11 @@ import {FormItem, FormControlProps} from './Item';
import pick from 'lodash/pick';
import React from 'react';
import cx from 'classnames';
import {IIRendererStore} from '../../store/iRenderer';
export interface GridProps extends FormControlProps {}
export interface GridProps extends FormControlProps {
store: IIRendererStore;
}
const defaultHorizontal = {
left: 'col-sm-4',
right: 'col-sm-8',
@ -36,13 +39,17 @@ export class GridRenderer extends Grid<GridProps> {
if (node && !node.type && (node.controls || node.tabs || node.feildSet)) {
return (
<div className={cx(`Grid-form Form--${node.mode || 'normal'}`)}>
{renderFormItems(node, ($path as string).replace(/^.*form\//, ''), {
mode: node.mode || 'normal',
horizontal: node.horizontal || defaultHorizontal,
store,
data: store.data,
render
})}
{renderFormItems(
node as any,
($path as string).replace(/^.*form\//, ''),
{
mode: node.mode || 'normal',
horizontal: node.horizontal || defaultHorizontal,
store,
data: store.data,
render
}
)}
</div>
);
}

29
src/renderers/Form/HBox.tsx
View File

@ -5,9 +5,10 @@ import HBox from '../HBox';
import {Schema} from '../../types';
import cx from 'classnames';
import {isVisible} from '../../utils/helper';
import {IIRendererStore} from '../../store/iRenderer';
interface HBoxProps extends FormControlProps {
size?: string;
store: IIRendererStore;
}
@FormItem({
@ -53,17 +54,21 @@ export class HBoxRenderer extends React.Component<HBoxProps, any> {
const {render, renderFormItems, formMode, store, $path} = this.props;
if (node && !node.type && (node.controls || node.tabs || node.feildSet)) {
return renderFormItems(node, ($path as string).replace(/^.*form\//, ''), {
mode: node.mode || 'normal',
horizontal: node.horizontal || {
left: 4,
right: 8,
offset: 4
},
store,
data: store.data,
render
});
return renderFormItems(
node as any,
($path as string).replace(/^.*form\//, ''),
{
mode: node.mode || 'normal',
horizontal: node.horizontal || {
left: 4,
right: 8,
offset: 4
},
store,
data: store.data,
render
}
);
}
return render(region, node.body || node);

1
src/renderers/Form/IconPicker.tsx
View File

@ -1,5 +1,6 @@
import React from 'react';
import cx from 'classnames';
// @ts-ignore
import matchSorter from 'match-sorter';
import keycode from 'keycode';
import Downshift, {StateChangeOptions} from 'downshift';

6
src/renderers/Form/InputGroup.tsx
View File

@ -11,10 +11,11 @@ import {
import cx from 'classnames';
import getExprProperties from '../../utils/filter-schema';
import {FormItem, FormControlProps} from './Item';
import {IFormStore} from '../../store/form';
export interface InputGroupProps extends FormControlProps {
controls: Array<any>;
size?: 'xs' | 'sm' | 'normal';
formStore: IFormStore;
}
interface InputGroupState {
@ -115,7 +116,8 @@ export class InputGroup extends React.Component<
});
let horizontalDeeper =
horizontal || makeHorizontalDeeper(formHorizontal, controls.length);
horizontal ||
makeHorizontalDeeper(formHorizontal as any, controls.length);
return (
<div
className={cx(`InputGroup`, className, {

193
src/renderers/Form/Item.tsx
View File

@ -770,117 +770,116 @@ export function asFormItem(config: Omit<FormItemConfig, 'component'>) {
delete config.storeType;
}
// @observer
class FormItemRenderer extends FormItemWrap {
static defaultProps = {
className: '',
renderLabel: config.renderLabel,
renderDescription: config.renderDescription,
sizeMutable: config.sizeMutable,
wrap: config.wrap,
...Control.defaultProps
};
static propsList: any = [
'value',
'defaultValue',
'onChange',
'setPrinstineValue',
'readOnly',
'strictMode',
...((Control as any).propsList || [])
];
return hoistNonReactStatic(
class extends FormItemWrap {
static defaultProps = {
className: '',
renderLabel: config.renderLabel,
renderDescription: config.renderDescription,
sizeMutable: config.sizeMutable,
wrap: config.wrap,
...Control.defaultProps
};
static propsList: any = [
'value',
'defaultValue',
'onChange',
'setPrinstineValue',
'readOnly',
'strictMode',
...((Control as any).propsList || [])
];
static displayName = `FormItem${config.type ? `(${config.type})` : ''}`;
static ComposedComponent = Control;
static displayName = `FormItem${config.type ? `(${config.type})` : ''}`;
static ComposedComponent = Control;
ref: any;
ref: any;
constructor(props: FormItemProps) {
super(props);
this.refFn = this.refFn.bind(this);
}
componentWillMount() {
const {validations, formItem: model} = this.props;
// 组件注册的时候可能默认指定验证器类型
if (model && !validations && config.validations) {
model.config({
rules: config.validations
});
constructor(props: FormItemProps) {
super(props);
this.refFn = this.refFn.bind(this);
}
super.componentWillMount();
}
componentWillMount() {
const {validations, formItem: model} = this.props;
shouldComponentUpdate(nextProps: FormControlProps) {
if (nextProps.strictMode === false || config.strictMode === false) {
return true;
// 组件注册的时候可能默认指定验证器类型
if (model && !validations && config.validations) {
model.config({
rules: config.validations
});
}
super.componentWillMount();
}
// 把可能会影响视图的白名单弄出来，减少重新渲染次数。
if (anyChanged(detectProps, this.props, nextProps)) {
return true;
shouldComponentUpdate(nextProps: FormControlProps) {
if (nextProps.strictMode === false || config.strictMode === false) {
return true;
}
// 把可能会影响视图的白名单弄出来，减少重新渲染次数。
if (anyChanged(detectProps, this.props, nextProps)) {
return true;
}
return false;
}
return false;
}
getWrappedInstance() {
return this.ref;
}
getWrappedInstance() {
return this.ref;
}
refFn(ref: any) {
this.ref = ref;
}
refFn(ref: any) {
this.ref = ref;
}
renderControl() {
const {
inputClassName,
formItem: model,
classnames: cx,
children,
type,
size,
defaultSize,
...rest
} = this.props;
renderControl() {
const {
inputClassName,
formItem: model,
classnames: cx,
children,
type,
size,
defaultSize,
...rest
} = this.props;
const controlSize = size || defaultSize;
const controlSize = size || defaultSize;
return (
<Control
{...rest}
onOpenDialog={this.handleOpenDialog}
size={config.sizeMutable !== false ? undefined : size}
onFocus={this.handleFocus}
onBlur={this.handleBlur}
type={type}
classnames={cx}
ref={isSFC ? undefined : this.refFn}
formItem={model}
className={cx(
`Form-control`,
{
'is-inline': !!rest.inline,
'is-error': model && !model.valid,
[`Form-control--withSize Form-control--size${ucFirst(
controlSize
)}`]:
config.sizeMutable !== false &&
typeof controlSize === 'string' &&
!!controlSize &&
controlSize !== 'full'
},
inputClassName
)}
/>
);
}
}
hoistNonReactStatic(FormItemRenderer, Control);
return FormItemRenderer;
return (
<Control
{...rest}
onOpenDialog={this.handleOpenDialog}
size={config.sizeMutable !== false ? undefined : size}
onFocus={this.handleFocus}
onBlur={this.handleBlur}
type={type}
classnames={cx}
ref={isSFC ? undefined : this.refFn}
formItem={model}
className={cx(
`Form-control`,
{
'is-inline': !!rest.inline,
'is-error': model && !model.valid,
[`Form-control--withSize Form-control--size${ucFirst(
controlSize
)}`]:
config.sizeMutable !== false &&
typeof controlSize === 'string' &&
!!controlSize &&
controlSize !== 'full'
},
inputClassName
)}
/>
);
}
},
Control
);
};
}

6
src/renderers/Form/NestedSelect.tsx
View File

@ -253,7 +253,7 @@ export default class NestedSelectControl extends React.Component<
)
? xorBy
: unionBy;
newValue = fn(items, option, valueField || 'value');
newValue = fn(items, option as any, valueField || 'value');
} else {
newValue = items.filter(
item =>
@ -406,10 +406,10 @@ export default class NestedSelectControl extends React.Component<
>
<Icon icon="search" className="icon" />
<Input
value={this.state.inputValue}
value={this.state.inputValue || ''}
onFocus={this.onFocus}
onBlur={this.onBlur}
disabled={disabled}
disabled={disabled!!}
placeholder={searchPromptText}
onChange={this.handleInputChange}
ref={this.inputRef}

1
src/renderers/Form/Number.tsx
View File

@ -1,6 +1,7 @@
import React from 'react';
import {FormItem, FormControlProps} from './Item';
import cx from 'classnames';
// @ts-ignore
import InputNumber from 'rc-input-number';
import {filter} from '../../utils/tpl';

1
src/renderers/Form/Rating.tsx
View File

@ -37,7 +37,6 @@ export default class RatingControl extends React.Component<RatingProps, any> {
count={count}
half={half}
readOnly={readOnly}
size={size}
onChange={(value: any) => onChange(value)}
/>
</div>

2
src/renderers/Json.tsx
View File

@ -84,7 +84,7 @@ const eighties = {
}
};
const themes = {
const themes: any = {
twilight,
eighties
};

2
src/renderers/Operation.tsx
View File

@ -31,7 +31,7 @@ export class OperationField extends React.Component<OperationProps, object> {
level:
button.level ||
(button.icon && !button.label ? 'link' : ''),
...button
...(button as any)
},
{
key: index

1
src/renderers/QRCode.tsx
View File

@ -3,6 +3,7 @@ import cx from 'classnames';
import {Renderer, RendererProps} from '../factory';
import {FormItem, FormControlProps} from './Form/Item';
import {filter} from '../utils/tpl';
// @ts-ignore
import QrCode from 'qrcode.react';
export interface QRCodeProps extends FormControlProps {

2
src/renderers/Service.tsx
View File

@ -28,7 +28,7 @@ export interface ServiceProps extends RendererProps {
};
}
export default class Service extends React.Component<ServiceProps> {
timer: number;
timer: NodeJS.Timeout;
mounted: boolean;
static defaultProps: Partial<ServiceProps> = {

27
src/renderers/Video.tsx
View File

@ -5,12 +5,14 @@
/* eslint fecs-indent: [0, "space", 2, 2] */
import React from 'react';
import {
Player,
Shortcut,
BigPlayButton,
ControlBar,
PlaybackRateMenuButton
// @ts-ignore
} from 'video-react';
import {padArr} from '../utils/helper';
import cx from 'classnames';
@ -315,10 +317,9 @@ export default class Video extends React.Component<VideoProps, VideoState> {
const rect = item.getBoundingClientRect();
this.cursorDom.setAttribute(
'style',
`width: ${rect.width - 4}px; height: ${rect.height -
4}px; left: ${rect.left + 2 - frameRect.left}px; top: ${rect.top +
2 -
frameRect.top}px;`
`width: ${rect.width - 4}px; height: ${rect.height - 4}px; left: ${
rect.left + 2 - frameRect.left
}px; top: ${rect.top + 2 - frameRect.top}px;`
);
}
}
@ -405,14 +406,16 @@ export default class Video extends React.Component<VideoProps, VideoState> {
</div>
))}
{/* 补充空白 */ restCount
? blankArray.map((_, index) => (
<div
className={`${ns}Hbox-col Wrapper--xxs`}
key={`blank_${index}`}
/>
))
: null}
{
/* 补充空白 */ restCount
? blankArray.map((_, index) => (
<div
className={`${ns}Hbox-col Wrapper--xxs`}
key={`blank_${index}`}
/>
))
: null
}
</div>
</div>
);

3
src/store/crud.ts
View File

@ -333,6 +333,7 @@ export const CRUDStore = ServiceStore.named('CRUDStore')
console.error(e.stack);
root.notify('error', e.message);
return;
}
});
@ -432,7 +433,7 @@ export const CRUDStore = ServiceStore.named('CRUDStore')
self.hasInnerModalOpen = value;
};
const initFromScope = function(scope: any, source: string) {
const initFromScope = function (scope: any, source: string) {
let rowsData: Array<any> = resolveVariableAndFilter(
source,
scope,

2
src/store/service.ts
View File

@ -144,6 +144,7 @@ export const ServiceStore = iRendererStore
markFetching(false);
e.stack && console.error(e.stack);
root.notify('error', e.message || e);
return;
}
});
@ -234,6 +235,7 @@ export const ServiceStore = iRendererStore
markFetching(false);
e.stack && console.error(e.stack);
root.notify('error', e.message || e);
return;
}
});

63
src/theme.tsx
View File

@ -126,38 +126,41 @@ export function themeable<
classnames?: ClassNamesFn;
};
class EnhancedComponent extends React.Component<Props> {
static displayName = `Themeable(${
ComposedComponent.displayName || ComposedComponent.name
})`;
static contextType = ThemeContext;
static ComposedComponent = ComposedComponent;
const result = hoistNonReactStatic(
class extends React.Component<Props> {
static displayName = `Themeable(${
ComposedComponent.displayName || ComposedComponent.name
})`;
static contextType = ThemeContext;
static ComposedComponent = ComposedComponent;
render() {
const theme: string = this.props.theme || this.context || defaultTheme;
const config = hasTheme(theme) ? getTheme(theme) : getTheme(defaultTheme);
const injectedProps: {
classPrefix: string;
classnames: ClassNamesFn;
} = {
classPrefix: config.classPrefix as string,
classnames: config.classnames
};
render() {
const theme: string = this.props.theme || this.context || defaultTheme;
const config = hasTheme(theme)
? getTheme(theme)
: getTheme(defaultTheme);
const injectedProps: {
classPrefix: string;
classnames: ClassNamesFn;
} = {
classPrefix: config.classPrefix as string,
classnames: config.classnames
};
return (
<ThemeContext.Provider value={theme}>
<ComposedComponent
{
...(this.props as any) /* todo, 解决这个类型问题 */
}
{...injectedProps}
/>
</ThemeContext.Provider>
);
}
}
const result = hoistNonReactStatic(EnhancedComponent, ComposedComponent);
return (
<ThemeContext.Provider value={theme}>
<ComposedComponent
{
...(this.props as any) /* todo, 解决这个类型问题 */
}
{...injectedProps}
/>
</ThemeContext.Provider>
);
}
},
ComposedComponent
);
return result as typeof result & {
ComposedComponent: T;

8
src/utils/dom.tsx
View File

@ -70,7 +70,7 @@ function getContainerDimensions(containerNode: any) {
getScrollTop(ownerDocument(containerNode).documentElement) ||
getScrollTop(containerNode);
} else {
({width, height} = getOffset(containerNode));
({width, height} = getOffset(containerNode) as any);
scroll = getScrollTop(containerNode);
}
@ -144,11 +144,13 @@ export function calculatePosition(
container: any,
padding: any = 0
) {
const childOffset =
const childOffset: any =
container.tagName === 'BODY'
? getOffset(target)
: getPosition(target, container);
const {height: overlayHeight, width: overlayWidth} = getOffset(overlayNode);
const {height: overlayHeight, width: overlayWidth} = getOffset(
overlayNode
) as any;
const clip = container.getBoundingClientRect();
const clip2 = overlayNode.getBoundingClientRect();

4
src/utils/json-schema-2-amis-schema.ts
View File

@ -1,7 +1,7 @@
function property2control(property: any, key: any, schema: any) {
const requiredList = schema.required || [];
const rest = {};
const validations = {};
const rest: any = {};
const validations: any = {};
let type = 'text';
if (property.type === 'integer') {

19
tsconfig.json
View File

@ -3,10 +3,7 @@
"outDir": "output/",
"module": "commonjs",
"target": "es5",
"lib": [
"es6",
"dom"
],
"lib": ["es6", "dom"],
"sourceMap": true,
"jsx": "react",
"moduleResolution": "node",
@ -21,14 +18,10 @@
"strictNullChecks": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"typeRoots": [
"./node_modules/@types",
"./types"
]
"typeRoots": ["./node_modules/@types", "./types"],
"skipLibCheck": true
},
"include": [
"src/**/*"
],
"include": ["src/**/*"],
"exclude": [
"node_modules",
"build",
@ -37,7 +30,5 @@
"webpack",
"jest"
],
"types": [
"typePatches"
]
"types": ["typePatches"]
}