Хелпер для создания формы перенесен в ~/create-form

fields/create-form.ts → create-form/index.ts

 import * as React from 'react';
-import { FieldProps } from './';
-// import * as F from './';
-// import { StandardProps } from '@material-ui/core';
 import memoize from '~/functions/memoize';
 import { ObjectKey, ObjectPath } from '~/functions/get-at';
 import { isEqual } from 'lodash';
+import { AuthCtx as Ctx } from '~/context';
+import { I18nString } from '~/gettext';
+
+
+// Контекст поля
+export interface FieldProps<T = any> {
+  ctx?: Ctx;
+  value: T;
+  disabled?: Disabled;
+  // Здесь должен передавться результат `validate` те `Validation<A>`
+  error?: Error;
+  onValueChange?(value: T): void;
+  onValueChange?(value: any, at?: ObjectPath): void;
+}
+
+
+// Флаги активности
+export type Disabled = boolean|object;
+
+
+// Ошибки в поле
+export type Error = boolean|string|object|I18nString;
+
+
+// Валидация формы
+export type Validation<A> = Partial<Record<keyof A, Error>>;
 
 
 // Props
@@ -17,11 +40,7 @@ export type CardProps<T> = {
 }
 
 
-// 
-export type Any<T=any> = React.ReactType<FieldProps<T>>;
-export type GetProps<T extends Any> = T extends React.ReactType<infer Props> ? Props : never;
-
-
+// Опции для `createForm`
 export type CreateFormOptions<T> = {
   validate?(value: T): any;
   disabled?(value: T): any;
@@ -91,3 +110,8 @@ const zoomAny = memoize((path: ObjectKey[], input: any) => {
   }
   return iter;
 });
+
+
+// Хелперы
+export type Any<T=any> = React.ReactType<FieldProps<T>>;
+export type GetProps<T extends Any> = T extends React.ReactType<infer Props> ? Props : never;

fields/AutoComplete.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import Suggestions, { Props as SuggestionProps } from '~/fields/Suggestions';
 import { AuthCtx as Ctx } from '~/context';
-import { FieldProps } from '~/fields';
+import { FieldProps } from '~/create-form';
 import TextField from '~/fields/TextField';
 import { Props as TextFieldProps } from '~/fields/TextField';
 import { StandardProps } from '@material-ui/core';
@@ -87,15 +87,15 @@ export default class AutoComplete<A=string> extends React.Component<Props<A>, St
     this.handleValueChange(e.target.value);
   };
 
-  handleFocus = (e?: React.SyntheticEvent) => {
+  handleFocus = (e?: React.FocusEvent<any>) => {
     this.dispatch({ tag: 'Focus' })
-    this.props.onFocus && this.props.onFocus(e);
+    this.props.onFocus && e && this.props.onFocus(e);
   };
 
-  handleBlur = (e?: React.SyntheticEvent) => {
+  handleBlur = (e?: React.FocusEvent<any>) => {
     this.dispatch({ tag: 'Blur' });
     this.setState({ value: null });
-    this.props.onBlur && this.props.onBlur(e);
+    this.props.onBlur && e && this.props.onBlur(e);
   };
 
   handleClick = (e?: React.SyntheticEvent) => {

fields/BooleanField.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import Switch, { SwitchProps } from '@material-ui/core/Switch';
 import { Theme } from '@material-ui/core/styles/createMuiTheme';
 import withStyles, { WithStyles, StyleRules } from '@material-ui/core/styles/withStyles';
-import { FieldProps } from './';
+import { FieldProps } from '~/create-form';
 import * as classNames from 'classnames';
 import { StandardProps } from '@material-ui/core';
 

fields/MomentField.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { Theme } from '@material-ui/core/styles/createMuiTheme';
 import withStyles, { WithStyles, StyleRules } from '@material-ui/core/styles/withStyles';
-import { FieldProps } from './';
+import { FieldProps } from '~/create-form';
 import * as moment from 'moment';
 import TextField, { Props as TextFieldProps } from './TextField';
 import { StandardProps, Popover } from '@material-ui/core';

fields/MultiSelect.tsx

@@ -8,7 +8,7 @@ import { Theme } from '@material-ui/core/styles/createMuiTheme';
 import AutoComplete from './AutoComplete';
 import { Props as TextFieldProps } from '~/fields/TextField';
 import { Source } from '~/fields/AutoComplete/state-machine';
-import { FieldProps } from '~/fields';
+import { FieldProps } from '~/create-form';
 
 
 // Props

fields/SelectField.tsx

@@ -3,7 +3,7 @@ import { isEqual } from 'lodash';
 import { Theme } from '@material-ui/core/styles/createMuiTheme';
 import withStyles, { WithStyles, StyleRules } from '@material-ui/core/styles/withStyles';
 import * as classNames from 'classnames';
-import { FieldProps } from './';
+import { FieldProps } from '~/create-form';
 import { MenuItem, StandardProps } from '@material-ui/core';
 import Select, { SelectProps } from '@material-ui/core/Select';
 import { AuthCtx as Ctx } from '~/context';

fields/TextField.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Theme } from '@material-ui/core/styles/createMuiTheme';
 import withStyles, { StyleRules, WithStyles } from '@material-ui/core/styles/withStyles';
 import * as classNames from 'classnames';
-import { FieldProps } from './';
+import { FieldProps } from '~/create-form';
 import { StandardProps } from '@material-ui/core';
 import { withGettext, Gettext, LocaleCtx } from '~/gettext';
 const eye = require('./eye.svg');

fields/context.tsx

-import { AuthCtx as Ctx } from '~/context';
-import { I18nString } from '~/gettext';
-import { ObjectPath } from '~/functions/get-at';
-
-
-// Контекст поля
-export interface FieldProps<T = any> {
-  ctx?: Ctx;
-  value: T;
-  disabled?: Disabled;
-  // Здесь должен передавться результат `validate` те `Validation<A>`
-  error?: Error;
-  onValueChange?(value: T): void;
-  onValueChange?(value: any, at?: ObjectPath): void;
-}
-
-
-// Флаги активности
-export type Disabled = boolean|object;
-
-
-// Ошибки в поле
-export type Error = boolean|string|object|I18nString;
-
-
-// Валидация формы
-export type Validation<A> = Partial<Record<keyof A, Error>>;

fields/index.ts

-export * from './context';
+export * from '~/create-form';
 
 export { default as Label } from './Label';
 export { default as Debounce } from './Debounce';

functions/get-at.ts

@@ -19,8 +19,9 @@ export default function getAt<R=any>(at_: ObjectPath): <A>(a: A) => R {
     let iter = a as any as R;
     for (const k of at) {
       if (!iter.hasOwnProperty(k)) return undefined as any as R; // Поле отсутствует
-      iter = iter[k];
+      iter = iter[k] as any;
     }
     return iter;
   }
 }
+