@faasjs/ant-design 0.0.2-beta.405 → 0.0.2-beta.407

package/dist/index.mjs

@@ -6,7 +6,12 @@ import { Typography } from "antd";
 import { isNil } from "lodash";
 
 // src/Config.tsx
-import { createContext, useContext } from "react";
+import {
+  createContext,
+  useContext
+} from "react";
+import { ConfigProvider as AntdConfigProvider } from "antd";
+import { defaultsDeep } from "lodash";
 import { jsx } from "react/jsx-runtime";
 var isZH = /^zh/i.test(navigator.language);
 var common = isZH ? {
@@ -29,6 +34,7 @@ var common = isZH ? {
   required: "is required"
 };
 var baseConfig = {
+  antd: {},
   lang: "en",
   common,
   Blank: { text: common.blank },
@@ -36,7 +42,8 @@ var baseConfig = {
   Title: {
     separator: " - ",
     suffix: ""
-  }
+  },
+  Link: { style: {} }
 };
 var ConfigContext = createContext(baseConfig);
 function ConfigProvider({
@@ -44,11 +51,11 @@ function ConfigProvider({
   children
 }) {
   return /* @__PURE__ */ jsx(ConfigContext.Provider, {
-    value: {
-      ...baseConfig,
-      ...config
-    },
-    children
+    value: defaultsDeep(config, baseConfig),
+    children: /* @__PURE__ */ jsx(AntdConfigProvider, {
+      ...config.antd,
+      children
+    })
   });
 }
 function useConfigContext() {
@@ -58,10 +65,10 @@ function useConfigContext() {
 // src/Blank.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 function Blank(options) {
-  const config = useConfigContext();
+  const { Blank: Blank2 } = useConfigContext();
   return !options || isNil(options.value) || Array.isArray(options.value) && !options.value.length || options.value === "" ? /* @__PURE__ */ jsx2(Typography.Text, {
     disabled: true,
-    children: (options == null ? void 0 : options.text) || config.Blank.text
+    children: (options == null ? void 0 : options.text) || Blank2.text
   }) : options.value;
 }
 
@@ -291,6 +298,7 @@ var TimePicker = forwardRef((props, ref) => {
 TimePicker.displayName = "TimePicker";
 
 // src/FormItem.tsx
+import dayjs2, { isDayjs } from "dayjs";
 import { Fragment as Fragment2, jsx as jsx6, jsxs } from "react/jsx-runtime";
 function processProps(propsCopy, config) {
   if (!propsCopy.title)
@@ -338,19 +346,45 @@ function processProps(propsCopy, config) {
   }
   return propsCopy;
 }
+function DateItem(options) {
+  const [value, setValue] = useState3();
+  useEffect2(() => {
+    setValue(options.value && !isDayjs(options.value) ? dayjs2(options.value) : null);
+  }, [options.value]);
+  return /* @__PURE__ */ jsx6(DatePicker, {
+    ...options,
+    value
+  });
+}
+function TimeItem(options) {
+  const [value, setValue] = useState3();
+  useEffect2(() => {
+    setValue(options.value && !isDayjs(options.value) ? dayjs2(options.value) : null);
+  }, [options.value]);
+  return /* @__PURE__ */ jsx6(TimePicker, {
+    ...options,
+    value
+  });
+}
 function FormItem(props) {
   var _a;
   const [computedProps, setComputedProps] = useState3();
+  const [extendTypes, setExtendTypes] = useState3();
   const config = useConfigContext();
   useEffect2(() => {
-    setComputedProps(processProps({ ...props }, config));
+    const propsCopy = { ...props };
+    if (propsCopy.extendTypes) {
+      setExtendTypes(propsCopy.extendTypes);
+      delete propsCopy.extendTypes;
+    }
+    setComputedProps(processProps(propsCopy, config));
   }, [props]);
   if (!computedProps)
     return null;
-  if (computedProps.extendTypes && computedProps.extendTypes[computedProps.type])
+  if (extendTypes && extendTypes[computedProps.type])
     return /* @__PURE__ */ jsx6(AntdForm.Item, {
       ...computedProps,
-      children: computedProps.extendTypes[computedProps.type].children
+      children: extendTypes[computedProps.type].children
     });
   if (computedProps.children)
     return /* @__PURE__ */ jsx6(AntdForm.Item, {
@@ -535,14 +569,14 @@ function FormItem(props) {
     case "date":
       return /* @__PURE__ */ jsx6(AntdForm.Item, {
         ...computedProps,
-        children: /* @__PURE__ */ jsx6(DatePicker, {
+        children: /* @__PURE__ */ jsx6(DateItem, {
           ...computedProps.input
         })
       });
     case "time":
       return /* @__PURE__ */ jsx6(AntdForm.Item, {
         ...computedProps,
-        children: /* @__PURE__ */ jsx6(TimePicker, {
+        children: /* @__PURE__ */ jsx6(TimeItem, {
           ...computedProps.input
         })
       });
@@ -631,6 +665,7 @@ function Form(props) {
   const [loading, setLoading] = useState4(false);
   const [computedProps, setComputedProps] = useState4();
   const config = useConfigContext();
+  const [extendTypes, setExtendTypes] = useState4();
   useEffect3(() => {
     var _a2;
     const propsCopy = { ...props };
@@ -659,6 +694,10 @@ function Form(props) {
         } : values);
       };
     }
+    if (propsCopy.extendTypes) {
+      setExtendTypes(propsCopy.extendTypes);
+      delete propsCopy.extendTypes;
+    }
     setComputedProps(propsCopy);
   }, []);
   if (!computedProps)
@@ -669,7 +708,7 @@ function Form(props) {
       computedProps.beforeItems,
       (_a = computedProps.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ jsx7(FormItem, {
         ...item,
-        extendTypes: computedProps.extendTypes
+        extendTypes
       }, item.id)),
       computedProps.children,
       computedProps.submit !== false && /* @__PURE__ */ jsx7(Button2, {
@@ -685,10 +724,33 @@ function Form(props) {
 Form.useForm = AntdForm2.useForm;
 Form.Item = FormItem;
 
+// src/Link.tsx
+import { Link as RouterLink } from "react-router-dom";
+import { jsx as jsx8 } from "react/jsx-runtime";
+function Link({
+  href,
+  target,
+  text,
+  children,
+  style
+}) {
+  const { Link: Link2 } = useConfigContext();
+  style = Object.assign({ cursor: "pointer" }, style);
+  return /* @__PURE__ */ jsx8(RouterLink, {
+    to: href,
+    target: target || (Link2 == null ? void 0 : Link2.target),
+    style: {
+      ...Link2.style,
+      ...style || {}
+    },
+    children: text || children
+  });
+}
+
 // src/Modal.tsx
 import { Modal } from "antd";
 import { useState as useState5 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 function useModal(init) {
   const [props, setProps] = useState5({
     visible: false,
@@ -699,7 +761,7 @@ function useModal(init) {
     ...init
   });
   return {
-    modal: /* @__PURE__ */ jsx8(Modal, {
+    modal: /* @__PURE__ */ jsx9(Modal, {
       ...props
     }),
     modalProps: props,
@@ -721,10 +783,10 @@ import {
   Routes as OriginRoutes,
   Route
 } from "react-router-dom";
-import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
 function NotFound() {
   const config = useConfigContext();
-  return /* @__PURE__ */ jsx9(Result, {
+  return /* @__PURE__ */ jsx10(Result, {
     status: "404",
     title: config.common.pageNotFound
   });
@@ -732,21 +794,21 @@ function NotFound() {
 function Routes(props) {
   return /* @__PURE__ */ jsxs3(OriginRoutes, {
     children: [
-      props.routes.map((r) => /* @__PURE__ */ jsx9(Route, {
+      props.routes.map((r) => /* @__PURE__ */ jsx10(Route, {
         ...r,
-        element: r.element || /* @__PURE__ */ jsx9(Suspense, {
-          fallback: props.fallback || /* @__PURE__ */ jsx9("div", {
+        element: r.element || /* @__PURE__ */ jsx10(Suspense, {
+          fallback: props.fallback || /* @__PURE__ */ jsx10("div", {
             style: { padding: "24px" },
-            children: /* @__PURE__ */ jsx9(Skeleton2, {
+            children: /* @__PURE__ */ jsx10(Skeleton2, {
               active: true
             })
           }),
-          children: /* @__PURE__ */ jsx9(r.page, {})
+          children: /* @__PURE__ */ jsx10(r.page, {})
         })
       }, r.path)),
-      /* @__PURE__ */ jsx9(Route, {
+      /* @__PURE__ */ jsx10(Route, {
         path: "*",
-        element: props.notFound || /* @__PURE__ */ jsx9(NotFound, {})
+        element: props.notFound || /* @__PURE__ */ jsx10(NotFound, {})
       }, "*")
     ]
   });
@@ -763,11 +825,11 @@ import {
   Radio,
   Skeleton as Skeleton3
 } from "antd";
-import dayjs2 from "dayjs";
+import dayjs3 from "dayjs";
 import { CheckOutlined as CheckOutlined2, CloseOutlined as CloseOutlined2 } from "@ant-design/icons";
 import { isNil as isNil2, upperFirst as upperFirst4 } from "lodash";
 import { FaasDataWrapper as FaasDataWrapper2 } from "@faasjs/react";
-import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
 function processValue(item, value) {
   var _a;
   if (typeof value !== "undefined" && value !== null) {
@@ -792,7 +854,7 @@ function processValue(item, value) {
     if (["date", "time"].includes(item.type)) {
       if (typeof value === "number" && value.toString().length === 10)
         value = value * 1e3;
-      value = dayjs2(value).format(dayjsFormat);
+      value = dayjs3(value).format(dayjsFormat);
     }
   }
   return value;
@@ -856,12 +918,12 @@ function Table(props) {
             item.onFilter = (value, row) => row[item.id].includes(value);
           break;
         case "boolean":
-          item.render = (value) => typeof value === "undefined" ? /* @__PURE__ */ jsx10(Blank, {}) : value ? /* @__PURE__ */ jsx10(CheckOutlined2, {
+          item.render = (value) => typeof value === "undefined" ? /* @__PURE__ */ jsx11(Blank, {}) : value ? /* @__PURE__ */ jsx11(CheckOutlined2, {
             style: {
               marginTop: "4px",
               color: "#52c41a"
             }
-          }) : /* @__PURE__ */ jsx10(CloseOutlined2, {
+          }) : /* @__PURE__ */ jsx11(CloseOutlined2, {
             style: {
               marginTop: "4px",
               color: "#ff4d4f"
@@ -881,28 +943,28 @@ function Table(props) {
                 confirm();
               },
               children: [
-                /* @__PURE__ */ jsx10(Radio.Button, {
+                /* @__PURE__ */ jsx11(Radio.Button, {
                   children: config.common.all
                 }),
-                /* @__PURE__ */ jsx10(Radio.Button, {
+                /* @__PURE__ */ jsx11(Radio.Button, {
                   value: "true",
-                  children: /* @__PURE__ */ jsx10(CheckOutlined2, {
+                  children: /* @__PURE__ */ jsx11(CheckOutlined2, {
                     style: {
                       color: "#52c41a",
                       verticalAlign: "middle"
                     }
                   })
                 }),
-                /* @__PURE__ */ jsx10(Radio.Button, {
+                /* @__PURE__ */ jsx11(Radio.Button, {
                   value: "false",
-                  children: /* @__PURE__ */ jsx10(CloseOutlined2, {
+                  children: /* @__PURE__ */ jsx11(CloseOutlined2, {
                     style: {
                       verticalAlign: "middle",
                       color: "#ff4d4f"
                     }
                   })
                 }),
-                /* @__PURE__ */ jsx10(Radio.Button, {
+                /* @__PURE__ */ jsx11(Radio.Button, {
                   value: "empty",
                   children: config.common.blank
                 })
@@ -925,12 +987,12 @@ function Table(props) {
         case "date":
           item.render = (value) => processValue(item, value);
           if (!item.onFilter)
-            item.onFilter = (value, row) => dayjs2(row[item.id]).isSame(dayjs2(value));
+            item.onFilter = (value, row) => dayjs3(row[item.id]).isSame(dayjs3(value));
           break;
         case "time":
           item.render = (value) => processValue(item, value);
           if (!item.onFilter)
-            item.onFilter = (value, row) => dayjs2(row[item.id]).isSame(dayjs2(value));
+            item.onFilter = (value, row) => dayjs3(row[item.id]).isSame(dayjs3(value));
           break;
         default:
           item.render = (value) => processValue(item, value);
@@ -944,14 +1006,14 @@ function Table(props) {
   if (!columns)
     return null;
   if (!props.faasData)
-    return /* @__PURE__ */ jsx10(AntdTable, {
+    return /* @__PURE__ */ jsx11(AntdTable, {
       ...props,
       rowKey: props.rowKey || "id",
       columns,
       dataSource: props.dataSource
     });
-  return /* @__PURE__ */ jsx10(FaasDataWrapper2, {
-    fallback: props.faasData.fallback || /* @__PURE__ */ jsx10(Skeleton3, {
+  return /* @__PURE__ */ jsx11(FaasDataWrapper2, {
+    fallback: props.faasData.fallback || /* @__PURE__ */ jsx11(Skeleton3, {
       active: true
     }),
     render: ({
@@ -960,20 +1022,20 @@ function Table(props) {
       reload
     }) => {
       if (!data)
-        return /* @__PURE__ */ jsx10(AntdTable, {
+        return /* @__PURE__ */ jsx11(AntdTable, {
           ...props,
           rowKey: props.rowKey || "id",
           columns,
           dataSource: []
         });
       if (Array.isArray(data))
-        return /* @__PURE__ */ jsx10(AntdTable, {
+        return /* @__PURE__ */ jsx11(AntdTable, {
           ...props,
           rowKey: props.rowKey || "id",
           columns,
           dataSource: data
         });
-      return /* @__PURE__ */ jsx10(AntdTable, {
+      return /* @__PURE__ */ jsx11(AntdTable, {
         ...props,
         rowKey: props.rowKey || "id",
         columns,
@@ -1008,7 +1070,7 @@ function Table(props) {
 
 // src/Title.tsx
 import { useEffect as useEffect5, cloneElement as cloneElement3 } from "react";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 function Title(props) {
   const config = useConfigContext();
   useEffect5(() => {
@@ -1017,10 +1079,10 @@ function Title(props) {
   }, []);
   if (props.h1) {
     if (typeof props.h1 === "boolean")
-      return /* @__PURE__ */ jsx11("h1", {
+      return /* @__PURE__ */ jsx12("h1", {
         children: Array.isArray(props.title) ? props.title[0] : props.title
       });
-    return /* @__PURE__ */ jsx11("h1", {
+    return /* @__PURE__ */ jsx12("h1", {
       className: props.h1.className,
       style: props.h1.style,
       children: Array.isArray(props.title) ? props.title[0] : props.title
@@ -1040,6 +1102,7 @@ export {
   Drawer,
   Form,
   FormItem,
+  Link,
   Modal,
   Routes,
   Table,

package/package.json

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