@faasjs/ant-design 0.0.2-beta.358 → 0.0.2-beta.362

package/README.md

@@ -38,3 +38,506 @@ 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](modules.md#baseitemprops)
+- [BaseOption](modules.md#baseoption)
+- [BlankProps](modules.md#blankprops)
+- [DescriptionItemProps](modules.md#descriptionitemprops)
+- [DescriptionProps](modules.md#descriptionprops)
+- [DrawerProps](modules.md#drawerprops)
+- [ExtendDescriptionItemProps](modules.md#extenddescriptionitemprops)
+- [ExtendDescriptionTypeProps](modules.md#extenddescriptiontypeprops)
+- [ExtendFormItemProps](modules.md#extendformitemprops)
+- [ExtendFormTypeProps](modules.md#extendformtypeprops)
+- [ExtendTableItemProps](modules.md#extendtableitemprops)
+- [ExtendTableTypeProps](modules.md#extendtabletypeprops)
+- [FaasItemProps](modules.md#faasitemprops)
+- [FaasItemType](modules.md#faasitemtype)
+- [FaasItemTypeValue](modules.md#faasitemtypevalue)
+- [FaasState](modules.md#faasstate)
+- [FormItemProps](modules.md#formitemprops)
+- [FormProps](modules.md#formprops)
+- [RoutesProps](modules.md#routesprops)
+- [TableItemProps](modules.md#tableitemprops)
+- [TableProps](modules.md#tableprops)
+- [TitleProps](modules.md#titleprops)
+
+### Functions
+
+- [Blank](modules.md#blank)
+- [Config](modules.md#config)
+- [Description](modules.md#description)
+- [Form](modules.md#form)
+- [FormItem](modules.md#formitem)
+- [Routes](modules.md#routes)
+- [Table](modules.md#table)
+- [Title](modules.md#title)
+- [transferOptions](modules.md#transferoptions)
+- [useDrawer](modules.md#usedrawer)
+- [useFaasState](modules.md#usefaasstate)
+
+## Type aliases
+
+### BaseItemProps
+
+Ƭ **BaseItemProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `id` | `string` |
+| `options?` | [`BaseOption`](modules.md#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`](modules.md#faasitemprops)
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### DescriptionProps
+
+Ƭ **DescriptionProps**<`T`, `ExtendItemProps`\>: { `dataSource?`: `T` ; `extendTypes?`: { [key: string]: [`ExtendDescriptionTypeProps`](modules.md#extenddescriptiontypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`DescriptionItemProps`](modules.md#descriptionitemprops) \| `ExtendItemProps`)[]  } & `DescriptionsProps`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+| `ExtendItemProps` | `any` |
+
+___
+
+### DrawerProps
+
+Ƭ **DrawerProps**: `AntdDrawerProps` & { `children?`: `JSX.Element` \| `JSX.Element`[]  }
+
+___
+
+### ExtendDescriptionItemProps
+
+Ƭ **ExtendDescriptionItemProps**: [`BaseItemProps`](modules.md#baseitemprops)
+
+___
+
+### ExtendDescriptionTypeProps
+
+Ƭ **ExtendDescriptionTypeProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `children?` | `JSX.Element` \| ``null`` |
+| `render?` | (`value`: `any`, `values`: `any`) => `string` \| `number` \| `boolean` \| `Element` |
+
+___
+
+### ExtendFormItemProps
+
+Ƭ **ExtendFormItemProps**: [`BaseItemProps`](modules.md#baseitemprops) & `AntdFormItemProps`
+
+___
+
+### ExtendFormTypeProps
+
+Ƭ **ExtendFormTypeProps**: `Object`
+
+#### Type declaration
+
+| Name | Type |
+| :------ | :------ |
+| `children?` | `JSX.Element` \| ``null`` |
+
+___
+
+### ExtendTableItemProps
+
+Ƭ **ExtendTableItemProps**<`T`\>: [`BaseItemProps`](modules.md#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`](modules.md#baseitemprops) & { `type?`: [`FaasItemType`](modules.md#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`](modules.md#extendformtypeprops);  } ; `label?`: `string` \| ``false`` ; `rules?`: `RuleObject`[] ; `render?`: () => `Element`  } & `FormItemInputProps`<`T`\> & [`FaasItemProps`](modules.md#faasitemprops) & `AntdFormItemProps`<`T`\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### FormProps
+
+Ƭ **FormProps**<`Values`, `ExtendItemProps`\>: { `extendTypes?`: { [type: string]: [`ExtendFormTypeProps`](modules.md#extendformtypeprops);  } ; `items?`: ([`FormItemProps`](modules.md#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`](modules.md#faasitemprops) & `Omit`<`AntdTableColumnProps`<`T`\>, ``"children"``\>
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+___
+
+### TableProps
+
+Ƭ **TableProps**<`T`, `ExtendTypes`\>: { `extendTypes?`: { [key: string]: [`ExtendTableTypeProps`](modules.md#extendtabletypeprops);  } ; `faasData?`: `FaasDataWrapperProps`<`T`\> ; `items`: ([`TableItemProps`](modules.md#tableitemprops) \| `ExtendTypes` & [`ExtendTableItemProps`](modules.md#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`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `options?` | [`BlankProps`](modules.md#blankprops) |
+
+#### Returns
+
+`any`
+
+___
+
+### Config
+
+▸ **Config**(`props`): `JSX.Element`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | `Object` |
+| `props.config` | `Partial`<[`FaasState`](modules.md#faasstate)\> |
+
+#### Returns
+
+`JSX.Element`
+
+___
+
+### Description
+
+▸ **Description**<`T`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`DescriptionProps`](modules.md#descriptionprops)<`T`, `any`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Form
+
+▸ **Form**<`Values`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `Values` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`FormProps`](modules.md#formprops)<`Values`, `any`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### FormItem
+
+▸ **FormItem**<`T`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`FormItemProps`](modules.md#formitemprops)<`T`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Routes
+
+▸ **Routes**(`props`): `Element`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`RoutesProps`](modules.md#routesprops) |
+
+#### Returns
+
+`Element`
+
+___
+
+### Table
+
+▸ **Table**<`T`, `ExtendTypes`\>(`props`): `Element`
+
+#### Type parameters
+
+| Name | Type |
+| :------ | :------ |
+| `T` | `any` |
+| `ExtendTypes` | `any` |
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`TableProps`](modules.md#tableprops)<`T`, `ExtendTypes`\> |
+
+#### Returns
+
+`Element`
+
+___
+
+### Title
+
+▸ **Title**(`props`): `JSX.Element`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `props` | [`TitleProps`](modules.md#titleprops) |
+
+#### Returns
+
+`JSX.Element`
+
+___
+
+### transferOptions
+
+▸ **transferOptions**(`options`): { `label`: `string` ; `value?`: `string` \| `number`  }[]
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `options` | [`BaseOption`](modules.md#baseoption)[] |
+
+#### Returns
+
+{ `label`: `string` ; `value?`: `string` \| `number`  }[]
+
+___
+
+### useDrawer
+
+▸ **useDrawer**(`init?`): `Object`
+
+#### Parameters
+
+| Name | Type |
+| :------ | :------ |
+| `init?` | [`DrawerProps`](modules.md#drawerprops) |
+
+#### Returns
+
+`Object`
+
+| Name | Type |
+| :------ | :------ |
+| `drawer` | `Element` |
+| `drawerProps` | [`DrawerProps`](modules.md#drawerprops) |
+| `setDrawerProps` | (`changes`: `Partial`<[`DrawerProps`](modules.md#drawerprops)\>) => `void` |
+
+___
+
+### useFaasState
+
+▸ `Const` **useFaasState**(): [[`FaasState`](modules.md#faasstate), (`state`: `IHookStateSetAction`<[`FaasState`](modules.md#faasstate)\>) => `void`]
+
+#### Returns
+
+[[`FaasState`](modules.md#faasstate), (`state`: `IHookStateSetAction`<[`FaasState`](modules.md#faasstate)\>) => `void`]

package/dist/index.d.ts

@@ -1,11 +1,12 @@
 import * as react_use_lib_misc_hookState from 'react-use/lib/misc/hookState';
-import { DescriptionsProps, DrawerProps as DrawerProps$1, FormItemProps as FormItemProps$1, InputProps, InputNumberProps, SwitchProps, SelectProps, FormProps as FormProps$1, TableColumnProps, TableProps as TableProps$1 } from 'antd';
+import { DescriptionsProps, DrawerProps as DrawerProps$1, FormItemProps as FormItemProps$1, InputProps, InputNumberProps, SwitchProps, SelectProps, FormProps as FormProps$1, TableColumnProps, TablePaginationConfig, TableProps as TableProps$1 } from 'antd';
 export { Drawer } from 'antd';
 import { FaasDataWrapperProps } from '@faasjs/react';
 import * as antd_lib_form_Form from 'antd/lib/form/Form';
 import { RuleObject } from 'rc-field-form/lib/interface';
 import { LazyExoticComponent, ComponentType } from 'react';
 import { RouteProps } from 'react-router-dom';
+import { FilterValue, SorterResult, TableCurrentDataSource } from 'antd/lib/table/interface';
 
 declare type BlankProps = {
     value?: any;
@@ -118,7 +119,7 @@ declare type BooleanProps = {
     input?: SwitchProps;
 };
 declare type OptionsProps = {
-    options: BaseOption[];
+    options?: BaseOption[];
     type?: 'string' | 'string[]' | 'number' | 'number[]';
     input?: SelectProps<any>;
 };
@@ -179,6 +180,12 @@ declare type TableProps<T = any, ExtendTypes = any> = {
         [key: string]: ExtendTableTypeProps;
     };
     faasData?: FaasDataWrapperProps<T>;
+    onChange?: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<T> | SorterResult<T>[], extra: TableCurrentDataSource<T>) => {
+        pagination: TablePaginationConfig;
+        filters: Record<string, FilterValue | null>;
+        sorter: SorterResult<T> | SorterResult<T>[];
+        extra: TableCurrentDataSource<T>;
+    };
 } & TableProps$1<T>;
 declare function Table<T = any, ExtendTypes = any>(props: TableProps<T, ExtendTypes>): JSX.Element;
 

package/dist/index.js

@@ -200,6 +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(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)
@@ -431,10 +434,11 @@ function Routes(props) {
     key: r.path
   }, r), {
     element: r.element || /* @__PURE__ */ import_react.default.createElement(import_react8.Suspense, {
-      fallback: props.fallback || /* @__PURE__ */ import_react.default.createElement(import_antd6.Skeleton, {
-        active: true,
+      fallback: props.fallback || /* @__PURE__ */ import_react.default.createElement("div", {
         style: { padding: "24px" }
-      })
+      }, /* @__PURE__ */ import_react.default.createElement(import_antd6.Skeleton, {
+        active: true
+      }))
     }, /* @__PURE__ */ import_react.default.createElement(r.page, null))
   }))), /* @__PURE__ */ import_react.default.createElement(import_react_router_dom.Route, {
     key: "*",
@@ -591,6 +595,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(import_antd7.Skeleton, {
+      active: true
+    }),
     render: ({
       data,
       params,
@@ -613,7 +620,16 @@ function Table(props) {
         columns,
         dataSource: data.rows,
         pagination: __spreadValues(__spreadValues({}, props.pagination), data.pagination),
-        onChange: (pagination, filters, sorter) => {
+        onChange: (pagination, filters, sorter, extra) => {
+          if (props.onChange) {
+            const processed = props.onChange(pagination, filters, sorter, extra);
+            reload(__spreadProps(__spreadValues({}, params), {
+              pagination: processed.pagination,
+              filters: processed.filters,
+              sorter: processed.sorter
+            }));
+            return;
+          }
           reload(__spreadProps(__spreadValues({}, params), {
             pagination,
             filters,

package/dist/index.mjs

@@ -78,7 +78,10 @@ function transferOptions(options) {
 
 // src/Description.tsx
 import { CheckOutlined, CloseOutlined } from "@ant-design/icons";
-import { Descriptions } from "antd";
+import {
+  Descriptions,
+  Skeleton
+} from "antd";
 import { upperFirst as upperFirst2 } from "lodash";
 import {
   cloneElement,
@@ -162,6 +165,9 @@ function Description(props) {
       extendTypes: props.extendTypes
     }))));
   return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadValues({
+    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)
@@ -390,7 +396,7 @@ Form.useForm = AntdForm2.useForm;
 Form.Item = FormItem;
 
 // src/Routers.tsx
-import { Result, Skeleton } from "antd";
+import { Result, Skeleton as Skeleton2 } from "antd";
 import {
   Suspense
 } from "react";
@@ -410,10 +416,11 @@ function Routes(props) {
     key: r.path
   }, r), {
     element: r.element || /* @__PURE__ */ React.createElement(Suspense, {
-      fallback: props.fallback || /* @__PURE__ */ React.createElement(Skeleton, {
-        active: true,
+      fallback: props.fallback || /* @__PURE__ */ React.createElement("div", {
         style: { padding: "24px" }
-      })
+      }, /* @__PURE__ */ React.createElement(Skeleton2, {
+        active: true
+      }))
     }, /* @__PURE__ */ React.createElement(r.page, null))
   }))), /* @__PURE__ */ React.createElement(Route, {
     key: "*",
@@ -430,7 +437,8 @@ import {
 } from "react";
 import {
   Table as AntdTable,
-  Radio
+  Radio,
+  Skeleton as Skeleton3
 } from "antd";
 import { CheckOutlined as CheckOutlined2, CloseOutlined as CloseOutlined2 } from "@ant-design/icons";
 import { isNil as isNil2, upperFirst as upperFirst4 } from "lodash";
@@ -577,6 +585,9 @@ function Table(props) {
       dataSource: props.dataSource
     }));
   return /* @__PURE__ */ React.createElement(FaasDataWrapper2, __spreadValues({
+    fallback: props.faasData.fallback || /* @__PURE__ */ React.createElement(Skeleton3, {
+      active: true
+    }),
     render: ({
       data,
       params,
@@ -599,7 +610,16 @@ function Table(props) {
         columns,
         dataSource: data.rows,
         pagination: __spreadValues(__spreadValues({}, props.pagination), data.pagination),
-        onChange: (pagination, filters, sorter) => {
+        onChange: (pagination, filters, sorter, extra) => {
+          if (props.onChange) {
+            const processed = props.onChange(pagination, filters, sorter, extra);
+            reload(__spreadProps(__spreadValues({}, params), {
+              pagination: processed.pagination,
+              filters: processed.filters,
+              sorter: processed.sorter
+            }));
+            return;
+          }
           reload(__spreadProps(__spreadValues({}, params), {
             pagination,
             filters,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/ant-design",
-  "version": "0.0.2-beta.358",
+  "version": "0.0.2-beta.362",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -28,7 +28,7 @@
     "lodash": "*",
     "react": "*",
     "react-dom": "*",
-    "@faasjs/react": "^0.0.2-beta.358",
+    "@faasjs/react": "^0.0.2-beta.362",
     "react-use": "*",
     "react-router-dom": "*"
   },