@faasjs/ant-design 0.0.3-beta.7 → 0.0.3-beta.70

package/README.md

@@ -8,7 +8,7 @@ UI components based on [FaasJS](https://faasjs.com), [Ant Design](https://ant.de
 
 ## Install
 
-    npm install @faasjs/ant-design
+    npm install @faasjs/ant-design antd react react-dom @faasjs/react react-router-dom
 
 ## Usage
 
@@ -41,218 +41,139 @@ Form are based on [Ant Design's Form.Item component](https://ant.design/componen
 
 ### Namespaces
 
+- [App](modules/App.md)
 - [Form](modules/Form.md)
+- [FormItem](modules/FormItem.md)
+
+### Classes
+
+- [ErrorBoundary](classes/ErrorBoundary.md)
+
+### Interfaces
+
+- [AppProps](interfaces/AppProps.md)
+- [BaseItemProps](interfaces/BaseItemProps.md)
+- [BlankProps](interfaces/BlankProps.md)
+- [ConfigProviderProps](interfaces/ConfigProviderProps.md)
+- [DescriptionItemContentProps](interfaces/DescriptionItemContentProps.md)
+- [DescriptionItemProps](interfaces/DescriptionItemProps.md)
+- [DescriptionProps](interfaces/DescriptionProps.md)
+- [DrawerProps](interfaces/DrawerProps.md)
+- [ErrorBoundaryProps](interfaces/ErrorBoundaryProps.md)
+- [ExtendDescriptionTypeProps](interfaces/ExtendDescriptionTypeProps.md)
+- [FaasDataWrapperProps](interfaces/FaasDataWrapperProps.md)
+- [FaasItemProps](interfaces/FaasItemProps.md)
+- [FormItemProps](interfaces/FormItemProps.md)
+- [FormProps](interfaces/FormProps.md)
+- [LinkProps](interfaces/LinkProps.md)
+- [ModalProps](interfaces/ModalProps.md)
+- [RoutesProps](interfaces/RoutesProps.md)
+- [TableItemProps](interfaces/TableItemProps.md)
+- [TitleProps](interfaces/TitleProps.md)
+- [UnionFaasItemProps](interfaces/UnionFaasItemProps.md)
+- [useAppProps](interfaces/useAppProps.md)
 
 ### Type Aliases
 
-- [BaseItemProps](#baseitemprops)
 - [BaseOption](#baseoption)
-- [BlankProps](#blankprops)
-- [CalendarProps](#calendarprops)
-- [ConfigProviderProps](#configproviderprops)
-- [DatePickerProps](#datepickerprops)
-- [DescriptionItemProps](#descriptionitemprops)
-- [DescriptionProps](#descriptionprops)
-- [DrawerProps](#drawerprops)
 - [ExtendDescriptionItemProps](#extenddescriptionitemprops)
-- [ExtendDescriptionTypeProps](#extenddescriptiontypeprops)
 - [ExtendFormItemProps](#extendformitemprops)
 - [ExtendFormTypeProps](#extendformtypeprops)
 - [ExtendTableItemProps](#extendtableitemprops)
 - [ExtendTableTypeProps](#extendtabletypeprops)
 - [ExtendTypes](#extendtypes)
-- [FaasItemProps](#faasitemprops)
+- [FaasDataInjection](#faasdatainjection)
 - [FaasItemType](#faasitemtype)
 - [FaasItemTypeValue](#faasitemtypevalue)
-- [FormItemProps](#formitemprops)
-- [FormProps](#formprops)
-- [LinkProps](#linkprops)
-- [ModalProps](#modalprops)
-- [RoutesProps](#routesprops)
-- [TableItemProps](#tableitemprops)
+- [FormSubmitProps](#formsubmitprops)
+- [LoadingProps](#loadingprops)
 - [TableProps](#tableprops)
-- [TimePickerProps](#timepickerprops)
-- [TitleProps](#titleprops)
+- [UnionFaasItemElement](#unionfaasitemelement)
+- [UnionFaasItemInjection](#unionfaasiteminjection)
+- [UnionFaasItemRender](#unionfaasitemrender)
+- [UnionScene](#unionscene)
 - [setDrawerProps](#setdrawerprops)
 - [setModalProps](#setmodalprops)
 
 ### Variables
 
 - [ConfigContext](#configcontext)
-- [DatePicker](#datepicker)
 
 ### Functions
 
+- [App](#app)
 - [Blank](#blank)
-- [Calendar](#calendar)
 - [ConfigProvider](#configprovider)
 - [Description](#description)
+- [FaasDataWrapper](#faasdatawrapper)
 - [Form](#form)
 - [FormItem](#formitem)
 - [Link](#link)
+- [Loading](#loading)
 - [PageNotFound](#pagenotfound)
 - [Routes](#routes)
 - [Table](#table)
-- [TimePicker](#timepicker)
 - [Title](#title)
 - [transferOptions](#transferoptions)
 - [transferValue](#transfervalue)
+- [useApp](#useapp)
 - [useConfigContext](#useconfigcontext)
 - [useDrawer](#usedrawer)
 - [useModal](#usemodal)
 
 ## Type Aliases
 
-### BaseItemProps
-
-Ƭ **BaseItemProps**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `id` | `string` |
-| `options?` | [`BaseOption`](#baseoption)[] |
-| `title?` | `string` |
-
-___
-
 ### BaseOption
 
 Ƭ **BaseOption**: `string` \| `number` \| { `label`: `string` ; `value?`: `string` \| `number`  }
 
 ___
 
-### BlankProps
-
-Ƭ **BlankProps**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `text?` | `string` |
-| `value?` | `any` |
-
-___
-
-### CalendarProps
-
-Ƭ **CalendarProps**: `AntdProps`<`Dayjs`\>
-
-___
-
-### ConfigProviderProps
-
-Ƭ **ConfigProviderProps**: `Object`
-
-#### Type declaration
-
-| Name | Type |
-| :------ | :------ |
-| `Blank?` | { `text?`: `string`  } |
-| `Blank.text?` | `string` |
-| `Form?` | { `submit?`: { `text?`: `string`  }  } |
-| `Form.submit?` | { `text?`: `string`  } |
-| `Form.submit.text?` | `string` |
-| `Link?` | { `style?`: `CSSProperties` ; `target?`: `string`  } |
-| `Link.style?` | `CSSProperties` |
-| `Link.target?` | `string` |
-| `Title?` | { `separator?`: `string` ; `suffix?`: `string`  } |
-| `Title.separator?` | `string` |
-| `Title.suffix?` | `string` |
-| `antd?` | `AntdConfigProviderProps` |
-| `common?` | { `add?`: `string` ; `all?`: `string` ; `blank?`: `string` ; `delete?`: `string` ; `pageNotFound?`: `string` ; `required?`: `string` ; `reset?`: `string` ; `search?`: `string` ; `submit?`: `string`  } |
-| `common.add?` | `string` |
-| `common.all?` | `string` |
-| `common.blank?` | `string` |
-| `common.delete?` | `string` |
-| `common.pageNotFound?` | `string` |
-| `common.required?` | `string` |
-| `common.reset?` | `string` |
-| `common.search?` | `string` |
-| `common.submit?` | `string` |
-| `lang?` | `string` |
-
-___
-
-### DatePickerProps
+### ExtendDescriptionItemProps
 
-Ƭ **DatePickerProps**: `PickerDateProps`<`Dayjs`\>
+Ƭ **ExtendDescriptionItemProps**: [`BaseItemProps`](interfaces/BaseItemProps.md)
 
 ___
 
-### DescriptionItemProps
-
-Ƭ **DescriptionItemProps**<`T`\>: { `children?`: `JSX.Element` ; `if?`: (`values`: `Record`<`string`, `any`\>) => `boolean` ; `render?`: (`value`: `T`, `values`: `any`) => `ReactNode` \| `JSX.Element`  } & [`FaasItemProps`](#faasitemprops) & { `object?`: [`DescriptionItemProps`](#descriptionitemprops)[]  }
-
-#### Type parameters
+### ExtendFormItemProps
 
-| Name | Type |
-| :------ | :------ |
-| `T` | `any` |
+Ƭ **ExtendFormItemProps**: [`BaseItemProps`](interfaces/BaseItemProps.md) & `AntdFormItemProps`
 
 ___
 
-### DescriptionProps
+### ExtendFormTypeProps
 
-Ƭ **DescriptionProps**<`T`, `ExtendItemProps`\>: { `dataSource?`: `T` ; `extendTypes?`: { `[key: string]`: [`ExtendDescriptionTypeProps`](#extenddescriptiontypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`DescriptionItemProps`](#descriptionitemprops) \| `ExtendItemProps`)[] ; `renderTitle?`: (`values`: `T`) => `ReactNode` \| `JSX.Element`  } & `DescriptionsProps`
+Ƭ **ExtendFormTypeProps**<`T`\>: `Object`
 
 #### Type parameters
 
 | Name | Type |
 | :------ | :------ |
 | `T` | `any` |
-| `ExtendItemProps` | `any` |
-
-___
-
-### DrawerProps
-
-Ƭ **DrawerProps**: `AntdDrawerProps` & { `children?`: `JSX.Element` \| `JSX.Element`[]  }
-
-___
-
-### ExtendDescriptionItemProps
-
-Ƭ **ExtendDescriptionItemProps**: [`BaseItemProps`](#baseitemprops)
-
-___
-
-### ExtendDescriptionTypeProps
-
-Ƭ **ExtendDescriptionTypeProps**: `Object`
 
 #### Type declaration
 
 | Name | Type |
 | :------ | :------ |
-| `children?` | `JSX.Element` \| ``null`` |
-| `render?` | (`value`: `any`, `values`: `any`) => `ReactNode` \| `JSX.Element` |
+| `children?` | [`UnionFaasItemElement`](#unionfaasitemelement)<`T`\> |
 
 ___
 
-### ExtendFormItemProps
-
-Ƭ **ExtendFormItemProps**: [`BaseItemProps`](#baseitemprops) & `AntdFormItemProps`
-
-___
-
-### ExtendFormTypeProps
+### ExtendTableItemProps
 
-Ƭ **ExtendFormTypeProps**: `Object`
+Ƭ **ExtendTableItemProps**<`T`\>: [`BaseItemProps`](interfaces/BaseItemProps.md) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
 
-#### Type declaration
+#### Type parameters
 
 | Name | Type |
 | :------ | :------ |
-| `children?` | `ReactNode` |
+| `T` | `any` |
 
 ___
 
-### ExtendTableItemProps
+### ExtendTableTypeProps
 
-Ƭ **ExtendTableItemProps**<`T`\>: [`BaseItemProps`](#baseitemprops) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
+Ƭ **ExtendTableTypeProps**<`T`\>: `Object`
 
 #### Type parameters
 
@@ -260,18 +181,12 @@ ___
 | :------ | :------ |
 | `T` | `any` |
 
-___
-
-### ExtendTableTypeProps
-
-Ƭ **ExtendTableTypeProps**: `Object`
-
 #### Type declaration
 
 | Name | Type |
 | :------ | :------ |
-| `children?` | `JSX.Element` \| ``null`` |
-| `render?` | (`value`: `any`, `values`: `any`, `index`: `number`) => `JSX.Element` \| `string` \| `number` \| `boolean` \| ``null`` |
+| `children?` | `JSX.Element` |
+| `render?` | [`UnionFaasItemRender`](#unionfaasitemrender)<`T`\> |
 
 ___
 
@@ -285,9 +200,15 @@ ___
 
 ___
 
-### FaasItemProps
+### FaasDataInjection
 
-Ƭ **FaasItemProps**: [`BaseItemProps`](#baseitemprops) & { `type?`: [`FaasItemType`](#faasitemtype)  }
+Ƭ **FaasDataInjection**<`T`\>: `Partial`<`OriginFaasDataInjection`<`T`\>\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
 
 ___
 
@@ -319,120 +240,126 @@ FaasItemType's value type
 
 ___
 
-### FormItemProps
+### FormSubmitProps
 
-Ƭ **FormItemProps**<`T`\>: { `children?`: `ReactNode` ; `extendTypes?`: [`ExtendTypes`](#extendtypes) ; `if?`: (`values`: `Record`<`string`, `any`\>) => `boolean` ; `label?`: `string` \| ``false`` ; `onValueChange?`: (`value`: `T`, `values`: `any`, `form`: `FormInstance`) => `void` ; `render?`: (`value?`: `T`) => `ReactNode` \| `JSX.Element` ; `rules?`: `RuleObject`[]  } & `FormItemInputProps` & [`FaasItemProps`](#faasitemprops) & `Omit`<`AntdFormItemProps`<`T`\>, ``"children"``\>
+Ƭ **FormSubmitProps**: `Object`
 
-#### Type parameters
+#### Type declaration
+
+| Name | Type | Description |
+| :------ | :------ | :------ |
+| `text?` | `string` | Default: Submit |
+| `to?` | { `action`: `string` ; `catch?`: (`error`: `any`) => `void` ; `finally?`: () => `void` ; `params?`: `Record`<`string`, `any`\> ; `then?`: (`result`: `any`) => `void`  } | Submit to FaasJS server. If use onFinish, you should call submit manually. ```ts { submit: { to: { action: 'action_name' } }, onFinish: (values, submit) => { // do something before submit // submit await submit({ ...values, extraProps: 'some extra props' }) // do something after submit } } ``` |
+| `to.action` | `string` | - |
+| `to.catch?` | (`error`: `any`) => `void` | - |
+| `to.finally?` | () => `void` | - |
+| `to.params?` | `Record`<`string`, `any`\> | params will overwrite form values before submit |
+| `to.then?` | (`result`: `any`) => `void` | - |
+
+___
+
+### LoadingProps
+
+Ƭ **LoadingProps**: `Object`
+
+#### Type declaration
 
 | Name | Type |
 | :------ | :------ |
-| `T` | `any` |
+| `children?` | `React.ReactNode` |
+| `loading?` | `boolean` |
+| `size?` | ``"small"`` \| ``"default"`` \| ``"large"`` |
+| `style?` | `React.CSSProperties` |
 
 ___
 
-### FormProps
+### TableProps
 
-Ƭ **FormProps**<`Values`, `ExtendItemProps`\>: { `beforeItems?`: `JSX.Element` \| `JSX.Element`[] ; `children?`: `ReactNode` ; `extendTypes?`: [`ExtendTypes`](#extendtypes) ; `footer?`: `JSX.Element` \| `JSX.Element`[] ; `initialValues?`: `Values` ; `items?`: ([`FormItemProps`](#formitemprops) \| `ExtendItemProps`)[] ; `onFinish?`: (`values`: `Values`, `submit?`: (`values`: `any`) => `Promise`<`any`\>) => `Promise`<`any`\> ; `submit?`: ``false`` \| { `text?`: `string` ; `to?`: { `action`: `string` ; `params?`: `Record`<`string`, `any`\>  }  }  } & `Omit`<`AntdFormProps`<`Values`\>, ``"onFinish"`` \| ``"children"`` \| ``"initialValues"``\>
+Ƭ **TableProps**<`T`, `ExtendTypes`\>: { `extendTypes?`: { `[key: string]`: [`ExtendTableTypeProps`](#extendtabletypeprops);  } ; `faasData?`: [`FaasDataWrapperProps`](interfaces/FaasDataWrapperProps.md)<`T`\> ; `items`: ([`TableItemProps`](interfaces/TableItemProps.md) \| `ExtendTypes` & [`ExtendTableItemProps`](#extendtableitemprops))[] ; `onChange?`: (`pagination`: `TablePaginationConfig`, `filters`: `Record`<`string`, `FilterValue` \| ``null``\>, `sorter`: `SorterResult`<`T`\> \| `SorterResult`<`T`\>[], `extra`: `TableCurrentDataSource`<`T`\>) => { `extra`: `TableCurrentDataSource`<`T`\> ; `filters`: `Record`<`string`, `FilterValue` \| ``null``\> ; `pagination`: `TablePaginationConfig` ; `sorter`: `SorterResult`<`T`\> \| `SorterResult`<`T`\>[]  }  } & `AntdTableProps`<`T`\>
 
 #### Type parameters
 
 | Name | Type |
 | :------ | :------ |
-| `Values` | extends `Record`<`string`, `any`\> = `any` |
-| `ExtendItemProps` | `any` |
+| `T` | `any` |
+| `ExtendTypes` | `any` |
 
 ___
 
-### LinkProps
+### UnionFaasItemElement
 
-Ƭ **LinkProps**: `Object`
+Ƭ **UnionFaasItemElement**<`Value`, `Values`\>: `ReactElement`<[`UnionFaasItemInjection`](#unionfaasiteminjection)<`Value`, `Values`\>\> \| ``null``
 
-#### Type declaration
+#### Type parameters
 
 | Name | Type |
 | :------ | :------ |
-| `button?` | `ButtonProps` |
-| `children?` | `ReactNode` |
-| `href` | `string` |
-| `style?` | `CSSProperties` |
-| `target?` | `string` |
-| `text?` | `string` \| `number` |
+| `Value` | `any` |
+| `Values` | `any` |
 
 ___
 
-### ModalProps
+### UnionFaasItemInjection
 
-Ƭ **ModalProps**: `AntdModalProps` & { `children?`: `JSX.Element` \| `JSX.Element`[] \| `string`  }
+Ƭ **UnionFaasItemInjection**<`Value`, `Values`\>: `Object`
 
-___
-
-### RoutesProps
+#### Type parameters
 
-Ƭ **RoutesProps**: `Object`
+| Name | Type |
+| :------ | :------ |
+| `Value` | `any` |
+| `Values` | `any` |
 
 #### Type declaration
 
 | Name | Type |
 | :------ | :------ |
-| `fallback?` | `JSX.Element` |
-| `notFound?` | `JSX.Element` |
-| `routes` | `RouteProps` & { `page?`: `LazyExoticComponent`<`ComponentType`<`any`\>\>  }[] |
+| `index?` | `number` |
+| `scene?` | [`UnionScene`](#unionscene) |
+| `value?` | `Value` |
+| `values?` | `Values` |
 
 ___
 
-### TableItemProps
+### UnionFaasItemRender
 
-Ƭ **TableItemProps**<`T`\>: { `children?`: `JSX.Element` \| ``null`` ; `object?`: [`TableItemProps`](#tableitemprops)[] ; `optionsType?`: ``"auto"``  } & [`FaasItemProps`](#faasitemprops) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
+Ƭ **UnionFaasItemRender**<`Value`, `Values`\>: (`value`: `Value`, `values`: `Values`, `index`: `number`, `scene`: [`UnionScene`](#unionscene)) => `JSX.Element` \| ``null``
 
 #### Type parameters
 
 | Name | Type |
 | :------ | :------ |
-| `T` | `any` |
-
-___
+| `Value` | `any` |
+| `Values` | `any` |
 
-### TableProps
+#### Type declaration
 
-Ƭ **TableProps**<`T`, `ExtendTypes`\>: { `extendTypes?`: { `[key: string]`: [`ExtendTableTypeProps`](#extendtabletypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`TableItemProps`](#tableitemprops) \| `ExtendTypes` & [`ExtendTableItemProps`](#extendtableitemprops))[] ; `onChange?`: (`pagination`: `TablePaginationConfig`, `filters`: `Record`<`string`, `FilterValue` \| ``null``\>, `sorter`: `SorterResult`<`T`\> \| `SorterResult`<`T`\>[], `extra`: `TableCurrentDataSource`<`T`\>) => { `extra`: `TableCurrentDataSource`<`T`\> ; `filters`: `Record`<`string`, `FilterValue` \| ``null``\> ; `pagination`: `TablePaginationConfig` ; `sorter`: `SorterResult`<`T`\> \| `SorterResult`<`T`\>[]  }  } & `AntdTableProps`<`T`\>
+▸ (`value`, `values`, `index`, `scene`): `JSX.Element` \| ``null``
 
-#### Type parameters
+##### Parameters
 
 | Name | Type |
 | :------ | :------ |
-| `T` | `any` |
-| `ExtendTypes` | `any` |
+| `value` | `Value` |
+| `values` | `Values` |
+| `index` | `number` |
+| `scene` | [`UnionScene`](#unionscene) |
 
-___
-
-### TimePickerProps
+##### Returns
 
-Ƭ **TimePickerProps**: `Omit`<`PickerTimeProps`<`Dayjs`\>, ``"picker"``\>
+`JSX.Element` \| ``null``
 
 ___
 
-### TitleProps
-
-Ƭ **TitleProps**: `Object`
+### UnionScene
 
-#### Type declaration
-
-| Name | Type | Description |
-| :------ | :------ | :------ |
-| `children?` | `JSX.Element` | return children |
-| `h1?` | `boolean` \| { `className?`: `string` ; `style?`: `React.CSSProperties`  } | return a h1 element |
-| `header?` | `PageHeaderProps` | return a PageHeader element |
-| `plain?` | `boolean` | return a pure text element |
-| `separator?` | `string` | ` - ` as default |
-| `suffix?` | `string` | - |
-| `title` | `string` \| `string`[] | - |
+Ƭ **UnionScene**: ``"form"`` \| ``"description"`` \| ``"table"``
 
 ___
 
 ### setDrawerProps
 
-Ƭ **setDrawerProps**: (`changes`: `Partial`<[`DrawerProps`](#drawerprops)\>) => `void`
+Ƭ **setDrawerProps**: (`changes`: `Partial`<[`DrawerProps`](interfaces/DrawerProps.md)\>) => `void`
 
 #### Type declaration
 
@@ -442,7 +369,7 @@ ___
 
 | Name | Type |
 | :------ | :------ |
-| `changes` | `Partial`<[`DrawerProps`](#drawerprops)\> |
+| `changes` | `Partial`<[`DrawerProps`](interfaces/DrawerProps.md)\> |
 
 ##### Returns
 
@@ -452,7 +379,7 @@ ___
 
 ### setModalProps
 
-Ƭ **setModalProps**: (`changes`: `Partial`<[`ModalProps`](#modalprops)\>) => `void`
+Ƭ **setModalProps**: (`changes`: `Partial`<[`ModalProps`](interfaces/ModalProps.md)\>) => `void`
 
 #### Type declaration
 
@@ -462,7 +389,7 @@ ___
 
 | Name | Type |
 | :------ | :------ |
-| `changes` | `Partial`<[`ModalProps`](#modalprops)\> |
+| `changes` | `Partial`<[`ModalProps`](interfaces/ModalProps.md)\> |
 
 ##### Returns
 
@@ -472,27 +399,39 @@ ___
 
 ### ConfigContext
 
-• `Const` **ConfigContext**: `Context`<[`ConfigProviderProps`](#configproviderprops)\>
+• `Const` **ConfigContext**: `Context`<[`ConfigProviderProps`](interfaces/ConfigProviderProps.md)\>
 
-___
+## Functions
 
-### DatePicker
+### App
 
-• `Const` **DatePicker**: `PickerComponentClass`<`Object`, `unknown`\> & {}
+▸ **App**(`props`): `Element`
 
-## Functions
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`AppProps`](interfaces/AppProps.md) |
+
+#### Returns
+
+`Element`
+
+___
 
 ### Blank
 
 ▸ **Blank**(`options?`): `JSX.Element`
 
+Blank component.
+
 If value is undefined or null, return text, otherwise return value.
 
 #### Parameters
 
 | Name | Type | Description |
 | :------ | :------ | :------ |
-| `options?` | [`BlankProps`](#blankprops) | {object} |
+| `options?` | [`BlankProps`](interfaces/BlankProps.md) | {object} |
 
 #### Returns
 
@@ -504,25 +443,9 @@ If value is undefined or null, return text, otherwise return value.
 
 ___
 
-### Calendar
-
-▸ **Calendar**(`props`): `Element`
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `props` | `CalendarProps`<`Dayjs`\> |
-
-#### Returns
-
-`Element`
-
-___
-
 ### ConfigProvider
 
-▸ **ConfigProvider**(`__namedParameters`): `Element`
+▸ **ConfigProvider**(`«destructured»`): `Element`
 
 Config for @faasjs/ant-design components.
 
@@ -540,9 +463,9 @@ Config for @faasjs/ant-design components.
 
 | Name | Type |
 | :------ | :------ |
-| `__namedParameters` | `Object` |
-| `__namedParameters.children` | `ReactNode` |
-| `__namedParameters.config` | [`ConfigProviderProps`](#configproviderprops) |
+| `«destructured»` | `Object` |
+| › `children` | `ReactNode` |
+| › `config` | [`ConfigProviderProps`](interfaces/ConfigProviderProps.md) |
 
 #### Returns
 
@@ -554,6 +477,8 @@ ___
 
 ▸ **Description**<`T`\>(`props`): `Element`
 
+Description component.
+
 #### Type parameters
 
 | Name | Type |
@@ -564,7 +489,7 @@ ___
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`DescriptionProps`](#descriptionprops)<`T`, `any`\> |
+| `props` | [`DescriptionProps`](interfaces/DescriptionProps.md)<`T`, `any`\> |
 
 #### Returns
 
@@ -572,6 +497,42 @@ ___
 
 ___
 
+### FaasDataWrapper
+
+▸ **FaasDataWrapper**<`T`\>(`props`): `JSX.Element`
+
+FaasDataWrapper component with Loading
+
+```tsx
+function MyComponent (props: FaasDataInjection) {
+  return <div>{ props.data }</div>
+}
+
+function MyPage () {
+  return <FaasDataWrapper action="test" params={{ a: 1 }}>
+    <MyComponent />
+  </FaasDataWrapper>
+}
+```
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`FaasDataWrapperProps`](interfaces/FaasDataWrapperProps.md)<`T`\> |
+
+#### Returns
+
+`JSX.Element`
+
+___
+
 ### Form
 
 ▸ **Form**<`Values`\>(`props`): `Element`
@@ -592,7 +553,7 @@ https://ant.design/components/form/
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`FormProps`](#formprops)<`Values`, `any`\> |
+| `props` | [`FormProps`](interfaces/FormProps.md)<`Values`, `any`\> |
 
 #### Returns
 
@@ -608,10 +569,10 @@ FormItem, can be used without Form.
 
 ```ts
 // use inline type
-<FormItem item={{ type: 'string', id: 'name' }} />
+<FormItem type='string' id='name' />
 
 // use custom type
-<FormItem item={{ id: 'password' }}>
+<FormItem id='password'>
   <Input.Password />
 </>
 ```
@@ -626,7 +587,7 @@ FormItem, can be used without Form.
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`FormItemProps`](#formitemprops)<`T`\> |
+| `props` | [`FormItemProps`](interfaces/FormItemProps.md)<`T`\> |
 
 #### Returns
 
@@ -636,21 +597,49 @@ ___
 
 ### Link
 
-▸ **Link**(`__namedParameters`): `Element`
+▸ **Link**(`props`): `Element`
+
+Link component with button.
 
 ```ts
 // pure link
 <Link href="/">Home</Link>
 
 // link with button
-<Link href="/" button={{type:'primary'}}>Home</Link>
+<Link href="/" button={{ type:'primary' }}>Home</Link>
 ```
 
 #### Parameters
 
 | Name | Type |
 | :------ | :------ |
-| `__namedParameters` | [`LinkProps`](#linkprops) |
+| `props` | [`LinkProps`](interfaces/LinkProps.md) |
+
+#### Returns
+
+`Element`
+
+___
+
+### Loading
+
+▸ **Loading**(`props`): `Element`
+
+Loading component based on Spin
+
+```tsx
+<Loading /> // display loading
+
+<Loading loading={ !remoteData }>
+ <div>{remoteData}</div>
+</Loading>
+```
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`LoadingProps`](#loadingprops) |
 
 #### Returns
 
@@ -675,7 +664,7 @@ ___
 Routes with lazy loading and 404 page.
 
 ```tsx
-import { lazy } from 'react'
+import { Routes, lazy } from '@faasjs/ant-design'
 import { BrowserRouter } from 'react-router-dom'
 
 export function App () {
@@ -694,7 +683,7 @@ export function App () {
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`RoutesProps`](#routesprops) |
+| `props` | [`RoutesProps`](interfaces/RoutesProps.md) |
 
 #### Returns
 
@@ -716,7 +705,7 @@ https://ant.design/components/table/
 
 | Name | Type |
 | :------ | :------ |
-| `T` | `any` |
+| `T` | extends `Record`<`string`, `any`\> |
 | `ExtendTypes` | `any` |
 
 #### Parameters
@@ -731,24 +720,6 @@ https://ant.design/components/table/
 
 ___
 
-### TimePicker
-
-▸ **TimePicker**(`props`): `ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`\>\>
-
-**NOTE**: Exotic components are not callable.
-
-#### Parameters
-
-| Name | Type |
-| :------ | :------ |
-| `props` | [`TimePickerProps`](#timepickerprops) & `RefAttributes`<`any`\> |
-
-#### Returns
-
-`ReactElement`<`any`, `string` \| `JSXElementConstructor`<`any`\>\>
-
-___
-
 ### Title
 
 ▸ **Title**(`props`): `JSX.Element`
@@ -773,7 +744,7 @@ Return null by default.
 
 | Name | Type |
 | :------ | :------ |
-| `props` | [`TitleProps`](#titleprops) |
+| `props` | [`TitleProps`](interfaces/TitleProps.md) |
 
 #### Returns
 
@@ -785,6 +756,8 @@ ___
 
 ▸ **transferOptions**(`options`): { `label`: `string` ; `value?`: `string` \| `number`  }[]
 
+convert options to { label, value }[]
+
 #### Parameters
 
 | Name | Type |
@@ -814,13 +787,23 @@ ___
 
 ___
 
+### useApp
+
+▸ **useApp**(): [`useAppProps`](interfaces/useAppProps.md)
+
+#### Returns
+
+[`useAppProps`](interfaces/useAppProps.md)
+
+___
+
 ### useConfigContext
 
-▸ **useConfigContext**(): [`ConfigProviderProps`](#configproviderprops)
+▸ **useConfigContext**(): [`ConfigProviderProps`](interfaces/ConfigProviderProps.md)
 
 #### Returns
 
-[`ConfigProviderProps`](#configproviderprops)
+[`ConfigProviderProps`](interfaces/ConfigProviderProps.md)
 
 ___
 
@@ -834,7 +817,7 @@ Hook style drawer.
 
 | Name | Type | Description |
 | :------ | :------ | :------ |
-| `init?` | [`DrawerProps`](#drawerprops) | initial props  ```ts function Example() {   const { drawer, setDrawerProps } = useDrawer()    return <>     <Button onClick={ () => setDrawerProps(prev => ({ open: !prev.open})) }>       Toggle     </Button>     {drawer}   </> } ``` |
+| `init?` | [`DrawerProps`](interfaces/DrawerProps.md) | initial props ```ts function Example() { const { drawer, setDrawerProps } = useDrawer() return <> <Button onClick={ () => setDrawerProps(prev => ({ open: !prev.open})) }> Toggle </Button> {drawer} </> } ``` |
 
 #### Returns
 
@@ -843,8 +826,8 @@ Hook style drawer.
 | Name | Type |
 | :------ | :------ |
 | `drawer` | `Element` |
-| `drawerProps` | [`DrawerProps`](#drawerprops) |
-| `setDrawerProps` | (`changes`: `Partial`<[`DrawerProps`](#drawerprops)\>) => `void` |
+| `drawerProps` | [`DrawerProps`](interfaces/DrawerProps.md) |
+| `setDrawerProps` | (`changes`: `Partial`<[`DrawerProps`](interfaces/DrawerProps.md)\>) => `void` |
 
 ___
 
@@ -858,7 +841,7 @@ Hook style modal.
 
 | Name | Type | Description |
 | :------ | :------ | :------ |
-| `init?` | [`ModalProps`](#modalprops) | initial props  ```ts function Example() {   const { modal, setModalProps } = useModal()    return <>     <Button onClick={() => setModalProps({ open: true })}>Open Modal</Button>     {modal}</> } ``` |
+| `init?` | [`ModalProps`](interfaces/ModalProps.md) | initial props ```ts function Example() { const { modal, setModalProps } = useModal() return <> <Button onClick={() => setModalProps({ open: true })}>Open Modal</Button> {modal}</> } ``` |
 
 #### Returns
 
@@ -867,5 +850,5 @@ Hook style modal.
 | Name | Type |
 | :------ | :------ |
 | `modal` | `Element` |
-| `modalProps` | [`ModalProps`](#modalprops) |
-| `setModalProps` | (`changes`: `Partial`<[`ModalProps`](#modalprops)\>) => `void` |
+| `modalProps` | [`ModalProps`](interfaces/ModalProps.md) |
+| `setModalProps` | (`changes`: `Partial`<[`ModalProps`](interfaces/ModalProps.md)\>) => `void` |