@faasjs/ant-design 0.0.2-beta.349 → 0.0.2-beta.353

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.
package/dist/index.d.ts CHANGED
@@ -1,12 +1,40 @@
1
+ import * as react_use_lib_misc_hookState from 'react-use/lib/misc/hookState';
1
2
  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
3
  export { Drawer } from 'antd';
4
+ import { Dispatch, SetStateAction, LazyExoticComponent, ComponentType } from 'react';
3
5
  import * as antd_lib_form_Form from 'antd/lib/form/Form';
4
6
  import { RuleObject } from 'rc-field-form/lib/interface';
7
+ import { RouteProps } from 'react-router-dom';
5
8
 
6
- declare function Blank(options?: {
9
+ declare type BlankProps = {
7
10
  value?: any;
8
11
  text?: string;
9
- }): any;
12
+ };
13
+ declare function Blank(options?: BlankProps): any;
14
+
15
+ declare type FaasState = {
16
+ common: {
17
+ blank: string;
18
+ all: string;
19
+ submit: string;
20
+ };
21
+ Blank: {
22
+ text: string;
23
+ };
24
+ Form: {
25
+ submit: {
26
+ text: string;
27
+ };
28
+ };
29
+ Title: {
30
+ separator: string;
31
+ suffix: string;
32
+ };
33
+ };
34
+ declare const useFaasState: () => [FaasState, (state: react_use_lib_misc_hookState.IHookStateSetAction<FaasState>) => void];
35
+ declare function Config(props: {
36
+ config: Partial<FaasState>;
37
+ }): JSX.Element;
10
38
 
11
39
  declare type FaasItemType = 'string' | 'string[]' | 'number' | 'number[]' | 'boolean';
