# @wowpic/xform-types

包含了 xform 中使用到的 typescript 类型定义

## @wowpic/xform-core

### 表单项

#### 组件类型

```typescript
type IFieldType = string;
```

#### 组件属性

```typescript
interface IFieldProps {
    [prop: string]: any;
}
```

#### 表单项状态

```typescript
type IFieldStatus = 'edit' | 'preview' | 'disabled' | 'hidden';
```

| 属性名   | 描述   |
| -------- | ------ |
| edit     | 编辑态 |
| preview  | 预览态 |
| disabled | 禁用态 |
| hidden   | 隐藏态 |

#### 表单项 UI

```typescript
interface IFieldUI {
    [prop: string]: any;
}
```

#### 校验触发时机

```typescript
type IRuleTrigger = 'change' | 'blur' | 'submit';
```

| 属性名 | 描述           |
| ------ | -------------- |
| change | 值改变时校验   |
| blur   | 失去焦点时校验 |
| submit | 提交时校验     |

#### 错误提示类型

```typescript
type IRuleStatus = 'normal' | 'error' | 'warning';
```

| 属性名  | 描述         |
| ------- | ------------ |
| normal  | 无需提示     |
| error   | 红色错误提示 |
| warning | 黄色警告提示 |

#### 校验项对象

```typescript
type IRule = {
    trigger?: IRuleTrigger; // 触发时机
    status?: IRuleStatus; // 校验状态
    [prop: string]: any;
};
```

#### 事件类型

```typescript
type IEvent =
    | 'FORM_CHANGE'
    | 'FIELD_CHANGE'
    | 'VALUE_CHANGE'
    | 'VALID_CHANGE'
    | 'OPTIONS_CHANGE'
    | 'CHILDREN_CHANGE'
    | 'VALIDATE'
    | 'SUBMIT'
    | 'RESET'
    | 'BLUR';
```

| 属性名          | 描述           |
| --------------- | -------------- |
| FORM_CHANGE     | 表单改变时     |
| FIELD_CHANGE    | 表单项改变时   |
| VALUE_CHANGE    | 值改变时       |
| VALID_CHANGE    | 校验结果改变时 |
| OPTIONS_CHANGE  | 选项列表改变时 |
| CHILDREN_CHANGE | 子元素改变时   |
| VALIDATE        | 校验时         |
| SUBMIT          | 提交时         |
| RESET           | 重置时         |
| BLUR            | 失去焦点时     |

#### 表单项

```typescript
interface IField {
    context: IForm;
    key: string;
    type: any;
    status: IFieldStatus;
    ui: IFieldUI;
    props: IFieldProps;
    initialType: any;
    initialStatus: IFieldStatus;
    initialUI: IFieldUI;
    initialProps: IFieldProps;
    rules: IRule[];
    listeners: IListener[];
    dirty: boolean;
    pristine: boolean;
    value: any;
    initialValue: any;
    valid: boolean;
    message: string;
    validStatus: IRuleStatus;
    optionManager: IOptionManager;
    options: IOptionManagerOptionsArray;
    initialize: (params: IFieldParams) => void;
    validate: (trigger?: IRuleTrigger) => Promise<IValidateResult>;
    setValid: (result: IValidateResult) => void;
    setValue: (value: any) => Promise<void>;
    setProps: (props: IFieldProps) => void;
    setUI: (ui: IFieldUI) => void;
    setStatus: (status: IFieldStatus) => void;
    setOptions: (options: IOptionManagerOptionsArray) => void;
    setType: (type: any) => void;
    set: (state: IListenerSet) => void;
    unset: (state: IListenerSet) => void;
    getValue: () => any;
    blur: () => Promise<void>;
    reset: () => Promise<void>;
    purify: () => IFieldPurified;
    on: (event: IEvent, listener: (...args: any[]) => void) => void;
    emit: (event: IEvent, ...args: any[]) => void;
    removeListener: (event: IEvent, listener: (...args: any[]) => void) => void;
    triggerEvent: (event: IEvent) => void;
}
```

### 选项

#### 选项管理

```typescript
interface IOptionManager {
    nameProperty: string;
    valueProperty: string;
    action: IOptionManagerOptionsAction;
    path: string;
    watch: string[];
    initialOptions: IOptionManagerOptionsArray;
    initialize: (params: IOptionManagerParams) => Promise<void>;
    getOptions: () => Promise<IOptionManagerOptionsArray>;
    reset: () => void;
}
```

### 联动

#### 联动管理

```typescript
interface IListenerManager {
    recordsMap: IListenerManagerRecordsMap;
    addField: (field: IFieldEnum) => void;
    addOptionManager: (optionManager: IOptionManager) => void;
    add: (watch: string[], record: IListenerManagerRecord) => void;
    trigger: (field: IFieldEnum, type?: IListenerManagerType) => void;
}
```

### 校验

#### 校验结果

```typescript
interface IValidateResult {
    valid: boolean;
    message: string;
    status: IRuleStatus;
}
```

#### 校验项

```typescript
interface IValidator {
    initialize: (params: IValidatorParams) => void;
    validate: (trigger: IRuleTrigger) => Promise<IValidateResult>;
}
```

### 表单

#### 表单

```typescript
interface IForm {
    schema: ISchema;
    key: string;
    fields: IFieldEnum[];
    fieldMap: IFieldMap;
    ignoreValues: IIgnoreValueType[];
    initialValues?: { [key: string]: any };
    initialStatus?: IFieldStatus;
    listenerManager: IListenerManager;
    initialize: (params: IFormParams) => void;
    registerField: (params: IFieldEnumParams) => IFieldEnum;
    finishRegisterField: () => void;
    registerComponent: (name: string, component: any) => any;
    getComponent: (name: string) => any;
    submit: () => Promise<{ valid: boolean, value: any }>;
    reset: () => Promise<void>;
    validate: () => Promise<boolean>;
    getValue: (key?: string) => any;
    setValue: (values: { [key: string]: any }) => Promise<void>;
    setStatus: (status: IFieldStatus) => void;
    purify: () => IFormPurified;
    on: (event: IEvent, listener: (...args: any[]) => void) => void;
    emit: (event: IEvent, ...args: any[]) => void;
    removeListener: (event: IEvent, listener: (...args: any[]) => void) => void;
}
```

## @wowpic/xform-react

### 展示

#### 组件参数

```typescript
interface IReactComponentProps {
    field: IField;
    options: IOptionManagerOptionsArray;
    value: any;
    onChange: (value: any) => void;
    [prop: string]: any;
}
```