@faasjs/ant-design 0.0.2-beta.347 → 0.0.2-beta.351

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.d.ts +35 -16
  2. package/dist/index.js +113 -60
  3. package/dist/index.mjs +77 -26
  4. package/package.json +2 -2
package/dist/index.d.ts CHANGED
@@ -1,4 +1,6 @@
1
- import { DescriptionsProps, FormItemProps as FormItemProps$1, InputProps, InputNumberProps, SwitchProps, SelectProps, FormProps as FormProps$1, TableColumnProps, TableProps as TableProps$1 } from 'antd';
1
+ 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';
2
+ export { Drawer } from 'antd';
3
+ import { Dispatch, SetStateAction } from 'react';
2
4
  import * as antd_lib_form_Form from 'antd/lib/form/Form';
3
5
  import { RuleObject } from 'rc-field-form/lib/interface';
4
6
 
@@ -36,6 +38,20 @@ declare function transferOptions(options: BaseOption[]): {
36
38
  value?: string | number;
37
39
  }[];
38
40
 
41
+ declare type FaasDataWrapperProps<T = any> = {
42
+ dataSource?: T;
43
+ faasData?: {
44
+ action: string;
45
+ params?: Record<string, any>;
46
+ data?: T;
47
+ setData?: Dispatch<SetStateAction<T>>;
48
+ };
49
+ render: (args: {
50
+ data: T;
51
+ }) => JSX.Element;
52
+ fallback?: JSX.Element;
53
+ };
54
+
39
55
  declare type ExtendDescriptionTypeProps = {
40
56
  children?: JSX.Element | null;
41
57
  render?: (value: any, values: any) => JSX.Element | string | number | boolean | null;
@@ -47,16 +63,20 @@ declare type DescriptionItemProps<T = any> = {
47
63
  } & FaasItemProps;
48
64
  declare type DescriptionProps<T = any, ExtendItemProps = any> = {
49
65
  items: (DescriptionItemProps | ExtendItemProps)[];
50
- dataSource?: T;
51
- faasData?: {
52
- action: string;
53
- params?: Record<string, any>;
54
- };
55
66
  extendTypes?: {
56
67
  [key: string]: ExtendDescriptionTypeProps;
57
68
  };
58
- } & DescriptionsProps;
59
- declare function Description(props: DescriptionProps): JSX.Element;
69
+ } & FaasDataWrapperProps<T> & DescriptionsProps;
70
+ declare function Description<T = any>(props: DescriptionProps<T>): JSX.Element;
71
+
72
+ declare type DrawerProps = DrawerProps$1 & {
73
+ children?: JSX.Element | JSX.Element[];
74
+ };
75
+ declare function useDrawer(init?: DrawerProps): {
76
+ drawer: JSX.Element;
77
+ drawerProps: DrawerProps;
78
+ setDrawerProps(changes: Partial<DrawerProps>): void;
79
+ };
60
80
 
