@faasjs/ant-design 0.0.3-beta.2 → 0.0.3-beta.21

package/dist/index.mjs

@@ -12,7 +12,6 @@ import {
   useEffect,
   useState
 } from "react";
-import { ConfigProvider as AntdConfigProvider } from "antd";
 import { defaultsDeep } from "lodash-es";
 import { jsx } from "react/jsx-runtime";
 var isZH = /^zh/i.test(navigator.language);
@@ -72,10 +71,7 @@ function ConfigProvider({
   }, []);
   return /* @__PURE__ */ jsx(ConfigContext.Provider, {
     value: values,
-    children: /* @__PURE__ */ jsx(AntdConfigProvider, {
-      ...config.antd,
-      children
-    })
+    children
   });
 }
 function useConfigContext() {
@@ -181,7 +177,10 @@ function DescriptionItemContent(props) {
     else
       throw Error(computedProps.item.type + " requires children or render");
   if (computedProps.item.children)
-    return cloneElement(computedProps.item.children, { value: computedProps.value });
+    return cloneElement(computedProps.item.children, {
+      value: computedProps.value,
+      values: computedProps.values
+    });
   if (computedProps.item.render)
     return /* @__PURE__ */ jsx3(Fragment, {
       children: computedProps.item.render(computedProps.value, computedProps.values)
@@ -320,7 +319,8 @@ import {
 import {
   useEffect as useEffect4,
   useState as useState5,
-  useCallback
+  useCallback,
+  isValidElement
 } from "react";
 
 // src/FormItem.tsx
@@ -360,13 +360,13 @@ function processProps(propsCopy, config) {
         required: true,
         validator: async (_, values) => {
           if (!values || values.length < 1)
-            return Promise.reject(Error(`${propsCopy.label || propsCopy.title} ${config.common.required}`));
+            return Promise.reject(Error(`${propsCopy.label || propsCopy.title} ${config.required}`));
         }
       });
     else
       propsCopy.rules.push({
         required: true,
-        message: `${propsCopy.label || propsCopy.title} ${config.common.required}`
+        message: `${propsCopy.label || propsCopy.title} ${config.required}`
       });
   }
   if (!propsCopy.input)
@@ -393,8 +393,8 @@ function FormItem(props) {
   var _a;
   const [computedProps, setComputedProps] = useState4();
   const [extendTypes, setExtendTypes] = useState4();
-  const config = useConfigContext();
-  const [hidden, setHidden] = useState4(false);
+  const { common: common2 } = useConfigContext();
+  const [hidden, setHidden] = useState4(props.hidden || false);
   useEffect3(() => {
     const propsCopy = { ...props };
     if (propsCopy.extendTypes) {
@@ -403,14 +403,18 @@ function FormItem(props) {
     }
     if (propsCopy.if) {
       const condition = propsCopy.if;
-      propsCopy.shouldUpdate = (_, cur) => {
+      const originShouldUpdate = propsCopy.shouldUpdate;
+      propsCopy.shouldUpdate = (prev, cur) => {
         const show = condition(cur);
+        const shouldUpdate = hidden !== show;
         setHidden(!show);
-        return show;
+        const origin = originShouldUpdate ? typeof originShouldUpdate === "boolean" ? originShouldUpdate : originShouldUpdate(prev, cur, {}) : true;
+        return shouldUpdate || origin;
       };
       delete propsCopy.if;
+      delete propsCopy.hidden;
     }
-    setComputedProps(processProps(propsCopy, config));
+    setComputedProps(processProps(propsCopy, common2));
   }, [props]);
   if (!computedProps)
     return null;
@@ -657,7 +661,7 @@ function FormItem(props) {
                         danger: true,
                         type: "link",
                         onClick: () => remove(field.name),
-                        children: config.common.delete
+                        children: common2.delete
                       })
                     ]
                   })
@@ -682,7 +686,7 @@ function FormItem(props) {
                   onClick: () => add(),
                   icon: /* @__PURE__ */ jsx5(PlusOutlined, {}),
                   children: [
-                    config.common.add,
+                    common2.add,
                     " ",
                     computedProps.label
                   ]
@@ -717,11 +721,19 @@ function Form(props) {
       form
     };
     if (propsCopy.initialValues) {
-      for (const key in propsCopy.initialValues)
+      for (const key in propsCopy.initialValues) {
         propsCopy.initialValues[key] = transferValue(
-          (_a2 = propsCopy.items.find((item) => item.id === key)) == null ? void 0 : _a2.type,
+          (_a2 = propsCopy.items.find((item2) => item2.id === key)) == null ? void 0 : _a2.type,
           propsCopy.initialValues[key]
         );
+        const item = propsCopy.items.find((item2) => item2.id === key);
+        if (item == null ? void 0 : item.if)
+          item.hidden = !item.if(propsCopy.initialValues);
+      }
+      for (const item of propsCopy.items) {
+        if (item.if)
+          item.hidden = !item.if(propsCopy.initialValues);
+      }
       setInitialValues(propsCopy.initialValues);
       delete propsCopy.initialValues;
     }
@@ -758,6 +770,7 @@ function Form(props) {
     setComputedProps(propsCopy);
   }, [props]);
   const onValuesChange = useCallback((changedValues, allValues) => {
+    console.debug("Form:onValuesChange", changedValues, allValues);
     if (props.onValuesChange) {
       props.onValuesChange(changedValues, allValues);
     }
@@ -772,6 +785,7 @@ function Form(props) {
   useEffect4(() => {
     if (!initialValues)
       return;
+    console.debug("Form:initialValues", initialValues);
     form.setFieldsValue(initialValues);
     setInitialValues(null);
   }, [computedProps]);
@@ -782,7 +796,7 @@ function Form(props) {
     onValuesChange,
     children: [
       computedProps.beforeItems,
-      (_a = computedProps.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx6(FormItem, {
+      (_a = computedProps.items) == null ? void 0 : _a.map((item) => isValidElement(item) ? item : /* @__PURE__ */ jsx6(FormItem, {
         ...item,
         extendTypes
       }, item.id)),
@@ -817,15 +831,13 @@ function Link({
     if (button)
       return /* @__PURE__ */ jsx7(Button3, {
         ...button,
-        children: /* @__PURE__ */ jsx7("a", {
-          href,
-          target: target || (Link2 == null ? void 0 : Link2.target) || "_blank",
-          style: {
-            ...Link2.style,
-            ...style || {}
-          },
-          children: text || children
-        })
+        target: target || (Link2 == null ? void 0 : Link2.target) || "_blank",
+        style: {
+          ...Link2.style,
+          ...style || {}
+        },
+        href,
+        children: text != null ? text : children
       });
     return /* @__PURE__ */ jsx7("a", {
       href,
@@ -834,20 +846,20 @@ function Link({
         ...Link2.style,
         ...style || {}
       },
-      children: text || children
+      children: text != null ? text : children
     });
   }
   if (button)
-    return /* @__PURE__ */ jsx7(Button3, {
-      ...button,
-      children: /* @__PURE__ */ jsx7(RouterLink, {
-        to: href,
-        target: target || (Link2 == null ? void 0 : Link2.target),
+    return /* @__PURE__ */ jsx7(RouterLink, {
+      to: href,
+      target: target || (Link2 == null ? void 0 : Link2.target),
+      children: /* @__PURE__ */ jsx7(Button3, {
+        ...button,
         style: {
           ...Link2.style,
           ...style || {}
         },
-        children: text || children
+        children: text != null ? text : children
       })
     });
   return /* @__PURE__ */ jsx7(RouterLink, {
@@ -857,7 +869,7 @@ function Link({
       ...Link2.style,
       ...style || {}
     },
-    children: text || children
+    children: text != null ? text : children
   });
 }
 
@@ -947,7 +959,9 @@ import {
   uniqBy,
   upperFirst as upperFirst4
 } from "lodash-es";
-import { FaasDataWrapper as FaasDataWrapper2 } from "@faasjs/react";
+import {
+  FaasDataWrapper as FaasDataWrapper2
+} from "@faasjs/react";
 import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
 function processValue(item, value) {
   var _a;
@@ -992,10 +1006,19 @@ function Table(props) {
         item.filters = item.options.map((o) => ({
           text: o.label,
           value: o.value
-        }));
+        })).concat({
+          text: /* @__PURE__ */ jsx10(Blank, {}),
+          value: null
+        });
       }
       if (item.children)
-        delete item.children;
+        item.render = (value, values) => cloneElement2(
+          item.children,
+          {
+            value,
+            values
+          }
+        );
       if (props.extendTypes && props.extendTypes[item.type]) {
         if (props.extendTypes[item.type].children)
           item.render = (value, values) => cloneElement2(
@@ -1015,8 +1038,10 @@ function Table(props) {
         case "string":
           if (!item.render)
             item.render = (value) => processValue(item, value);
-          if (!item.onFilter)
+          if (!props.faasData && !item.onFilter)
             item.onFilter = (value, row) => {
+              if (value === null && isNil2(row[item.id]))
+                return true;
               if (!row[item.id])
                 return false;
               return row[item.id].toLowerCase().includes(value.toLowerCase());
@@ -1043,8 +1068,10 @@ function Table(props) {
         case "string[]":
           if (!item.render)
             item.render = (value) => processValue(item, value);
-          if (!item.onFilter)
+          if (!props.faasData && !item.onFilter)
             item.onFilter = (value, row) => {
+              if (value === null && (!row[item.id] || !row[item.id].length))
+                return true;
               if (!row[item.id] || !row[item.id].length)
                 return false;
               return row[item.id].some((v) => v.toLowerCase().includes(value.toLowerCase()));
@@ -1073,8 +1100,12 @@ function Table(props) {
             item.render = (value) => processValue(item, value);
           if (!item.sorter)
             item.sorter = (a, b) => a[item.id] - b[item.id];
-          if (!item.onFilter)
-            item.onFilter = (value, row) => value === row[item.id];
+          if (!props.faasData && !item.onFilter)
+            item.onFilter = (value, row) => {
+              if (value === null && isNil2(row[item.id]))
+                return true;
+              return value == row[item.id];
+            };
           if (!item.filters && item.filterDropdown !== false)
             item.filterDropdown = ({
               setSelectedKeys,
@@ -1097,8 +1128,14 @@ function Table(props) {
         case "number[]":
           if (!item.render)
             item.render = (value) => processValue(item, value).join(", ");
-          if (!item.onFilter)
-            item.onFilter = (value, row) => row[item.id].includes(value);
+          if (!props.faasData && !item.onFilter)
+            item.onFilter = (value, row) => {
+              if (value === null && (!row[item.id] || !row[item.id].length))
+                return true;
+              if (!row[item.id] || !row[item.id].length)
+                return false;
+              return row[item.id].includes(Number(value));
+            };
           if (!item.filters && item.filterDropdown !== false)
             item.filterDropdown = ({
               setSelectedKeys,
@@ -1172,7 +1209,7 @@ function Table(props) {
                 })
               ]
             });
-          if (!item.onFilter)
+          if (!props.faasData && !item.onFilter)
             item.onFilter = (value, row) => {
               switch (value) {
                 case "true":
@@ -1189,7 +1226,7 @@ function Table(props) {
         case "date":
           if (!item.render)
             item.render = (value) => processValue(item, value);
-          if (!item.onFilter)
+          if (!props.faasData && !item.onFilter)
             item.onFilter = (value, row) => dayjs2(row[item.id]).isSame(dayjs2(value));
           if (!item.sorter)
             item.sorter = (a, b) => dayjs2(a[item.id]).isBefore(b[item.id]) ? -1 : 1;
@@ -1197,7 +1234,7 @@ function Table(props) {
         case "time":
           if (!item.render)
             item.render = (value) => processValue(item, value);
-          if (!item.onFilter)
+          if (!props.faasData && !item.onFilter)
             item.onFilter = (value, row) => dayjs2(row[item.id]).isSame(dayjs2(value));
           if (!item.sorter)
             item.sorter = (a, b) => dayjs2(a[item.id]).isBefore(b[item.id]) ? -1 : 1;
@@ -1222,7 +1259,11 @@ function Table(props) {
           if (!item.render)
             item.render = (value) => processValue(item, value);
           if (!item.onFilter)
-            item.onFilter = (value, row) => value === row[item.id];
+            item.onFilter = (value, row) => {
+              if (value === null && isNil2(row[item.id]))
+                return true;
+              return value === row[item.id];
+            };
           break;
       }
     }
@@ -1239,7 +1280,10 @@ function Table(props) {
           newColumns[index].filters = uniqBy(props.dataSource, column.id).map((v) => ({
             text: v[column.id],
             value: v[column.id]
-          }));
+          })).concat({
+            text: /* @__PURE__ */ jsx10(Blank, {}),
+            value: null
+          });
           return newColumns;
         });
       }
@@ -1258,55 +1302,95 @@ function Table(props) {
     fallback: props.faasData.fallback || /* @__PURE__ */ jsx10(Skeleton3, {
       active: true
     }),
-    render: ({
-      data,
-      params,
-      reload
-    }) => {
-      if (!data)
-        return /* @__PURE__ */ jsx10(AntdTable, {
-          ...props,
-          rowKey: props.rowKey || "id",
-          columns,
-          dataSource: []
-        });
-      if (Array.isArray(data))
-        return /* @__PURE__ */ jsx10(AntdTable, {
-          ...props,
-          rowKey: props.rowKey || "id",
-          columns,
-          dataSource: data
-        });
-      return /* @__PURE__ */ jsx10(AntdTable, {
-        ...props,
-        rowKey: props.rowKey || "id",
-        columns,
-        dataSource: data.rows,
-        pagination: {
-          ...props.pagination,
-          ...data.pagination
-        },
-        onChange: (pagination, filters, sorter, extra) => {
-          if (props.onChange) {
-            const processed = props.onChange(pagination, filters, sorter, extra);
-            reload({
-              ...params,
-              pagination: processed.pagination,
-              filters: processed.filters,
-              sorter: processed.sorter
-            });
-            return;
-          }
-          reload({
-            ...params,
-            pagination,
-            filters,
-            sorter
+    ...props.faasData,
+    children: /* @__PURE__ */ jsx10(FaasDataTable, {
+      props,
+      columns
+    })
+  });
+}
+function FaasDataTable({
+  props,
+  columns,
+  data,
+  params,
+  reload
+}) {
+  const [currentColumns, setCurrentColumns] = useState7(columns);
+  useEffect5(() => {
+    if (!data || Array.isArray(data))
+      return;
+    setCurrentColumns((prev) => {
+      const newColumns = [...prev];
+      for (const column of newColumns) {
+        if (data["options"][column.id]) {
+          column.options = data["options"][column.id];
+          column.filters = data["options"][column.id].map((v) => ({
+            text: v.label,
+            value: v.value
+          })).concat({
+            text: /* @__PURE__ */ jsx10(Blank, {}),
+            value: null
           });
+          column.render = (value) => processValue(column, value);
+          if (column.filterDropdown)
+            delete column.filterDropdown;
+          continue;
         }
-      });
+        if (column.optionsType === "auto" && !column.options && !column.filters) {
+          column.filters = uniqBy(props.dataSource, column.id).map((v) => ({
+            text: v[column.id],
+            value: v[column.id]
+          })).concat({
+            text: /* @__PURE__ */ jsx10(Blank, {}),
+            value: null
+          });
+        }
+      }
+      return newColumns;
+    });
+  }, [columns, data]);
+  if (!data)
+    return /* @__PURE__ */ jsx10(AntdTable, {
+      ...props,
+      rowKey: props.rowKey || "id",
+      columns: currentColumns,
+      dataSource: []
+    });
+  if (Array.isArray(data))
+    return /* @__PURE__ */ jsx10(AntdTable, {
+      ...props,
+      rowKey: props.rowKey || "id",
+      columns: currentColumns,
+      dataSource: data
+    });
+  return /* @__PURE__ */ jsx10(AntdTable, {
+    ...props,
+    rowKey: props.rowKey || "id",
+    columns: currentColumns,
+    dataSource: data.rows,
+    pagination: {
+      ...props.pagination,
+      ...data.pagination
     },
-    ...props.faasData
+    onChange: (pagination, filters, sorter, extra) => {
+      if (props.onChange) {
+        const processed = props.onChange(pagination, filters, sorter, extra);
+        reload({
+          ...params,
+          pagination: processed.pagination,
+          filters: processed.filters,
+          sorter: processed.sorter
+        });
+        return;
+      }
+      reload({
+        ...params,
+        pagination,
+        filters,
+        sorter
+      });
+    }
   });
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/ant-design",
-  "version": "0.0.3-beta.2",
+  "version": "0.0.3-beta.21",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -28,7 +28,7 @@
     "lodash-es": "*",
     "react": "*",
     "react-dom": "*",
-    "@faasjs/react": "^0.0.3-beta.2",
+    "@faasjs/react": "^0.0.3-beta.21",
     "react-router-dom": "*",
     "dayjs": "*"
   },