12
40
  declare type FaasItemTypeValue = {
@@ -37,6 +65,20 @@ declare function transferOptions(options: BaseOption[]): {
37
65
  value?: string | number;
38
66
  }[];
39
67
 
68
+ declare type FaasDataWrapperProps<T = any> = {
69
+ dataSource?: T;
70
+ faasData?: {
71
+ action: string;
72
+ params?: Record<string, any>;
73
+ data?: T;
74
+ setData?: Dispatch<SetStateAction<T>>;
75
+ };
76
+ render?: (args: {
77
+ data: T;
78
+ }) => JSX.Element;
79
+ fallback?: JSX.Element;
80
+ };
81
+
40
82
  declare type ExtendDescriptionTypeProps = {
41
83
  children?: JSX.Element | null;
42
84
  render?: (value: any, values: any) => JSX.Element | string | number | boolean | null;
@@ -48,16 +90,11 @@ declare type DescriptionItemProps<T = any> = {
48
90
  } & FaasItemProps;
49
91
  declare type DescriptionProps<T = any, ExtendItemProps = any> = {
50
92
  items: (DescriptionItemProps | ExtendItemProps)[];
51
- dataSource?: T;
52
- faasData?: {
53
- action: string;
54
- params?: Record<string, any>;
55
- };
56
93
  extendTypes?: {
57
94
  [key: string]: ExtendDescriptionTypeProps;
58
95
  };
59
- } & DescriptionsProps;
60
- declare function Description(props: DescriptionProps): JSX.Element;
96
+ } & FaasDataWrapperProps<T> & DescriptionsProps;
97
+ declare function Description<T = any>(props: DescriptionProps<T>): JSX.Element;
61
98
 
62
99
  declare type DrawerProps = DrawerProps$1 & {
63
100
  children?: JSX.Element | JSX.Element[];
@@ -102,6 +139,7 @@ declare type ExtendFormTypeProps = {
102
139
  declare type ExtendFormItemProps = BaseItemProps & FormItemProps$1;
103
140
  declare type FormItemProps<T = any> = {
104
141
  children?: JSX.Element | null;
142
+ render?: () => JSX.Element | null;
105
143
  rules?: RuleObject[];
106
144
  label?: string | false;
107
145
  extendTypes?: {
@@ -127,25 +165,37 @@ declare namespace Form {
127
165
  var Item: typeof FormItem;
128
166
  }
129
167
 
168
+ declare type RoutesProps = {
169
+ routes: (RouteProps & {
170
+ page?: LazyExoticComponent<ComponentType<any>>;
171
+ })[];
172
+ notFound?: JSX.Element;
173
+ };
174
+ declare function Routes(props: RoutesProps): JSX.Element;
175
+
130
176
  declare type TableItemProps<T = any> = {
131
177
  /** @deprecated use render */
132
178
  children?: JSX.Element | null;
133
- } & FaasItemProps & TableColumnProps<T>;
179
+ } & FaasItemProps & Omit<TableColumnProps<T>, 'children'>;
134
180
  declare type ExtendTableTypeProps = {
135
181
  children?: JSX.Element | null;
136
- render?: (value: any, values: any) => JSX.Element | string | number | boolean | null;
182
+ render?: (value: any, values: any, index: number) => JSX.Element | string | number | boolean | null;
137
183
  };
138
- declare type ExtendTableItemProps<T = any> = BaseItemProps & TableColumnProps<T>;
184
+ declare type ExtendTableItemProps<T = any> = BaseItemProps & Omit<TableColumnProps<T>, 'children'>;
139
185
  declare type TableProps<T = any, ExtendTypes = any> = {
140
186
  items: (TableItemProps | (ExtendTypes & ExtendTableItemProps))[];
141
187
  extendTypes?: {
142
188
  [key: string]: ExtendTableTypeProps;
143
189
  };
144
- faasData?: {
145
- action: string;
146
- params?: Record<string, any>;
147
- };
148
- } & TableProps$1<T>;
190
+ } & FaasDataWrapperProps<T> & TableProps$1<T>;
149
191
  declare function Table<T = any, ExtendTypes = any>(props: TableProps<T, ExtendTypes>): JSX.Element;
150
192
 
151
- 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 };
193
+ declare type TitleProps = {
194
+ title: string | string[];
195
+ /** ` - ` as default */
196
+ separator?: string;
197
+ suffix?: string;
198
+ };
199
+ declare function Title(props: TitleProps): JSX.Element;
200
+
201
+ export { BaseItemProps, BaseOption, Blank, BlankProps, Config, Description, DescriptionItemProps, DescriptionProps, DrawerProps, ExtendDescriptionItemProps, ExtendDescriptionTypeProps, ExtendFormItemProps, ExtendFormTypeProps, ExtendTableItemProps, ExtendTableTypeProps, FaasItemProps, FaasItemType, FaasItemTypeValue, FaasState, Form, FormItem, FormItemProps, FormProps, Routes, RoutesProps, Table, TableItemProps, TableProps, Title, TitleProps, transferOptions, useDrawer, useFaasState };
package/dist/index.js CHANGED
@@ -47,13 +47,17 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
47
47
  var src_exports = {};
48
48
  __export(src_exports, {
49
49
  Blank: () => Blank,
50
+ Config: () => Config,
50
51
  Description: () => Description,
51
52
  Drawer: () => import_antd3.Drawer,
52
53
  Form: () => Form,
53
54
  FormItem: () => FormItem,
55
+ Routes: () => Routes,
54
56
  Table: () => Table,
57
+ Title: () => Title,
55
58
  transferOptions: () => transferOptions,
56
- useDrawer: () => useDrawer
59
+ useDrawer: () => useDrawer,
60
+ useFaasState: () => useFaasState
57
61
  });
58
62
 
59
63
  // react-shim.js
@@ -62,12 +66,39 @@ var import_react = __toESM(require("react"));
62
66
  // src/Blank.tsx
63
67
  var import_antd = require("antd");
64
68
  var import_lodash = require("lodash");
65
- var _a;
66
- var text = ((_a = navigator.language) == null ? void 0 : _a.includes("CN")) ? "\u7A7A" : "Empty";
69
+
70
+ // src/Config.tsx
71
+ var import_react2 = require("react");
72
+ var import_react_use = require("react-use");
73
+ var _a, _b, _c;
74
+ var common = {
75
+ blank: ((_a = navigator.language) == null ? void 0 : _a.includes("CN")) ? "\u7A7A" : "Empty",
76
+ all: ((_b = navigator.language) == null ? void 0 : _b.includes("CN")) ? "\u5168\u90E8" : "All",
77
+ submit: ((_c = navigator.language) == null ? void 0 : _c.includes("CN")) ? "\u63D0\u4EA4" : "Submit"
78
+ };
79
+ var useFaasState = (0, import_react_use.createGlobalState)({
80
+ common,
81
+ Blank: { text: common.blank },
82
+ Form: { submit: { text: common.submit } },
83
+ Title: {
84
+ separator: " - ",
85
+ suffix: ""
86
+ }
87
+ });
88
+ function Config(props) {
89
+ const [_, setState] = useFaasState();
90
+ (0, import_react2.useEffect)(() => {
91
+ setState((prev) => __spreadValues(__spreadValues({}, prev), props.config));
92
+ }, []);
93
+ return null;
94
+ }
95
+
96
+ // src/Blank.tsx
67
97
  function Blank(options) {
98
+ const [config] = useFaasState();
68
99
  return !options || (0, import_lodash.isNil)(options.value) || Array.isArray(options.value) && !options.value.length || options.value === "" ? /* @__PURE__ */ import_react.default.createElement(import_antd.Typography.Text, {
69
100
  disabled: true
70
- }, (options == null ? void 0 : options.text) || text) : options.value;
101
+ }, (options == null ? void 0 : options.text) || config.Blank.text) : options.value;
71
102
  }
72
103
 
73
104
  // src/data.ts