61
81
  declare type StringProps = {
62
82
  type?: 'string';
@@ -91,7 +111,7 @@ declare type ExtendFormTypeProps = {
91
111
  };
92
112
  declare type ExtendFormItemProps = BaseItemProps & FormItemProps$1;
93
113
  declare type FormItemProps<T = any> = {
94
- children?: JSX.Element;
114
+ children?: JSX.Element | null;
95
115
  rules?: RuleObject[];
96
116
  label?: string | false;
97
117
  extendTypes?: {
@@ -117,7 +137,10 @@ declare namespace Form {
117
137
  var Item: typeof FormItem;
118
138
  }
119
139
 
120
- declare type TableItemProps<T = any> = FaasItemProps & TableColumnProps<T>;
140
+ declare type TableItemProps<T = any> = {
141
+ /** @deprecated use render */
142
+ children?: JSX.Element | null;
143
+ } & FaasItemProps & TableColumnProps<T>;
121
144
  declare type ExtendTableTypeProps = {
122
145
  children?: JSX.Element | null;
123
146
  render?: (value: any, values: any) => JSX.Element | string | number | boolean | null;
@@ -128,11 +151,7 @@ declare type TableProps<T = any, ExtendTypes = any> = {
128
151
  extendTypes?: {
129
152
  [key: string]: ExtendTableTypeProps;
130
153
  };
131
- faasData?: {
132
- action: string;
133
- params?: Record<string, any>;
134
- };
135
- } & TableProps$1<T>;
154
+ } & FaasDataWrapperProps<T> & TableProps$1<T>;
136
155
  declare function Table<T = any, ExtendTypes = any>(props: TableProps<T, ExtendTypes>): JSX.Element;
137
156
 
138
- export { BaseItemProps, BaseOption, Blank, Description, DescriptionItemProps, DescriptionProps, ExtendDescriptionItemProps, ExtendDescriptionTypeProps, ExtendFormItemProps, ExtendFormTypeProps, ExtendTableItemProps, ExtendTableTypeProps, FaasItemProps, FaasItemType, FaasItemTypeValue, Form, FormItem, FormItemProps, FormProps, Table, TableItemProps, TableProps, transferOptions };
157
+ export { BaseItemProps, BaseOption, Blank, Description, DescriptionItemProps, DescriptionProps, DrawerProps, ExtendDescriptionItemProps, ExtendDescriptionTypeProps, ExtendFormItemProps, ExtendFormTypeProps, ExtendTableItemProps, ExtendTableTypeProps, FaasItemProps, FaasItemType, FaasItemTypeValue, Form, FormItem, FormItemProps, FormProps, Table, TableItemProps, TableProps, transferOptions, useDrawer };
package/dist/index.js CHANGED
@@ -48,10 +48,12 @@ var src_exports = {};
48
48
  __export(src_exports, {
49
49
  Blank: () => Blank,
50
50
  Description: () => Description,
51
+ Drawer: () => import_antd3.Drawer,
51
52
  Form: () => Form,
52
53
  FormItem: () => FormItem,
53
54
  Table: () => Table,
54
- transferOptions: () => transferOptions
55
+ transferOptions: () => transferOptions,
56
+ useDrawer: () => useDrawer
55
57
  });
56
58
 
57
59
  // react-shim.js
@@ -85,7 +87,7 @@ var import_antd2 = require("antd");
85
87
  var import_lodash3 = require("lodash");
86
88
  var import_react4 = require("react");
87
89
 
88
- // src/FaasWrapper.tsx
90
+ // src/FaasDataWrapper.tsx
89
91
  var import_react2 = require("react");
90
92
  var import_react3 = require("@faasjs/react");
91
93
  function FaasDataWrapper({
@@ -98,13 +100,18 @@ function FaasDataWrapper({
98
100
  (0, import_react2.useEffect)(() => {
99
101
  if (!faasData)
100
102
  return;
101
- (0, import_react3.getClient)().faas(faasData.action, faasData.action).then((res) => setData(res.data));
102
- }, [JSON.stringify(faasData)]);
103
+ (0, import_react3.getClient)().faas(faasData.action, faasData.params).then((res) => {
104
+ if (faasData.setData)
105
+ faasData.setData(res.data);
106
+ else
107
+ setData(res.data);
108
+ });
109
+ }, [JSON.stringify([faasData == null ? void 0 : faasData.action, faasData == null ? void 0 : faasData.params])]);
103
110
  if (dataSource)
104
111
  return render({ data: dataSource });
105
- if (!data)
112
+ if (!data && !faasData.data)
106
113
  return fallback || null;
107
- return render({ data });
114
+ return render({ data: faasData.data || data });
108
115
  }
109
116
 
110
117
  // src/Description.tsx
@@ -173,9 +180,7 @@ function DescriptionItemContent(props) {
173
180
  }
174
181
  }
175
182
  function Description(props) {
176
- return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, {
177
- dataSource: props.dataSource,
178
- faasData: props.faasData,
183
+ return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, __spreadProps(__spreadValues({}, props), {
179
184
  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, {
180
185
  key: item.id,
181
186
  label: item.title || (0, import_lodash3.upperFirst)(item.id)
@@ -185,20 +190,40 @@ function Description(props) {
185
190
  values: data,
186
191
  extendTypes: props.extendTypes
187
192
  }))))
188
- });
193
+ }));
194
+ }
195
+
196
+ // src/Drawer.tsx
197
+ var import_antd3 = require("antd");
198
+ var import_react5 = require("react");
199
+ function useDrawer(init) {
200
+ const [props, setProps] = (0, import_react5.useState)(__spreadValues({
201
+ visible: false,
202
+ onClose: () => setProps((prev) => __spreadProps(__spreadValues({}, prev), {
203
+ visible: false
204
+ }))
205
+ }, init));
206
+ return {
207
+ drawer: /* @__PURE__ */ import_react.default.createElement(import_antd3.Drawer, __spreadValues({}, props)),
208
+ drawerProps: props,
209
+ setDrawerProps(changes) {
210
+ setProps((prev) => __spreadValues(__spreadValues({}, prev), changes));
211
+ }
212
+ };
189
213
  }
