@faasjs/ant-design 0.0.2-beta.360 → 0.0.2-beta.364

package/README.md

@@ -38,3 +38,534 @@ Form are based on [Ant Design's Form component](https://ant.design/components/fo
 Form are based on [Ant Design's Form.Item component](https://ant.design/components/form/#Form.Item).
 
 <iframe src="https://codesandbox.io/embed/faasjs-ant-design-formitem-olqg5" style="width:100%;height:500px;border:0;overflow:hidden;" title="faasjs-ant-design-formitem" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"></iframe>
+
+## Modules
+
+### Namespaces
+
+- [Form](modules/Form.md)
+
+### Type aliases
+
+- [BaseItemProps](#baseitemprops)
+- [BaseOption](#baseoption)
+- [BlankProps](#blankprops)
+- [DescriptionItemProps](#descriptionitemprops)
+- [DescriptionProps](#descriptionprops)
+- [DrawerProps](#drawerprops)
+- [ExtendDescriptionItemProps](#extenddescriptionitemprops)
+- [ExtendDescriptionTypeProps](#extenddescriptiontypeprops)
+- [ExtendFormItemProps](#extendformitemprops)
+- [ExtendFormTypeProps](#extendformtypeprops)
+- [ExtendTableItemProps](#extendtableitemprops)
+- [ExtendTableTypeProps](#extendtabletypeprops)
+- [FaasItemProps](#faasitemprops)
+- [FaasItemType](#faasitemtype)
+- [FaasItemTypeValue](#faasitemtypevalue)
+- [FaasState](#faasstate)
+- [FormItemProps](#formitemprops)
+- [FormProps](#formprops)
+- [RoutesProps](#routesprops)
+- [TableItemProps](#tableitemprops)
+- [TableProps](#tableprops)
+- [TitleProps](#titleprops)
+
+### Functions
+
+- [Blank](#blank)
+- [Config](#config)
+- [Description](#description)
+- [Form](#form)
+- [FormItem](#formitem)
+- [Routes](#routes)
+- [Table](#table)
+- [Title](#title)
+- [transferOptions](#transferoptions)
+- [useDrawer](#usedrawer)
+- [useFaasState](#usefaasstate)
+
+## 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` |
+
+___
+
+### DescriptionItemProps
+
+Ƭ **DescriptionItemProps**<`T`\>: { `children?`: `JSX.Element` ; `render?`: (`value`: `T`, `values`: `any`) => `string` \| `number` \| `boolean` \| `Element`  } & [`FaasItemProps`](#faasitemprops)
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### DescriptionProps
+
+Ƭ **DescriptionProps**<`T`, `ExtendItemProps`\>: { `dataSource?`: `T` ; `extendTypes?`: { [key: string]: [`ExtendDescriptionTypeProps`](#extenddescriptiontypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`DescriptionItemProps`](#descriptionitemprops) \| `ExtendItemProps`)[]  } & `DescriptionsProps`
+
+#### 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`) => `string` \| `number` \| `boolean` \| `Element` |
+
+___
+
+### ExtendFormItemProps
+
+Ƭ **ExtendFormItemProps**: [`BaseItemProps`](#baseitemprops) & `AntdFormItemProps`
+
+___
+
+### ExtendFormTypeProps
+
+Ƭ **ExtendFormTypeProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `children?` | `JSX.Element` \| ``null`` |
+
+___
+
+### ExtendTableItemProps
+
+Ƭ **ExtendTableItemProps**<`T`\>: [`BaseItemProps`](#baseitemprops) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### ExtendTableTypeProps
+
+Ƭ **ExtendTableTypeProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `children?` | `JSX.Element` \| ``null`` |
+| `render?` | (`value`: `any`, `values`: `any`, `index`: `number`) => `string` \| `number` \| `boolean` \| `Element` |
+
+___
+
+### FaasItemProps
+
+Ƭ **FaasItemProps**: [`BaseItemProps`](#baseitemprops) & { `type?`: [`FaasItemType`](#faasitemtype)  }
+
+___
+
+### FaasItemType
+
+Ƭ **FaasItemType**: ``"string"`` \| ``"string[]"`` \| ``"number"`` \| ``"number[]"`` \| ``"boolean"``
+
+___
+
+### FaasItemTypeValue
+
+Ƭ **FaasItemTypeValue**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `boolean` | `boolean` |
+| `number` | `number` |
+| `number[]` | `number`[] |
+| `string` | `string` |
+| `string[]` | `string`[] |
+
+___
+
+### FaasState
+
+Ƭ **FaasState**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `Blank` | `Object` |
+| `Blank.text` | `string` |
+| `Form` | `Object` |
+| `Form.submit` | `Object` |
+| `Form.submit.text` | `string` |
+| `Title` | `Object` |
+| `Title.separator` | `string` |
+| `Title.suffix` | `string` |
+| `common` | `Object` |
+| `common.all` | `string` |
+| `common.blank` | `string` |
+| `common.pageNotFound` | `string` |
+| `common.submit` | `string` |
+
+___
+
+### FormItemProps
+
+Ƭ **FormItemProps**<`T`\>: { `children?`: `JSX.Element` \| ``null`` ; `extendTypes?`: { [type: string]: [`ExtendFormTypeProps`](#extendformtypeprops);  } ; `label?`: `string` \| ``false`` ; `rules?`: `RuleObject`[] ; `render?`: () => `Element`  } & `FormItemInputProps`<`T`\> & [`FaasItemProps`](#faasitemprops) & `AntdFormItemProps`<`T`\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### FormProps
+
+Ƭ **FormProps**<`Values`, `ExtendItemProps`\>: { `extendTypes?`: { [type: string]: [`ExtendFormTypeProps`](#extendformtypeprops);  } ; `items?`: ([`FormItemProps`](#formitemprops) \| `ExtendItemProps`)[] ; `submit?`: ``false`` \| { `text?`: `string`  }  } & `AntdFormProps`<`Values`\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `Values` | `any` |
+| `ExtendItemProps` | `any` |
+
+___
+
+### RoutesProps
+
+Ƭ **RoutesProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `fallback?` | `JSX.Element` |
+| `notFound?` | `JSX.Element` |
+| `routes` | `RouteProps` & { `page?`: `LazyExoticComponent`<`ComponentType`<`any`\>\>  }[] |
+
+___
+
+### TableItemProps
+
+Ƭ **TableItemProps**<`T`\>: { `children?`: `JSX.Element` \| ``null``  } & [`FaasItemProps`](#faasitemprops) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### TableProps
+
+Ƭ **TableProps**<`T`, `ExtendTypes`\>: { `extendTypes?`: { [key: string]: [`ExtendTableTypeProps`](#extendtabletypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`TableItemProps`](#tableitemprops) \| `ExtendTypes` & [`ExtendTableItemProps`](#extendtableitemprops))[] ; `onChange?`: (`pagination`: `TablePaginationConfig`, `filters`: `Record`<`string`, `FilterValue`\>, `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 |
+| :------ | :------ |
+| `T` | `any` |
+| `ExtendTypes` | `any` |
+
+___
+
+### TitleProps
+
+Ƭ **TitleProps**: `Object`
+
+#### Type declaration
+
+| Name | Type | Description |
+| :------ | :------ | :------ |
+| `separator?` | `string` | ` - ` as default |
+| `suffix?` | `string` | - |
+| `title` | `string` \| `string`[] | - |
+
+## Functions
+
+### Blank
+
+▸ **Blank**(`options?`): `any`
+
+If value is undefined or null, return text, otherwise return value.
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `options?` | [`BlankProps`](#blankprops) |
+
+#### Returns
+
+`any`
+
+```ts
+<Blank value={undefined} text="Empty" />
+```
+
+___
+
+### Config
+
+▸ **Config**(`props`): `JSX.Element`
+
+Config for all @faasjs/ant-design components.
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | `Object` |
+| `props.config` | `Partial`<[`FaasState`](#faasstate)\> |
+
+#### Returns
+
+`JSX.Element`
+
+```ts
+<Config config={{
+ common: {
+  blank: '空',
+ },
+}} />
+```
+
+___
+
+### Description
+
+▸ **Description**<`T`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`DescriptionProps`](#descriptionprops)<`T`, `any`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Form
+
+▸ **Form**<`Values`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `Values` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`FormProps`](#formprops)<`Values`, `any`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### FormItem
+
+▸ **FormItem**<`T`\>(`props`): `Element`
+
+FormItem, can be used without Form.
+Example:
+```ts
+// use inline type
+<FormItem item={{ type: 'string', id: 'name' }} />
+
+// use custom type
+<FormItem item={{ id: 'password' }}>
+  <Input.Password />
+</>
+```
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`FormItemProps`](#formitemprops)<`T`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Routes
+
+▸ **Routes**(`props`): `Element`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`RoutesProps`](#routesprops) |
+
+#### Returns
+
+`Element`
+
+___
+
+### Table
+
+▸ **Table**<`T`, `ExtendTypes`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+| `ExtendTypes` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`TableProps`](#tableprops)<`T`, `ExtendTypes`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Title
+
+▸ **Title**(`props`): `JSX.Element`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`TitleProps`](#titleprops) |
+
+#### Returns
+
+`JSX.Element`
+
+___
+
+### transferOptions
+
+▸ **transferOptions**(`options`): { `label`: `string` ; `value?`: `string` \| `number`  }[]
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `options` | [`BaseOption`](#baseoption)[] |
+
+#### Returns
+
+{ `label`: `string` ; `value?`: `string` \| `number`  }[]
+
+___
+
+### useDrawer
+
+▸ **useDrawer**(`init?`): `Object`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `init?` | [`DrawerProps`](#drawerprops) |
+
+#### Returns
+
+`Object`
+
+| Name | Type |
+| :------ | :------ |
+| `drawer` | `Element` |
+| `drawerProps` | [`DrawerProps`](#drawerprops) |
+| `setDrawerProps` | (`changes`: `Partial`<[`DrawerProps`](#drawerprops)\>) => `void` |
+
+___
+
+### useFaasState
+
+▸ `Const` **useFaasState**(): [[`FaasState`](#faasstate), (`state`: `IHookStateSetAction`<[`FaasState`](#faasstate)\>) => `void`]
+
+#### Returns
+
+[[`FaasState`](#faasstate), (`state`: `IHookStateSetAction`<[`FaasState`](#faasstate)\>) => `void`]

package/dist/index.d.ts

@@ -12,6 +12,18 @@ declare type BlankProps = {
     value?: any;
     text?: string;
 };
+/**
+ * If value is undefined or null, return text, otherwise return value.
+ *
+ * @param options {object}
+ * @param options.value {any}
+ * @param options.text {string} Default is 'Empty'
+ * @returns {JSX.Element}
+ *
+ * ```ts
+ * <Blank value={undefined} text="Empty" />
+ * ```
+ */
 declare function Blank(options?: BlankProps): any;
 
 declare type FaasState = {
@@ -35,6 +47,20 @@ declare type FaasState = {
     };
 };
 declare const useFaasState: () => [FaasState, (state: react_use_lib_misc_hookState.IHookStateSetAction<FaasState>) => void];
+/**
+ * Config for all @faasjs/ant-design components.
+ * @param props {object}
+ * @param props.config {Partial<FaasState>}
+ * @returns {null}
+ *
+ * ```ts
+ * <Config config={{
+ *  common: {
+ *   blank: '空',
+ *  },
+ * }} />
+ * ```
+ */
 declare function Config(props: {
     config: Partial<FaasState>;
 }): JSX.Element;
@@ -119,7 +145,7 @@ declare type BooleanProps = {
     input?: SwitchProps;
 };
 declare type OptionsProps = {
-    options: BaseOption[];
+    options?: BaseOption[];
     type?: 'string' | 'string[]' | 'number' | 'number[]';
     input?: SelectProps<any>;
 };
@@ -137,6 +163,19 @@ declare type FormItemProps<T = any> = {
         [type: string]: ExtendFormTypeProps;
     };
 } & FormItemInputProps<T> & FaasItemProps & FormItemProps$1<T>;
+/**
+ * FormItem, can be used without Form.
+ * Example:
+ * ```ts
+ * // use inline type
+ * <FormItem item={{ type: 'string', id: 'name' }} />
+ *
+ * // use custom type
+ * <FormItem item={{ id: 'password' }}>
+ *   <Input.Password />
+ * </>
+ * ```
+ */
 declare function FormItem<T = any>(props: FormItemProps<T>): JSX.Element;
 
 declare type FormProps<Values = any, ExtendItemProps = any> = {

package/dist/index.js

@@ -200,11 +200,9 @@ function Description(props) {
       extendTypes: props.extendTypes
     }))));
   return /* @__PURE__ */ import_react.default.createElement(import_react4.FaasDataWrapper, __spreadValues({
-    fallback: props.faasData.fallback || /* @__PURE__ */ import_react.default.createElement("div", {
-      style: { padding: "24px" }
-    }, /* @__PURE__ */ import_react.default.createElement(import_antd2.Skeleton, {
+    fallback: props.faasData.fallback || /* @__PURE__ */ import_react.default.createElement(import_antd2.Skeleton, {
       active: true
-    })),
+    }),
     render: ({ data }) => /* @__PURE__ */ import_react.default.createElement(import_antd2.Descriptions, __spreadValues({}, props), props.items.map((item) => /* @__PURE__ */ import_react.default.createElement(import_antd2.Descriptions.Item, {
       key: item.id,
       label: item.title || (0, import_lodash3.upperFirst)(item.id)
@@ -304,34 +302,41 @@ function FormItem(props) {
       return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.List, {
         name: computedProps.name,
         rules: computedProps.rules
-      }, (fields, { add, remove }, { errors }) => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, computedProps.label && /* @__PURE__ */ import_react.default.createElement("div", {
-        className: "ant-form-item-label"
-      }, /* @__PURE__ */ import_react.default.createElement("label", {
-        className: computedProps.rules.find((r) => r.required) && "ant-form-item-required"
-      }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
-        key: field.key
-      }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
-        gutter: 24
-      }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
-        span: 23
-      }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
-        noStyle: true
-      }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
-        span: 1
-      }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
-        danger: true,
-        type: "link",
-        style: { float: "right" },
-        icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
-        onClick: () => remove(field.name)
-      }))))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
-        type: "dashed",
-        block: true,
-        onClick: () => add(),
-        icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.PlusOutlined, null)
-      }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.ErrorList, {
-        errors
-      }))));
+      }, (fields, { add, remove }, { errors }) => {
+        var _a;
+        return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, computedProps.label && /* @__PURE__ */ import_react.default.createElement("div", {
+          className: "ant-form-item-label"
+        }, /* @__PURE__ */ import_react.default.createElement("label", {
+          className: computedProps.rules.find((r) => r.required) && "ant-form-item-required"
+        }, computedProps.label)), fields.map((field) => {
+          var _a2;
+          return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
+            key: field.key
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
+            gutter: 24,
+            style: { flexFlow: "row nowrap" }
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
+            span: 23
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
+            noStyle: true
+          }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
+            span: 1
+          }, !((_a2 = computedProps.input) == null ? void 0 : _a2.disabled) && (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
+            danger: true,
+            type: "link",
+            style: { float: "right" },
+            icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
+            onClick: () => remove(field.name)
+          }))));
+        }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, !((_a = computedProps.input) == null ? void 0 : _a.disabled) && (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
+          type: "dashed",
+          block: true,
+          onClick: () => add(),
+          icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.PlusOutlined, null)
+        }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.ErrorList, {
+          errors
+        })));
+      });
     case "number":
       return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.options ? /* @__PURE__ */ import_react.default.createElement(import_antd4.Select, __spreadValues({}, computedProps.input)) : /* @__PURE__ */ import_react.default.createElement(import_antd4.InputNumber, __spreadValues({
         style: { width: "100%" }
@@ -345,30 +350,34 @@ function FormItem(props) {
         name: computedProps.name,
         rules: computedProps.rules
       }, (fields, { add, remove }, { errors }) => {
-        var _a;
+        var _a, _b;
         return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, computedProps.label && /* @__PURE__ */ import_react.default.createElement("div", {
           className: "ant-form-item-label"
         }, /* @__PURE__ */ import_react.default.createElement("label", {
           className: ((_a = computedProps.rules) == null ? void 0 : _a.find((r) => r.required)) && "ant-form-item-required"
-        }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
-          key: field.key
-        }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
-          gutter: 24
-        }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
-          span: 23
-        }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
-          noStyle: true
-        }), /* @__PURE__ */ import_react.default.createElement(import_antd4.InputNumber, __spreadValues({
-          style: { width: "100%" }
-        }, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
-          span: 1
-        }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
-          danger: true,
-          type: "link",
-          style: { float: "right" },
-          icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
-          onClick: () => remove(field.name)
-        }))))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
+        }, computedProps.label)), fields.map((field) => {
+          var _a2;
+          return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
+            key: field.key
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
+            gutter: 24,
+            style: { flexFlow: "row nowrap" }
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
+            span: 23
+          }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
+            noStyle: true
+          }), /* @__PURE__ */ import_react.default.createElement(import_antd4.InputNumber, __spreadValues({
+            style: { width: "100%" }
+          }, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
+            span: 1
+          }, !((_a2 = computedProps.input) == null ? void 0 : _a2.disabled) && (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
+            danger: true,
+            type: "link",
+            style: { float: "right" },
+            icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
+            onClick: () => remove(field.name)
+          }))));
+        }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, !((_b = computedProps.input) == null ? void 0 : _b.disabled) && (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
           type: "dashed",
           block: true,
           onClick: () => add(),
@@ -597,11 +606,9 @@ function Table(props) {
       dataSource: props.dataSource
     }));
   return /* @__PURE__ */ import_react.default.createElement(import_react10.FaasDataWrapper, __spreadValues({
-    fallback: props.faasData.fallback || /* @__PURE__ */ import_react.default.createElement("div", {
-      style: { padding: "24px" }
-    }, /* @__PURE__ */ import_react.default.createElement(import_antd7.Skeleton, {
+    fallback: props.faasData.fallback || /* @__PURE__ */ import_react.default.createElement(import_antd7.Skeleton, {
       active: true
-    })),
+    }),
     render: ({
       data,
       params,

package/dist/index.mjs

@@ -165,11 +165,9 @@ function Description(props) {
       extendTypes: props.extendTypes
     }))));
   return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadValues({
-    fallback: props.faasData.fallback || /* @__PURE__ */ React.createElement("div", {
-      style: { padding: "24px" }
-    }, /* @__PURE__ */ React.createElement(Skeleton, {
+    fallback: props.faasData.fallback || /* @__PURE__ */ React.createElement(Skeleton, {
       active: true
-    })),
+    }),
     render: ({ data }) => /* @__PURE__ */ React.createElement(Descriptions, __spreadValues({}, props), props.items.map((item) => /* @__PURE__ */ React.createElement(Descriptions.Item, {
       key: item.id,
       label: item.title || upperFirst2(item.id)
@@ -281,34 +279,41 @@ function FormItem(props) {
       return /* @__PURE__ */ React.createElement(AntdForm.List, {
         name: computedProps.name,
         rules: computedProps.rules
-      }, (fields, { add, remove }, { errors }) => /* @__PURE__ */ React.createElement(React.Fragment, null, computedProps.label && /* @__PURE__ */ React.createElement("div", {
-        className: "ant-form-item-label"
-      }, /* @__PURE__ */ React.createElement("label", {
-        className: computedProps.rules.find((r) => r.required) && "ant-form-item-required"
-      }, computedProps.label)), fields.map((field) => /* @__PURE__ */ React.createElement(AntdForm.Item, {
-        key: field.key
-      }, /* @__PURE__ */ React.createElement(Row, {
-        gutter: 24
-      }, /* @__PURE__ */ React.createElement(Col, {
-        span: 23
-      }, /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadProps(__spreadValues({}, field), {
-        noStyle: true
-      }), /* @__PURE__ */ React.createElement(Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ React.createElement(Col, {
-        span: 1
-      }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ React.createElement(Button, {
-        danger: true,
-        type: "link",
-        style: { float: "right" },
-        icon: /* @__PURE__ */ React.createElement(MinusCircleOutlined, null),
-        onClick: () => remove(field.name)
-      }))))), /* @__PURE__ */ React.createElement(AntdForm.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ React.createElement(Button, {
-        type: "dashed",
-        block: true,
-        onClick: () => add(),
-        icon: /* @__PURE__ */ React.createElement(PlusOutlined, null)
-      }), /* @__PURE__ */ React.createElement(AntdForm.ErrorList, {
-        errors
-      }))));
+      }, (fields, { add, remove }, { errors }) => {
+        var _a;
+        return /* @__PURE__ */ React.createElement(React.Fragment, null, computedProps.label && /* @__PURE__ */ React.createElement("div", {
+          className: "ant-form-item-label"
+        }, /* @__PURE__ */ React.createElement("label", {
+          className: computedProps.rules.find((r) => r.required) && "ant-form-item-required"
+        }, computedProps.label)), fields.map((field) => {
+          var _a2;
+          return /* @__PURE__ */ React.createElement(AntdForm.Item, {
+            key: field.key
+          }, /* @__PURE__ */ React.createElement(Row, {
+            gutter: 24,
+            style: { flexFlow: "row nowrap" }
+          }, /* @__PURE__ */ React.createElement(Col, {
+            span: 23
+          }, /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadProps(__spreadValues({}, field), {
+            noStyle: true
+          }), /* @__PURE__ */ React.createElement(Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ React.createElement(Col, {
+            span: 1
+          }, !((_a2 = computedProps.input) == null ? void 0 : _a2.disabled) && (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ React.createElement(Button, {
+            danger: true,
+            type: "link",
+            style: { float: "right" },
+            icon: /* @__PURE__ */ React.createElement(MinusCircleOutlined, null),
+            onClick: () => remove(field.name)
+          }))));
+        }), /* @__PURE__ */ React.createElement(AntdForm.Item, null, !((_a = computedProps.input) == null ? void 0 : _a.disabled) && (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ React.createElement(Button, {
+          type: "dashed",
+          block: true,
+          onClick: () => add(),
+          icon: /* @__PURE__ */ React.createElement(PlusOutlined, null)
+        }), /* @__PURE__ */ React.createElement(AntdForm.ErrorList, {
+          errors
+        })));
+      });
     case "number":
       return /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadValues({}, computedProps), computedProps.options ? /* @__PURE__ */ React.createElement(Select, __spreadValues({}, computedProps.input)) : /* @__PURE__ */ React.createElement(InputNumber, __spreadValues({
         style: { width: "100%" }
@@ -322,30 +327,34 @@ function FormItem(props) {
         name: computedProps.name,
         rules: computedProps.rules
       }, (fields, { add, remove }, { errors }) => {
-        var _a;
+        var _a, _b;
         return /* @__PURE__ */ React.createElement(React.Fragment, null, computedProps.label && /* @__PURE__ */ React.createElement("div", {
           className: "ant-form-item-label"
         }, /* @__PURE__ */ React.createElement("label", {
           className: ((_a = computedProps.rules) == null ? void 0 : _a.find((r) => r.required)) && "ant-form-item-required"
-        }, computedProps.label)), fields.map((field) => /* @__PURE__ */ React.createElement(AntdForm.Item, {
-          key: field.key
-        }, /* @__PURE__ */ React.createElement(Row, {
-          gutter: 24
-        }, /* @__PURE__ */ React.createElement(Col, {
-          span: 23
-        }, /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadProps(__spreadValues({}, field), {
-          noStyle: true
-        }), /* @__PURE__ */ React.createElement(InputNumber, __spreadValues({
-          style: { width: "100%" }
-        }, computedProps.input)))), /* @__PURE__ */ React.createElement(Col, {
-          span: 1
-        }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ React.createElement(Button, {
-          danger: true,
-          type: "link",
-          style: { float: "right" },
-          icon: /* @__PURE__ */ React.createElement(MinusCircleOutlined, null),
-          onClick: () => remove(field.name)
-        }))))), /* @__PURE__ */ React.createElement(AntdForm.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ React.createElement(Button, {
+        }, computedProps.label)), fields.map((field) => {
+          var _a2;
+          return /* @__PURE__ */ React.createElement(AntdForm.Item, {
+            key: field.key
+          }, /* @__PURE__ */ React.createElement(Row, {
+            gutter: 24,
+            style: { flexFlow: "row nowrap" }
+          }, /* @__PURE__ */ React.createElement(Col, {
+            span: 23
+          }, /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadProps(__spreadValues({}, field), {
+            noStyle: true
+          }), /* @__PURE__ */ React.createElement(InputNumber, __spreadValues({
+            style: { width: "100%" }
+          }, computedProps.input)))), /* @__PURE__ */ React.createElement(Col, {
+            span: 1
+          }, !((_a2 = computedProps.input) == null ? void 0 : _a2.disabled) && (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ React.createElement(Button, {
+            danger: true,
+            type: "link",
+            style: { float: "right" },
+            icon: /* @__PURE__ */ React.createElement(MinusCircleOutlined, null),
+            onClick: () => remove(field.name)
+          }))));
+        }), /* @__PURE__ */ React.createElement(AntdForm.Item, null, !((_b = computedProps.input) == null ? void 0 : _b.disabled) && (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ React.createElement(Button, {
           type: "dashed",
           block: true,
           onClick: () => add(),
@@ -587,11 +596,9 @@ function Table(props) {
       dataSource: props.dataSource
     }));
   return /* @__PURE__ */ React.createElement(FaasDataWrapper2, __spreadValues({
-    fallback: props.faasData.fallback || /* @__PURE__ */ React.createElement("div", {
-      style: { padding: "24px" }
-    }, /* @__PURE__ */ React.createElement(Skeleton3, {
+    fallback: props.faasData.fallback || /* @__PURE__ */ React.createElement(Skeleton3, {
       active: true
-    })),
+    }),
     render: ({
       data,
       params,

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@faasjs/ant-design",
-  "version": "0.0.2-beta.360",
+  "version": "0.0.2-beta.364",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
-  "homepage": "https://faasjs.com/doc/ant-design.html",
+  "homepage": "https://faasjs.com/doc/ant-design",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/faasjs/faasjs.git",
@@ -28,7 +28,7 @@
     "lodash": "*",
     "react": "*",
     "react-dom": "*",
-    "@faasjs/react": "^0.0.2-beta.360",
+    "@faasjs/react": "^0.0.2-beta.364",
     "react-use": "*",
     "react-router-dom": "*"
   },