@@ -85,35 +116,40 @@ function transferOptions(options) {
85
116
  var import_icons = require("@ant-design/icons");
86
117
  var import_antd2 = require("antd");
87
118
  var import_lodash3 = require("lodash");
88
- var import_react4 = require("react");
119
+ var import_react5 = require("react");
89
120
 
90
- // src/FaasWrapper.tsx
91
- var import_react2 = require("react");
92
- var import_react3 = require("@faasjs/react");
121
+ // src/FaasDataWrapper.tsx
122
+ var import_react3 = require("react");
123
+ var import_react4 = require("@faasjs/react");
93
124
  function FaasDataWrapper({
94
125
  dataSource,
95
126
  faasData,
96
127
  render,
97
128
  fallback
98
129
  }) {
99
- const [data, setData] = (0, import_react2.useState)();
100
- (0, import_react2.useEffect)(() => {
130
+ const [data, setData] = (0, import_react3.useState)();
131
+ (0, import_react3.useEffect)(() => {
101
132
  if (!faasData)
102
133
  return;
103
- (0, import_react3.getClient)().faas(faasData.action, faasData.params).then((res) => setData(res.data));
104
- }, [JSON.stringify(faasData)]);
134
+ (0, import_react4.getClient)().faas(faasData.action, faasData.params).then((res) => {
135
+ if (faasData.setData)
136
+ faasData.setData(res.data);
137
+ else
138
+ setData(res.data);
139
+ });
140
+ }, [JSON.stringify([faasData == null ? void 0 : faasData.action, faasData == null ? void 0 : faasData.params])]);
105
141
  if (dataSource)
106
142
  return render({ data: dataSource });
107
- if (!data)
143
+ if (!data && !faasData.data)
108
144
  return fallback || null;
109
- return render({ data });
145
+ return render({ data: faasData.data || data });
110
146
  }
111
147
 
112
148
  // src/Description.tsx
113
149
  function DescriptionItemContent(props) {
114
- const [computedProps, setComputedProps] = (0, import_react4.useState)();
115
- (0, import_react4.useEffect)(() => {
116
- var _a2, _b;
150
+ const [computedProps, setComputedProps] = (0, import_react5.useState)();
151
+ (0, import_react5.useEffect)(() => {
152
+ var _a2, _b2;
117
153
  const propsCopy = __spreadValues({}, props);
118
154
  if (!propsCopy.item.title)
119
155
  propsCopy.item.title = (0, import_lodash3.upperFirst)(propsCopy.item.id);
@@ -129,7 +165,7 @@ function DescriptionItemContent(props) {
129
165
  return ((_a3 = propsCopy.item.options.find((option) => option.value === v)) == null ? void 0 : _a3.label) || v;
130
166
  });
131
167
  else
132
- propsCopy.value = ((_b = props.item.options.find((option) => option.value === props.value)) == null ? void 0 : _b.label) || props.value;
168
+ propsCopy.value = ((_b2 = props.item.options.find((option) => option.value === props.value)) == null ? void 0 : _b2.label) || props.value;
133
169
  }
134
170
  setComputedProps(propsCopy);
135
171
  }, [props]);
@@ -137,7 +173,7 @@ function DescriptionItemContent(props) {
137
173
  return null;
138
174
  if (computedProps.extendTypes && computedProps.extendTypes[computedProps.item.type])
139
175
  if (computedProps.extendTypes[computedProps.item.type].children)
140
- return (0, import_react4.cloneElement)(computedProps.extendTypes[computedProps.item.type].children, {
176
+ return (0, import_react5.cloneElement)(computedProps.extendTypes[computedProps.item.type].children, {
141
177
  value: computedProps.value,
142
178
  values: computedProps.values
143
179
  });
@@ -146,7 +182,7 @@ function DescriptionItemContent(props) {
146
182
  else
147
183
  throw Error(computedProps.item.type + " requires children or render");
148
184
  if (computedProps.item.children)
149
- return (0, import_react4.cloneElement)(computedProps.item.children, { value: computedProps.value });
185
+ return (0, import_react5.cloneElement)(computedProps.item.children, { value: computedProps.value });
150
186
  if (computedProps.item.render)
151
187
  return computedProps.item.render(computedProps.value, computedProps.values);
152
188
  if (typeof computedProps.value === "undefined" || computedProps.value === null)
@@ -175,9 +211,7 @@ function DescriptionItemContent(props) {
175
211
  }
176
212
  }
177
213
  function Description(props) {
178
- return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, {
179
- dataSource: props.dataSource,
180
- faasData: props.faasData,
214
+ return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, __spreadProps(__spreadValues({}, props), {
181
215
  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, {
182
216
  key: item.id,
183
217
  label: item.title || (0, import_lodash3.upperFirst)(item.id)
@@ -187,14 +221,14 @@ function Description(props) {
187
221
  values: data,
188
222
  extendTypes: props.extendTypes
189
223
  }))))
190
- });
224
+ }));
191
225
  }
192
226
 
193
227
  // src/Drawer.tsx
194
228
  var import_antd3 = require("antd");