190
214
 
191
215
  // src/Form.tsx
192
- var import_antd4 = require("antd");
216
+ var import_antd5 = require("antd");
217
+ var import_react7 = require("react");
193
218
 
194
219
  // src/FormItem.tsx
195
- var import_antd3 = require("antd");
220
+ var import_antd4 = require("antd");
196
221
  var import_icons2 = require("@ant-design/icons");
197
- var import_react5 = require("react");
222
+ var import_react6 = require("react");
198
223
  var import_lodash4 = require("lodash");
199
224
  function FormItem(props) {
200
- const [computedProps, setComputedProps] = (0, import_react5.useState)();
201
- (0, import_react5.useEffect)(() => {
225
+ const [computedProps, setComputedProps] = (0, import_react6.useState)();
226
+ (0, import_react6.useEffect)(() => {
202
227
  const propsCopy = __spreadValues({}, props);
203
228
  if (!propsCopy.title)
204
229
  propsCopy.title = (0, import_lodash4.upperFirst)(propsCopy.id);
@@ -239,58 +264,58 @@ function FormItem(props) {
239
264
  if (!computedProps)
240
265
  return null;
241
266
  if (computedProps.extendTypes && computedProps.extendTypes[computedProps.type])
242
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), computedProps.extendTypes[computedProps.type].children);
267
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.extendTypes[computedProps.type].children);
243
268
  if (computedProps.children)
244
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), computedProps.children);
269
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.children);
245
270
  switch (computedProps.type) {
246
271
  case "string":
247
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), computedProps.options ? /* @__PURE__ */ import_react.default.createElement(import_antd3.Select, __spreadValues({}, computedProps.input)) : /* @__PURE__ */ import_react.default.createElement(import_antd3.Input, __spreadValues({}, computedProps.input)));
272
+ 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.Input, __spreadValues({}, computedProps.input)));
248
273
  case "string[]":
249
274
  if (computedProps.options)
250
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd3.Select, __spreadValues({
275
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd4.Select, __spreadValues({
251
276
  mode: "multiple"
252
277
  }, computedProps.input)));
253
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.List, {
278
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.List, {
254
279
  name: computedProps.name,
255
280
  rules: computedProps.rules
256
281
  }, (fields, { add, remove }, { errors }) => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, computedProps.label && /* @__PURE__ */ import_react.default.createElement("div", {
257
282
  className: "ant-form-item-label"
258
283
  }, /* @__PURE__ */ import_react.default.createElement("label", {
259
284
  className: computedProps.rules.find((r) => r.required) && "ant-form-item-required"
260
- }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, {
285
+ }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
261
286
  key: field.key
262
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Row, {
287
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
263
288
  gutter: 24
264
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Col, {
289
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
265
290
  span: 23
266
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadProps(__spreadValues({}, field), {
291
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
267
292
  noStyle: true
268
- }), /* @__PURE__ */ import_react.default.createElement(import_antd3.Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd3.Col, {
293
+ }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Input, __spreadValues({}, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
269
294
  span: 1
270
- }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd3.Button, {
295
+ }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
271
296
  danger: true,
272
297
  type: "link",
273
298
  style: { float: "right" },
274
299
  icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
275
300
  onClick: () => remove(field.name)
276
- }))))), /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd3.Button, {
301
+ }))))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
277
302
  type: "dashed",
278
303
  block: true,
279
304
  onClick: () => add(),
280
305
  icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.PlusOutlined, null)