195
- var import_react5 = require("react");
229
+ var import_react6 = require("react");
196
230
  function useDrawer(init) {
197
- const [props, setProps] = (0, import_react5.useState)(__spreadValues({
231
+ const [props, setProps] = (0, import_react6.useState)(__spreadValues({
198
232
  visible: false,
199
233
  onClose: () => setProps((prev) => __spreadProps(__spreadValues({}, prev), {
200
234
  visible: false
@@ -211,16 +245,16 @@ function useDrawer(init) {
211
245
 
212
246
  // src/Form.tsx
213
247
  var import_antd5 = require("antd");
214
- var import_react7 = require("react");
248
+ var import_react8 = require("react");
215
249
 
216
250
  // src/FormItem.tsx
217
251
  var import_antd4 = require("antd");
218
252
  var import_icons2 = require("@ant-design/icons");
219
- var import_react6 = require("react");
253
+ var import_react7 = require("react");
220
254
  var import_lodash4 = require("lodash");
221
255
  function FormItem(props) {
222
- const [computedProps, setComputedProps] = (0, import_react6.useState)();
223
- (0, import_react6.useEffect)(() => {
256
+ const [computedProps, setComputedProps] = (0, import_react7.useState)();
257
+ (0, import_react7.useEffect)(() => {
224
258
  const propsCopy = __spreadValues({}, props);
225
259
  if (!propsCopy.title)
226
260
  propsCopy.title = (0, import_lodash4.upperFirst)(propsCopy.id);
@@ -264,6 +298,8 @@ function FormItem(props) {
264
298
  return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.extendTypes[computedProps.type].children);
265
299
  if (computedProps.children)
266
300
  return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.children);
301
+ if (computedProps.render)
302
+ return /* @__PURE__ */ import_react.default.createElement(import_antd4.Form.Item, __spreadValues({}, computedProps), computedProps.render());
267
303
  switch (computedProps.type) {
268
304
  case "string":
269
305
  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)));
@@ -357,10 +393,11 @@ function FormItem(props) {
357
393
 
358
394
  // src/Form.tsx
359
395
  function Form(props) {
360
- var _a2, _b;
361
- const [loading, setLoading] = (0, import_react7.useState)(false);
362
- const [computedProps, setComputedProps] = (0, import_react7.useState)();
363
- (0, import_react7.useEffect)(() => {
396
+ var _a2, _b2;
397
+ const [loading, setLoading] = (0, import_react8.useState)(false);
398
+ const [computedProps, setComputedProps] = (0, import_react8.useState)();
399
+ const [config] = useFaasState();
400
+ (0, import_react8.useEffect)(() => {
364
401
  const propsCopy = __spreadValues({}, props);
365
402
  if (propsCopy.onFinish) {
366
403
  propsCopy.onFinish = async (values) => {
@@ -375,6 +412,8 @@ function Form(props) {
375
412
  }
376
413
  setComputedProps(props);
377
414
  }, []);
415
+ if (!computedProps)
416
+ return null;
378
417
  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({
379
418
  key: item.id
380
419
  }, item), {
@@ -383,14 +422,41 @@ function Form(props) {
383
422
  htmlType: "submit",
384
423
  type: "primary",
385
424
  loading
386
- }, ((_b = props.submit) == null ? void 0 : _b.text) || "Submit"));
425
+ }, ((_b2 = props.submit) == null ? void 0 : _b2.text) || config.Form.submit.text));
387
426
  }
388
427
  Form.useForm = import_antd5.Form.useForm;
389
428
  Form.Item = FormItem;
390
429
 
391
- // src/Table.tsx
392
- var import_react8 = require("react");
430
+ // src/Routers.tsx
393
431
  var import_antd6 = require("antd");
432
+ var import_react9 = require("react");
433
+ var import_react_router_dom = require("react-router-dom");
434
+ function NoMatch() {
435
+ return /* @__PURE__ */ import_react.default.createElement(import_antd6.Result, {
436
+ status: "404",
437
+ title: "404",
438
+ subTitle: "Page not found"
439
+ });
440
+ }
441
+ function Routes(props) {
442
+ return /* @__PURE__ */ import_react.default.createElement(import_react_router_dom.Routes, null, props.routes.map((r) => /* @__PURE__ */ import_react.default.createElement(import_react_router_dom.Route, __spreadProps(__spreadValues({
443
+ key: r.path
444
+ }, r), {
445
+ element: r.element || /* @__PURE__ */ import_react.default.createElement(import_react9.Suspense, {
446
+ fallback: /* @__PURE__ */ import_react.default.createElement(import_antd6.Skeleton, {
447
+ active: true
448
+ })
449
+ }, /* @__PURE__ */ import_react.default.createElement(r.page, null))
450
+ }))), /* @__PURE__ */ import_react.default.createElement(import_react_router_dom.Route, {
451
+ key: "*",
452
+ path: "*",
453
+ element: props.notFound || /* @__PURE__ */ import_react.default.createElement(NoMatch, null)
454
+ }));
455
+ }
456
+
457
+ // src/Table.tsx
458
+ var import_react10 = require("react");
459
+ var import_antd7 = require("antd");
394
460
  var import_icons3 = require("@ant-design/icons");
395
461
  var import_lodash5 = require("lodash");
396
462
  function processValue(item, value) {
@@ -407,8 +473,9 @@ function processValue(item, value) {
407
473
  return value;
408
474
  }
409
475
  function Table(props) {
410
- const [columns, setColumns] = (0, import_react8.useState)();
411
- (0, import_react8.useEffect)(() => {
476
+ const [columns, setColumns] = (0, import_react10.useState)();
477
+ const [config] = useFaasState();
478
+ (0, import_react10.useEffect)(() => {
412
479
  var _a2;
413
480
  for (const item of props.items) {
414
481
  if (!item.key)
@@ -432,7 +499,7 @@ function Table(props) {
432
499
  delete item.children;
433
500
  if (props.extendTypes && props.extendTypes[item.type]) {
434
501
  if (props.extendTypes[item.type].children) {
435
- item.render = (value, values) => (0, import_react8.cloneElement)(props.extendTypes[item.type].children, {
502
+ item.render = (value, values) => (0, import_react10.cloneElement)(props.extendTypes[item.type].children, {
436
503
  value,
437
504
  values
438
505
  });
@@ -477,34 +544,31 @@ function Table(props) {
477
544
  setSelectedKeys,
478
545
  selectedKeys,
479
546
  confirm
480
- }) => {
481
- var _a3, _b;
482
- return /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Group, {
483
- style: { padding: 8 },
484
- buttonStyle: "solid",
485
- value: selectedKeys[0],
486
- onChange: (e) => {
487
- setSelectedKeys(e.target.value ? [e.target.value] : []);
488
- confirm();
489
- }
490
- }, /* @__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, {
491
- value: "true"
492
- }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CheckOutlined, {
493
- style: {
494
- color: "#52c41a",
495
- verticalAlign: "middle"
496
- }
497
- })), /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, {
498
- value: "false"
499
- }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CloseOutlined, {
500
- style: {
501
- verticalAlign: "middle",
502
- color: "#ff4d4f"
503
- }
504
- })), /* @__PURE__ */ import_react.default.createElement(import_antd6.Radio.Button, {
505
- value: "empty"
506
- }, ((_b = navigator.language) == null ? void 0 : _b.includes("CN")) ? "\u7A7A" : "Empty"));
507
- };
547
+ }) => /* @__PURE__ */ import_react.default.createElement(import_antd7.Radio.Group, {
548
+ style: { padding: 8 },
549
+ buttonStyle: "solid",
550
+ value: selectedKeys[0],
551
+ onChange: (e) => {
552
+ setSelectedKeys(e.target.value ? [e.target.value] : []);
553
+ confirm();
554
+ }
555
+ }, /* @__PURE__ */ import_react.default.createElement(import_antd7.Radio.Button, null, config.common.all), /* @__PURE__ */ import_react.default.createElement(import_antd7.Radio.Button, {
556
+ value: "true"
557
+ }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CheckOutlined, {
558
+ style: {
559
+ color: "#52c41a",
560
+ verticalAlign: "middle"
561
+ }
562
+ })), /* @__PURE__ */ import_react.default.createElement(import_antd7.Radio.Button, {
563
+ value: "false"
564
+ }, /* @__PURE__ */ import_react.default.createElement(import_icons3.CloseOutlined, {
565
+ style: {
566
+ verticalAlign: "middle",
567
+ color: "#ff4d4f"
568
+ }
569
+ })), /* @__PURE__ */ import_react.default.createElement(import_antd7.Radio.Button, {
570
+ value: "empty"
571
+ }, config.common.blank));
508
572
  if (!item.onFilter)
509
573
  item.onFilter = (value, row) => {
510
574
  switch (value) {
@@ -530,25 +594,38 @@ function Table(props) {
530
594
  }, [props.items]);
531
595
  if (!columns)
532
596
  return null;
533
- return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, {
534
- dataSource: props.dataSource,
535
- faasData: props.faasData,
536
- render: ({ data }) => /* @__PURE__ */ import_react.default.createElement(import_antd6.Table, __spreadProps(__spreadValues({}, props), {
597
+ return /* @__PURE__ */ import_react.default.createElement(FaasDataWrapper, __spreadValues({
598
+ render: ({ data }) => /* @__PURE__ */ import_react.default.createElement(import_antd7.Table, __spreadProps(__spreadValues({}, props), {
537
599
  rowKey: props.rowKey || "id",
538
600
  columns,
539
601
  dataSource: data
540
602
  }))
541
- });
603
+ }, props));
604
+ }
605
+
606
+ // src/Title.tsx
607
+ var import_react11 = require("react");
608
+ function Title(props) {
609
+ const [config] = useFaasState();
610
+ (0, import_react11.useEffect)(() => {
611
+ const title = Array.isArray(props.title) ? props.title : [props.title];
612
+ document.title = title.concat(props.suffix || config.Title.suffix).filter((t) => !!t).join(props.separator || config.Title.separator);
613
+ }, []);
614
+ return null;
542
615
  }
543
616
  module.exports = __toCommonJS(src_exports);
544
617
  // Annotate the CommonJS export names for ESM import in node:
545
618
  0 && (module.exports = {
546
619
  Blank,
620
+ Config,
547
621
  Description,
548
622
  Drawer,
549
623
  Form,
550
624
  FormItem,
625
+ Routes,
551
626
  Table,
627
+ Title,
552
628
  transferOptions,
553
- useDrawer
629
+ useDrawer,
630
+ useFaasState
554
631
  });
package/dist/index.mjs CHANGED
@@ -24,12 +24,39 @@ import React from "react";
24
24
  // src/Blank.tsx
25
25
  import { Typography } from "antd";
26
26
  import { isNil } from "lodash";
27
- var _a;
28
- var text = ((_a = navigator.language) == null ? void 0 : _a.includes("CN")) ? "\u7A7A" : "Empty";
27
+
28
+ // src/Config.tsx
29
+ import { useEffect } from "react";
30
+ import { createGlobalState } from "react-use";
31
+ var _a, _b, _c;
32
+ var common = {
33
+ blank: ((_a = navigator.language) == null ? void 0 : _a.includes("CN")) ? "\u7A7A" : "Empty",
34
+ all: ((_b = navigator.language) == null ? void 0 : _b.includes("CN")) ? "\u5168\u90E8" : "All",
35
+ submit: ((_c = navigator.language) == null ? void 0 : _c.includes("CN")) ? "\u63D0\u4EA4" : "Submit"
36
+ };
37
+ var useFaasState = createGlobalState({
38
+ common,
39
+ Blank: { text: common.blank },
40
+ Form: { submit: { text: common.submit } },
41
+ Title: {
42
+ separator: " - ",
43
+ suffix: ""
44
+ }
45
+ });
46
+ function Config(props) {
47
+ const [_, setState] = useFaasState();
48
+ useEffect(() => {
49
+ setState((prev) => __spreadValues(__spreadValues({}, prev), props.config));
50
+ }, []);
51
+ return null;
52
+ }
53
+
54
+ // src/Blank.tsx
29
55
  function Blank(options) {
56
+ const [config] = useFaasState();
30
57
  return !options || isNil(options.value) || Array.isArray(options.value) && !options.value.length || options.value === "" ? /* @__PURE__ */ React.createElement(Typography.Text, {
31
58
  disabled: true
32
- }, (options == null ? void 0 : options.text) || text) : options.value;
59
+ }, (options == null ? void 0 : options.text) || config.Blank.text) : options.value;
33
60
  }
34
61
 
35
62
  // src/data.ts
@@ -49,12 +76,15 @@ import { Descriptions } from "antd";
49
76
  import { upperFirst as upperFirst2 } from "lodash";
50
77
  import {
51
78
  cloneElement,
52
- useEffect as useEffect2,
79
+ useEffect as useEffect3,
53
80
  useState as useState2
54
81
  } from "react";
55
82
 
56
- // src/FaasWrapper.tsx
57
- import { useEffect, useState } from "react";
83
+ // src/FaasDataWrapper.tsx
84
+ import {
85
+ useEffect as useEffect2,
86
+ useState
87
+ } from "react";
58
88
  import { getClient } from "@faasjs/react";
59
89
  function FaasDataWrapper({
60
90
  dataSource,
@@ -63,23 +93,28 @@ function FaasDataWrapper({
63
93
  fallback
64
94
  }) {
65
95
  const [data, setData] = useState();
66
- useEffect(() => {
96
+ useEffect2(() => {
67
97
  if (!faasData)
68
98
  return;
69
- getClient().faas(faasData.action, faasData.params).then((res) => setData(res.data));
70
- }, [JSON.stringify(faasData)]);
99
+ getClient().faas(faasData.action, faasData.params).then((res) => {
100
+ if (faasData.setData)
101
+ faasData.setData(res.data);
102
+ else
103
+ setData(res.data);
104
+ });
105
+ }, [JSON.stringify([faasData == null ? void 0 : faasData.action, faasData == null ? void 0 : faasData.params])]);
71
106
  if (dataSource)
72
107
  return render({ data: dataSource });
73
- if (!data)
108
+ if (!data && !faasData.data)
74
109
  return fallback || null;
75
- return render({ data });
110
+ return render({ data: faasData.data || data });
76
111
  }
77
112
 
78
113
  // src/Description.tsx
79
114
  function DescriptionItemContent(props) {
80
115
  const [computedProps, setComputedProps] = useState2();
81
- useEffect2(() => {
82
- var _a2, _b;
116
+ useEffect3(() => {
117
+ var _a2, _b2;
83
118
  const propsCopy = __spreadValues({}, props);
84
119
  if (!propsCopy.item.title)
85
120
  propsCopy.item.title = upperFirst2(propsCopy.item.id);
@@ -95,7 +130,7 @@ function DescriptionItemContent(props) {
95
130
  return ((_a3 = propsCopy.item.options.find((option) => option.value === v)) == null ? void 0 : _a3.label) || v;
96
131
  });
97
132
  else
98
- propsCopy.value = ((_b = props.item.options.find((option) => option.value === props.value)) == null ? void 0 : _b.label) || props.value;
133
+ propsCopy.value = ((_b2 = props.item.options.find((option) => option.value === props.value)) == null ? void 0 : _b2.label) || props.value;
99
134
  }
100
135
  setComputedProps(propsCopy);
101
136
  }, [props]);
@@ -141,9 +176,7 @@ function DescriptionItemContent(props) {
141
176
  }
142
177
  }
143
178
  function Description(props) {
144
- return /* @__PURE__ */ React.createElement(FaasDataWrapper, {
145
- dataSource: props.dataSource,
146
- faasData: props.faasData,
179
+ return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadProps(__spreadValues({}, props), {
147
180
  render: ({ data }) => /* @__PURE__ */ React.createElement(Descriptions, __spreadValues({}, props), props.items.map((item) => /* @__PURE__ */ React.createElement(Descriptions.Item, {
148
181
  key: item.id,
149
182
  label: item.title || upperFirst2(item.id)
@@ -153,7 +186,7 @@ function Description(props) {
153
186
  values: data,
154
187
  extendTypes: props.extendTypes
155
188
  }))))
156
- });
189
+ }));
157
190
  }
158
191
 
159
192
  // src/Drawer.tsx
@@ -180,7 +213,7 @@ import {
180
213
  Button as Button2,
181
214
  Form as AntdForm2
182
215
  } from "antd";
183
- import { useEffect as useEffect4, useState as useState5 } from "react";
216
+ import { useEffect as useEffect5, useState as useState5 } from "react";
184
217
 
185
218
  // src/FormItem.tsx
186
219
  import {
@@ -194,14 +227,11 @@ import {
194
227
  Select
195
228
  } from "antd";
196
229
  import { MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
197
- import {
198
- useEffect as useEffect3,
199
- useState as useState4
200
- } from "react";
230
+ import { useEffect as useEffect4, useState as useState4 } from "react";
201
231
  import { upperFirst as upperFirst3 } from "lodash";
202
232
  function FormItem(props) {
203
233
  const [computedProps, setComputedProps] = useState4();
204
- useEffect3(() => {
234
+ useEffect4(() => {
205
235
  const propsCopy = __spreadValues({}, props);
206
236
  if (!propsCopy.title)
207
237
  propsCopy.title = upperFirst3(propsCopy.id);
@@ -245,6 +275,8 @@ function FormItem(props) {
245
275
  return /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadValues({}, computedProps), computedProps.extendTypes[computedProps.type].children);
246
276
  if (computedProps.children)
247
277
  return /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadValues({}, computedProps), computedProps.children);
278
+ if (computedProps.render)
279
+ return /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadValues({}, computedProps), computedProps.render());
248
280
  switch (computedProps.type) {
249
281
  case "string":
250
282
  return /* @__PURE__ */ React.createElement(AntdForm.Item, __spreadValues({}, computedProps), computedProps.options ? /* @__PURE__ */ React.createElement(Select, __spreadValues({}, computedProps.input)) : /* @__PURE__ */ React.createElement(Input, __spreadValues({}, computedProps.input)));
@@ -338,10 +370,11 @@ function FormItem(props) {
338
370
 
339
371
  // src/Form.tsx
340
372
  function Form(props) {
341
- var _a2, _b;
373
+ var _a2, _b2;
342
374
  const [loading, setLoading] = useState5(false);
343
375
  const [computedProps, setComputedProps] = useState5();
344
- useEffect4(() => {
376
+ const [config] = useFaasState();
377
+ useEffect5(() => {
345
378
  const propsCopy = __spreadValues({}, props);
346
379
  if (propsCopy.onFinish) {
347
380
  propsCopy.onFinish = async (values) => {
@@ -356,6 +389,8 @@ function Form(props) {
356
389
  }
357
390
  setComputedProps(props);
358
391
  }, []);
392
+ if (!computedProps)
393
+ return null;
359
394
  return /* @__PURE__ */ React.createElement(AntdForm2, __spreadValues({}, computedProps), (_a2 = props.items) == null ? void 0 : _a2.map((item) => /* @__PURE__ */ React.createElement(FormItem, __spreadProps(__spreadValues({
360
395
  key: item.id
361
396
  }, item), {
@@ -364,15 +399,47 @@ function Form(props) {
364
399
  htmlType: "submit",
365
400
  type: "primary",
366
401
  loading
367
- }, ((_b = props.submit) == null ? void 0 : _b.text) || "Submit"));
402
+ }, ((_b2 = props.submit) == null ? void 0 : _b2.text) || config.Form.submit.text));
368
403
  }
369
404
  Form.useForm = AntdForm2.useForm;
370
405
  Form.Item = FormItem;
371
406
 
407
+ // src/Routers.tsx
408
+ import { Result, Skeleton } from "antd";
409
+ import {
410
+ Suspense
411
+ } from "react";
412
+ import {
413
+ Routes as OriginRoutes,
414
+ Route
415
+ } from "react-router-dom";
416
+ function NoMatch() {
417
+ return /* @__PURE__ */ React.createElement(Result, {
418
+ status: "404",
419
+ title: "404",
420
+ subTitle: "Page not found"
421
+ });
422
+ }
423
+ function Routes(props) {
424
+ return /* @__PURE__ */ React.createElement(OriginRoutes, null, props.routes.map((r) => /* @__PURE__ */ React.createElement(Route, __spreadProps(__spreadValues({
425
+ key: r.path
426
+ }, r), {
427
+ element: r.element || /* @__PURE__ */ React.createElement(Suspense, {
428
+ fallback: /* @__PURE__ */ React.createElement(Skeleton, {
429
+ active: true
430
+ })
431
+ }, /* @__PURE__ */ React.createElement(r.page, null))
432
+ }))), /* @__PURE__ */ React.createElement(Route, {
433
+ key: "*",
434
+ path: "*",
435
+ element: props.notFound || /* @__PURE__ */ React.createElement(NoMatch, null)
436
+ }));
437
+ }
438
+
372
439
  // src/Table.tsx
373
440
  import {
374
441
  useState as useState6,
375
- useEffect as useEffect5,
442
+ useEffect as useEffect6,
376
443
  cloneElement as cloneElement2
377
444
  } from "react";
378
445
  import {
@@ -396,7 +463,8 @@ function processValue(item, value) {
396
463
  }
397
464
  function Table(props) {
398
465
  const [columns, setColumns] = useState6();
399
- useEffect5(() => {
466
+ const [config] = useFaasState();
467
+ useEffect6(() => {
400
468
  var _a2;
401
469
  for (const item of props.items) {
402
470
  if (!item.key)
@@ -465,34 +533,31 @@ function Table(props) {
465
533
  setSelectedKeys,
466
534
  selectedKeys,
467
535
  confirm
468
- }) => {
469
- var _a3, _b;
470
- return /* @__PURE__ */ React.createElement(Radio.Group, {
471
- style: { padding: 8 },
472
- buttonStyle: "solid",
473
- value: selectedKeys[0],
474
- onChange: (e) => {
475
- setSelectedKeys(e.target.value ? [e.target.value] : []);
476
- confirm();
477
- }
478
- }, /* @__PURE__ */ React.createElement(Radio.Button, null, ((_a3 = navigator.language) == null ? void 0 : _a3.includes("CN")) ? "\u5168\u90E8" : "All"), /* @__PURE__ */ React.createElement(Radio.Button, {
479
- value: "true"
480
- }, /* @__PURE__ */ React.createElement(CheckOutlined2, {
481
- style: {
482
- color: "#52c41a",
483
- verticalAlign: "middle"
484
- }
485
- })), /* @__PURE__ */ React.createElement(Radio.Button, {
486
- value: "false"
487
- }, /* @__PURE__ */ React.createElement(CloseOutlined2, {
488
- style: {
489
- verticalAlign: "middle",
490
- color: "#ff4d4f"
491
- }
492
- })), /* @__PURE__ */ React.createElement(Radio.Button, {
493
- value: "empty"
494
- }, ((_b = navigator.language) == null ? void 0 : _b.includes("CN")) ? "\u7A7A" : "Empty"));
495
- };
536
+ }) => /* @__PURE__ */ React.createElement(Radio.Group, {
537
+ style: { padding: 8 },
538
+ buttonStyle: "solid",
539
+ value: selectedKeys[0],
540
+ onChange: (e) => {
541
+ setSelectedKeys(e.target.value ? [e.target.value] : []);
542
+ confirm();
543
+ }
544
+ }, /* @__PURE__ */ React.createElement(Radio.Button, null, config.common.all), /* @__PURE__ */ React.createElement(Radio.Button, {
545
+ value: "true"
546
+ }, /* @__PURE__ */ React.createElement(CheckOutlined2, {
547
+ style: {
548
+ color: "#52c41a",
549
+ verticalAlign: "middle"
550
+ }
551
+ })), /* @__PURE__ */ React.createElement(Radio.Button, {
552
+ value: "false"
553
+ }, /* @__PURE__ */ React.createElement(CloseOutlined2, {
554
+ style: {
555
+ verticalAlign: "middle",
556
+ color: "#ff4d4f"
557
+ }
558
+ })), /* @__PURE__ */ React.createElement(Radio.Button, {
559
+ value: "empty"
560
+ }, config.common.blank));
496
561
  if (!item.onFilter)
497
562
  item.onFilter = (value, row) => {
498
563
  switch (value) {
@@ -518,23 +583,36 @@ function Table(props) {
518
583
  }, [props.items]);
519
584
  if (!columns)
520
585
  return null;
521
- return /* @__PURE__ */ React.createElement(FaasDataWrapper, {
522
- dataSource: props.dataSource,
523
- faasData: props.faasData,
586
+ return /* @__PURE__ */ React.createElement(FaasDataWrapper, __spreadValues({
524
587
  render: ({ data }) => /* @__PURE__ */ React.createElement(AntdTable, __spreadProps(__spreadValues({}, props), {
525
588
  rowKey: props.rowKey || "id",
526
589
  columns,
527
590
  dataSource: data
528
591
  }))
529
- });
592
+ }, props));
593
+ }
594
+
595
+ // src/Title.tsx
596
+ import { useEffect as useEffect7 } from "react";
597
+ function Title(props) {
598
+ const [config] = useFaasState();
599
+ useEffect7(() => {
600
+ const title = Array.isArray(props.title) ? props.title : [props.title];
601
+ document.title = title.concat(props.suffix || config.Title.suffix).filter((t) => !!t).join(props.separator || config.Title.separator);
602
+ }, []);
603
+ return null;
530
604
  }
531
605
  export {
532
606
  Blank,
607
+ Config,
533
608
  Description,
534
609
  Drawer,
535
610
  Form,
536
611
  FormItem,
612
+ Routes,
537
613
  Table,
614
+ Title,
538
615
  transferOptions,
539
- useDrawer
616
+ useDrawer,
617
+ useFaasState
540
618
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@faasjs/ant-design",
3
- "version": "0.0.2-beta.349",
3
+ "version": "0.0.2-beta.353",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -27,7 +27,9 @@
27
27
  "lodash": "*",
28
28
  "react": "*",
29
29
  "react-dom": "*",
30
- "@faasjs/react": "^0.0.2-beta.349"
30
+ "@faasjs/react": "^0.0.2-beta.353",
31
+ "react-use": "*",
32
+ "react-router-dom": "*"
31
33
  },
32
34
  "devDependencies": {
33
35
  "@types/lodash": "*",