281
- }), /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.ErrorList, {
306
+ }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.ErrorList, {
282
307
  errors
283
308
  }))));
284
309
  case "number":
285
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), computedProps.options ? /* @__PURE__ */ import_react.default.createElement(import_antd3.Select, __spreadValues({}, computedProps.input)) : /* @__PURE__ */ import_react.default.createElement(import_antd3.InputNumber, __spreadValues({
310
+ 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({
286
311
  style: { width: "100%" }
287
312
  }, computedProps.input)));
288
313
  case "number[]":
289
314
  if (computedProps.options)
290
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd3.Select, __spreadValues({
315
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd4.Select, __spreadValues({
291
316
  mode: "multiple"
292
317
  }, computedProps.input)));
293
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.List, {
318
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.List, {
294
319
  name: computedProps.name,
295
320
  rules: computedProps.rules
296
321
  }, (fields, { add, remove }, { errors }) => {
@@ -299,35 +324,35 @@ function FormItem(props) {
299
324
  className: "ant-form-item-label"
300
325
  }, /* @__PURE__ */ import_react.default.createElement("label", {
301
326
  className: ((_a2 = computedProps.rules) == null ? void 0 : _a2.find((r) => r.required)) && "ant-form-item-required"
302
- }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, {
327
+ }, computedProps.label)), fields.map((field) => /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, {
303
328
  key: field.key
304
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Row, {
329
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Row, {
305
330
  gutter: 24
306
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Col, {
331
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
307
332
  span: 23
308
- }, /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadProps(__spreadValues({}, field), {
333
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadProps(__spreadValues({}, field), {
309
334
  noStyle: true
310
- }), /* @__PURE__ */ import_react.default.createElement(import_antd3.InputNumber, __spreadValues({
335
+ }), /* @__PURE__ */ import_react.default.createElement(import_antd4.InputNumber, __spreadValues({
311
336
  style: { width: "100%" }
312
- }, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd3.Col, {
337
+ }, computedProps.input)))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Col, {
313
338
  span: 1
314
- }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd3.Button, {
339
+ }, (!computedProps.rules.find((r) => r.required) || field.key > 0) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
315
340
  danger: true,
316
341
  type: "link",
317
342
  style: { float: "right" },
318
343
  icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.MinusCircleOutlined, null),
319
344
  onClick: () => remove(field.name)
320
- }))))), /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd3.Button, {
345
+ }))))), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, null, (!computedProps.maxCount || computedProps.maxCount > fields.length) && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
321
346
  type: "dashed",
322
347
  block: true,
323
348
  onClick: () => add(),
324
349
  icon: /* @__PURE__ */ import_react.default.createElement(import_icons2.PlusOutlined, null)
325
- }), /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.ErrorList, {
350
+ }), /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.ErrorList, {
326
351
  errors
327
352
  })));
328
353
  });
329
354
  case "boolean":
330
- return /* @__PURE__ */ import_react.default.createElement(import_antd3.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd3.Switch, __spreadValues({}, computedProps.input)));
355
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), /* @__PURE__ */ import_react.default.createElement(import_antd4.Switch, __spreadValues({}, computedProps.input)));
331
356
  default:
332
357
  return null;
333
358
  }
@@ -336,21 +361,39 @@ function FormItem(props) {
336
361
  // src/Form.tsx
337
362
  function Form(props) {
338
363
  var _a2, _b;
339
- return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form, __spreadValues({}, props), (_a2 = props.items) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ import_react.default.createElement(FormItem, __spreadProps(__spreadValues({
364
+ const [loading, setLoading] = (0, import_react7.useState)(false);
365
+ const [computedProps, setComputedProps] = (0, import_react7.useState)();
366
+ (0, import_react7.useEffect)(() => {
367
+ const propsCopy = __spreadValues({}, props);
368
+ if (propsCopy.onFinish) {
369
+ propsCopy.onFinish = async (values) => {
370
+ setLoading(true);
371
+ try {
372
+ await propsCopy.onFinish(values);
373
+ } catch (error) {
374
+ console.error(error);
375
+ }
376
+ setLoading(false);
377
+ };
378
+ }
379
+ setComputedProps(props);
380
+ }, []);
381
+ return /* @__PURE__ */ import_react.default.createElement(import_antd5.Form, __spreadValues({}, computedProps), (_a2 = props.items) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ import_react.default.createElement(FormItem, __spreadProps(__spreadValues({
340
382
  key: item.id
341
383
  }, item), {
342
384
  extendTypes: props.extendTypes
343
- }))), props.children, props.submit !== false && /* @__PURE__ */ import_react.default.createElement(import_antd4.Button, {
385
+ }))), props.children, props.submit !== false && /* @__PURE__ */ import_react.default.createElement(import_antd5.Button, {
344
386
  htmlType: "submit",
345
- type: "primary"
387
+ type: "primary",
388
+ loading
346
389
  }, ((_b = props.submit) == null ? void 0 : _b.text) || "Submit"));
347
390
  }
348
- Form.useForm = import_antd4.Form.useForm;
391
+ Form.useForm = import_antd5.Form.useForm;
349
392
  Form.Item = FormItem;
350
393
 
351
394
  // src/Table.tsx
352
- var import_react6 = require("react");
353
- var import_antd5 = require("antd");
395
+ var import_react8 = require("react");
396
+ var import_antd6 = require("antd");
354
397
  var import_icons3 = require("@ant-design/icons");
355
398
  var import_lodash5 = require("lodash");
356
399
  function processValue(item, value) {
@@ -367,8 +410,8 @@ function processValue(item, value) {
367
410
  return value;
368
411
  }
369
412
  function Table(props) {
370
- const [columns, setColumns] = (0, import_react6.useState)();
371
- (0, import_react6.useEffect)(() => {
413
+ const [columns, setColumns] = (0, import_react8.useState)();
414
+ (0, import_react8.useEffect)(() => {
372
415
  var _a2;
373
416
  for (const item of props.items) {
374
417
  if (!item.key)
@@ -388,9 +431,11 @@ function Table(props) {
388
431
  }
389
432
  if (item.render)
390
433
  continue;
434
+ if (item.children)
435
+ delete item.children;
391
436
  if (props.extendTypes && props.extendTypes[item.type]) {
392
437
  if (props.extendTypes[item.type].children) {
393
- item.render = (value, values) => (0, import_react6.cloneElement)(props.extendTypes[item.type].children, {
438
+ item.render = (value, values) => (0, import_react8.cloneElement)(props.extendTypes[item.type].children, {
394
439
  value,
395
440
  values
396
441
  });
@@ -403,14 +448,20 @@ function Table(props) {
403
448
  switch (item.type) {
404
449
  case "string[]":
405
450
  item.render = (value) => processValue(item, value).join(", ");
451
+ if (!item.onFilter)
452
+ item.onFilter = (value, row) => row[item.id].includes(value);
406
453
  break;
407
454
  case "number":
408
455
  item.render = (value) => processValue(item, value);
409
456
  if (!item.sorter)
410
457
  item.sorter = (a, b) => a[item.id] - b[item.id];
458
+ if (!item.onFilter)
459
+ item.onFilter = (value, row) => value === row[item.id];
411
460
  break;
412
461
  case "number[]":
413
462
  item.render = (value) => processValue(item, value).join(", ");
463
+ if (!item.onFilter)
464
+ item.onFilter = (value, row) => row[item.id].includes(value);
414
465
  break;
415
466
  case "boolean":
416
467
  item.render = (value) => typeof value === "undefined" ? /* @__PURE__ */ import_react.default.createElement(Blank, null) : value ? /* @__PURE__ */ import_react.default.createElement(import_icons3.CheckOutlined, {
@@ -431,7 +482,7 @@ function Table(props) {
431
482
  confirm
432
483
  }) => {
433
484
  var _a3, _b;
434
- return /* @__PURE__ */ import_react.default.createElement(import_antd5.Radio.Group, {
485
+ return /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Group, {
435
486
  style: { padding: 8 },
436
487
  buttonStyle: "solid",
437
488
  value: selectedKeys[0],
@@ -439,21 +490,21 @@ function Table(props) {
439
490
  setSelectedKeys(e.target.value ? [e.target.value] : []);
440
491
  confirm();
441
492
  }
442
- }, /* @__PURE__ */ import_react.default.createElement(import_antd5.Radio.Button, null, ((_a3 = navigator.language) == null ? void 0 : _a3.includes("CN")) ? "\u5168\u90E8" : "All"), /* @__PURE__ */ import_react.default.createElement(import_antd5.Radio.Button, {
493
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, null, ((_a3 = navigator.language) == null ? void 0 : _a3.includes("CN")) ? "\u5168\u90E8" : "All"), /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, {
443
494
  value: "true"
444
495
  }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CheckOutlined, {
445
496
  style: {
446
497
  color: "#52c41a",
447
498
  verticalAlign: "middle"
448
499
  }
449
- })), /* @__PURE__ */ import_react.default.createElement(import_antd5.Radio.Button, {
500
+ })), /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, {
450
501
  value: "false"
451
502
  }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CloseOutlined, {
452
503
  style: {
453
504
  verticalAlign: "middle",
454
505
  color: "#ff4d4f"
455
506
  }
456
- })), /* @__PURE__ */ import_react.default.createElement(import_antd5.Radio.Button, {
507
+ })), /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, {
457
508
  value: "empty"
458
509
  }, ((_b = navigator.language) == null ? void 0 : _b.includes("CN")) ? "\u7A7A" : "Empty"));
459
510
  };
@@ -473,6 +524,8 @@ function Table(props) {
473
524
  break;
474
525
  default:
475
526
  item.render = (value) => processValue(item, value);
527
+ if (!item.onFilter)
528
+ item.onFilter = (value, row) => value === row[item.id];
476
529
  break;
477
530
  }
478
531
  }
@@ -480,23 +533,23 @@ function Table(props) {
480
533
  }, [props.items]);
481
534
  if (!columns)
482
535
  return null;
483
- return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, {
484
- dataSource: props.dataSource,
485
- faasData: props.faasData,
486
- render: ({ data }) => /* @__PURE__ */ import_react.default.createElement(import_antd5.Table, __spreadProps(__spreadValues({}, props), {
536
+ return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, __spreadValues({
537
+ render: ({ data }) => /* @__PURE__ */ import_react.default.createElement(import_antd6.Table, __spreadProps(__spreadValues({}, props), {
487
538
  rowKey: props.rowKey || "id",
488
539
  columns,
489
540
  dataSource: data
490
541
  }))
491
- });
542
+ }, props));
492
543
  }
493
544
  module.exports = __toCommonJS(src_exports);
494
545
  // Annotate the CommonJS export names for ESM import in node:
495
546
  0 && (module.exports = {
496
547
  Blank,
497
548
  Description,
549
+ Drawer,
498
550
  Form,
499
551
  FormItem,
500
552
  Table,
501
- transferOptions
553
+ transferOptions,
554
+ useDrawer
502
555
  });
package/dist/index.mjs CHANGED
@@ -53,8 +53,11 @@ import {
53
53
  useState as useState2
54
54
  } from "react";
55
55
 
56
- // src/FaasWrapper.tsx
57
- import { useEffect, useState } from "react";
56
+ // src/FaasDataWrapper.tsx
57
+ import {
58
+ useEffect,
59
+ useState
60
+ } from "react";
58
61
  import { getClient } from "@faasjs/react";
59
62
  function FaasDataWrapper({
60
63
  dataSource,
@@ -66,13 +69,18 @@ function FaasDataWrapper({
66
69
  useEffect(() => {
67
70
  if (!faasData)
68
71
  return;
69
- getClient().faas(faasData.action, faasData.action).then((res) => setData(res.data));
70
- }, [JSON.stringify(faasData)]);
72
+ getClient().faas(faasData.action, faasData.params).then((res) => {
73
+ if (faasData.setData)
74
+ faasData.setData(res.data);
75
+ else
76
+ setData(res.data);
77
+ });
78
+ }, [JSON.stringify([faasData == null ? void 0 : faasData.action, faasData == null ? void 0 : faasData.params])]);
71
79
  if (dataSource)
72
80
  return render({ data: dataSource });
73
- if (!data)
81
+ if (!data && !faasData.data)
74
82
  return fallback || null;
75
- return render({ data });
83
+ return render({ data: faasData.data || data });
76
84
  }
77
85
 
78
86
  // src/Description.tsx
@@ -141,9 +149,7 @@ function DescriptionItemContent(props) {
141
149
  }
142
150
  }
143
151
  function Description(props) {
144
- return /* @__PURE__ */ React.createElement(FaasDataWrapper, {
145
- dataSource: props.dataSource,
146
- faasData: props.faasData,
152
+ return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadProps(__spreadValues({}, props), {
147
153
  render: ({ data }) => /* @__PURE__ */ React.createElement(Descriptions, __spreadValues({}, props), props.items.map((item) => /* @__PURE__ */ React.createElement(Descriptions.Item, {
148
154
  key: item.id,
149
155
  label: item.title || upperFirst2(item.id)
@@ -153,7 +159,26 @@ function Description(props) {
153
159
  values: data,
154
160
  extendTypes: props.extendTypes
155
161
  }))))
156
- });
162
+ }));
163
+ }
164
+
165
+ // src/Drawer.tsx
166
+ import { Drawer } from "antd";
167
+ import { useState as useState3 } from "react";
168
+ function useDrawer(init) {
169
+ const [props, setProps] = useState3(__spreadValues({
170
+ visible: false,
171
+ onClose: () => setProps((prev) => __spreadProps(__spreadValues({}, prev), {
172
+ visible: false
173
+ }))
174
+ }, init));
175
+ return {
176
+ drawer: /* @__PURE__ */ React.createElement(Drawer, __spreadValues({}, props)),
177
+ drawerProps: props,
178
+ setDrawerProps(changes) {
179
+ setProps((prev) => __spreadValues(__spreadValues({}, prev), changes));
180
+ }
181
+ };
157
182
  }
158
183
 
159
184
  // src/Form.tsx
@@ -161,6 +186,7 @@ import {
161
186
  Button as Button2,
162
187
  Form as AntdForm2
163
188
  } from "antd";
189
+ import { useEffect as useEffect4, useState as useState5 } from "react";
164
190
 
165
191
  // src/FormItem.tsx
166
192
  import {
@@ -174,13 +200,10 @@ import {
174
200
  Select
175
201
  } from "antd";
176
202
  import { MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
177
- import {
178
- useEffect as useEffect3,
179
- useState as useState3
180
- } from "react";
203
+ import { useEffect as useEffect3, useState as useState4 } from "react";
181
204
  import { upperFirst as upperFirst3 } from "lodash";
182
205
  function FormItem(props) {
183
- const [computedProps, setComputedProps] = useState3();
206
+ const [computedProps, setComputedProps] = useState4();
184
207
  useEffect3(() => {
185
208
  const propsCopy = __spreadValues({}, props);
186
209
  if (!propsCopy.title)
@@ -319,13 +342,31 @@ function FormItem(props) {
319
342
  // src/Form.tsx
320
343
  function Form(props) {
321
344
  var _a2, _b;
322
- return /* @__PURE__ */ React.createElement(AntdForm2, __spreadValues({}, props), (_a2 = props.items) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ React.createElement(FormItem, __spreadProps(__spreadValues({
345
+ const [loading, setLoading] = useState5(false);
346
+ const [computedProps, setComputedProps] = useState5();
347
+ useEffect4(() => {
348
+ const propsCopy = __spreadValues({}, props);
349
+ if (propsCopy.onFinish) {
350
+ propsCopy.onFinish = async (values) => {
351
+ setLoading(true);
352
+ try {
353
+ await propsCopy.onFinish(values);
354
+ } catch (error) {
355
+ console.error(error);
356
+ }
357
+ setLoading(false);
358
+ };
359
+ }
360
+ setComputedProps(props);
361
+ }, []);
362
+ return /* @__PURE__ */ React.createElement(AntdForm2, __spreadValues({}, computedProps), (_a2 = props.items) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ React.createElement(FormItem, __spreadProps(__spreadValues({
323
363
  key: item.id
324
364
  }, item), {
325
365
  extendTypes: props.extendTypes
326
366
  }))), props.children, props.submit !== false && /* @__PURE__ */ React.createElement(Button2, {
327
367
  htmlType: "submit",
328
- type: "primary"
368
+ type: "primary",
369
+ loading
329
370
  }, ((_b = props.submit) == null ? void 0 : _b.text) || "Submit"));
330
371
  }
331
372
  Form.useForm = AntdForm2.useForm;
@@ -333,8 +374,8 @@ Form.Item = FormItem;
333
374
 
334
375
  // src/Table.tsx
335
376
  import {
336
- useState as useState4,
337
- useEffect as useEffect4,
377
+ useState as useState6,
378
+ useEffect as useEffect5,
338
379
  cloneElement as cloneElement2
339
380
  } from "react";
340
381
  import {
@@ -357,8 +398,8 @@ function processValue(item, value) {
357
398
  return value;
358
399
  }
359
400
  function Table(props) {
360
- const [columns, setColumns] = useState4();
361
- useEffect4(() => {
401
+ const [columns, setColumns] = useState6();
402
+ useEffect5(() => {
362
403
  var _a2;
363
404
  for (const item of props.items) {
364
405
  if (!item.key)
@@ -378,6 +419,8 @@ function Table(props) {
378
419
  }
379
420
  if (item.render)
380
421
  continue;
422
+ if (item.children)
423
+ delete item.children;
381
424
  if (props.extendTypes && props.extendTypes[item.type]) {
382
425
  if (props.extendTypes[item.type].children) {
383
426
  item.render = (value, values) => cloneElement2(props.extendTypes[item.type].children, {
@@ -393,14 +436,20 @@ function Table(props) {
393
436
  switch (item.type) {
394
437
  case "string[]":
395
438
  item.render = (value) => processValue(item, value).join(", ");
439
+ if (!item.onFilter)
440
+ item.onFilter = (value, row) => row[item.id].includes(value);
396
441
  break;
397
442
  case "number":
398
443
  item.render = (value) => processValue(item, value);
399
444
  if (!item.sorter)
400
445
  item.sorter = (a, b) => a[item.id] - b[item.id];
446
+ if (!item.onFilter)
447
+ item.onFilter = (value, row) => value === row[item.id];
401
448
  break;
402
449
  case "number[]":
403
450
  item.render = (value) => processValue(item, value).join(", ");
451
+ if (!item.onFilter)
452
+ item.onFilter = (value, row) => row[item.id].includes(value);
404
453
  break;
405
454
  case "boolean":
406
455
  item.render = (value) => typeof value === "undefined" ? /* @__PURE__ */ React.createElement(Blank, null) : value ? /* @__PURE__ */ React.createElement(CheckOutlined2, {
@@ -463,6 +512,8 @@ function Table(props) {
463
512
  break;
464
513
  default:
465
514
  item.render = (value) => processValue(item, value);
515
+ if (!item.onFilter)
516
+ item.onFilter = (value, row) => value === row[item.id];
466
517
  break;
467
518
  }
468
519
  }
@@ -470,21 +521,21 @@ function Table(props) {
470
521
  }, [props.items]);
471
522
  if (!columns)
472
523
  return null;
473
- return /* @__PURE__ */ React.createElement(FaasDataWrapper, {
474
- dataSource: props.dataSource,
475
- faasData: props.faasData,
524
+ return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadValues({
476
525
  render: ({ data }) => /* @__PURE__ */ React.createElement(AntdTable, __spreadProps(__spreadValues({}, props), {
477
526
  rowKey: props.rowKey || "id",
478
527
  columns,
479
528
  dataSource: data
480
529
  }))
481
- });
530
+ }, props));
482
531
  }
483
532
  export {
484
533
  Blank,
485
534
  Description,
535
+ Drawer,
486
536
  Form,
487
537
  FormItem,
488
538
  Table,
489
- transferOptions
539
+ transferOptions,
540
+ useDrawer
490
541
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@faasjs/ant-design",
3
- "version": "0.0.2-beta.347",
3
+ "version": "0.0.2-beta.351",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -27,7 +27,7 @@
27
27
  "lodash": "*",
28
28
  "react": "*",
29
29
  "react-dom": "*",
30
- "@faasjs/react": "^0.0.2-beta.347"
30
+ "@faasjs/react": "^0.0.2-beta.351"
31
31
  },
32
32
  "devDependencies": {
33
33
  "@types/lodash": "*",