@faasjs/ant-design 0.0.2-beta.403 → 0.0.2-beta.406

package/dist/index.d.ts

@@ -222,15 +222,16 @@ declare type FormItemInputProps = StringProps | StringListProps | NumberProps |
 declare type ExtendFormTypeProps = {
     children?: JSX.Element | null;
 };
+declare type ExtendTypes = {
+    [type: string]: ExtendFormTypeProps;
+};
 declare type ExtendFormItemProps = BaseItemProps & FormItemProps$1;
 declare type FormItemProps<T = any> = {
     children?: JSX.Element | null;
     render?: () => JSX.Element | null;
     rules?: RuleObject[];
     label?: string | false;
-    extendTypes?: {
-        [type: string]: ExtendFormTypeProps;
-    };
+    extendTypes?: ExtendTypes;
 } & FormItemInputProps & FaasItemProps & Omit<FormItemProps$1<T>, 'children'>;
 /**
  * FormItem, can be used without Form.
@@ -287,9 +288,7 @@ declare type FormProps<Values = any, ExtendItemProps = any> = {
     onFinish?: (values: Values, submit?: (values: any) => Promise<any>) => Promise<any>;
     beforeItems?: JSX.Element | JSX.Element[];
     footer?: JSX.Element | JSX.Element[];
-    extendTypes?: {
-        [type: string]: ExtendFormTypeProps;
-    };
+    extendTypes?: ExtendTypes;
     children?: ReactNode;
 } & Omit<FormProps$1<Values>, 'onFinish' | 'children'>;
 declare function Form<Values = any>(props: FormProps<Values>): JSX.Element;
@@ -390,4 +389,4 @@ declare type TitleProps = {
  */
 declare function Title(props: TitleProps): JSX.Element;
 
-export { BaseItemProps, BaseOption, Blank, BlankProps, Calendar, CalendarProps, ConfigContext, ConfigProvider, DatePicker, DatePickerProps, Description, DescriptionItemProps, DescriptionProps, DrawerProps, ExtendDescriptionItemProps, ExtendDescriptionTypeProps, ExtendFormItemProps, ExtendFormTypeProps, ExtendTableItemProps, ExtendTableTypeProps, FaasItemProps, FaasItemType, FaasItemTypeValue, FaasState, Form, FormItem, FormItemProps, FormProps, ModalProps, Routes, RoutesProps, Table, TableItemProps, TableProps, TimePicker, TimePickerProps, Title, TitleProps, setDrawerProps, setModalProps, transferOptions, useConfigContext, useDrawer, useModal };
+export { BaseItemProps, BaseOption, Blank, BlankProps, Calendar, CalendarProps, ConfigContext, ConfigProvider, DatePicker, DatePickerProps, Description, DescriptionItemProps, DescriptionProps, DrawerProps, ExtendDescriptionItemProps, ExtendDescriptionTypeProps, ExtendFormItemProps, ExtendFormTypeProps, ExtendTableItemProps, ExtendTableTypeProps, ExtendTypes, FaasItemProps, FaasItemType, FaasItemTypeValue, FaasState, Form, FormItem, FormItemProps, FormProps, ModalProps, Routes, RoutesProps, Table, TableItemProps, TableProps, TimePicker, TimePickerProps, Title, TitleProps, setDrawerProps, setModalProps, transferOptions, useConfigContext, useDrawer, useModal };

package/dist/index.js

@@ -318,6 +318,7 @@ var TimePicker = (0, import_react6.forwardRef)((props, ref) => {
 TimePicker.displayName = "TimePicker";
 
 // src/FormItem.tsx
+var import_dayjs4 = __toESM(require("dayjs"));
 var import_jsx_runtime = require("react/jsx-runtime");
 function processProps(propsCopy, config) {
   if (!propsCopy.title)
@@ -365,19 +366,45 @@ function processProps(propsCopy, config) {
   }
   return propsCopy;
 }
+function DateItem(options) {
+  const [value, setValue] = (0, import_react7.useState)();
+  (0, import_react7.useEffect)(() => {
+    setValue(options.value && !(0, import_dayjs4.isDayjs)(options.value) ? (0, import_dayjs4.default)(options.value) : null);
+  }, [options.value]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DatePicker, {
+    ...options,
+    value
+  });
+}
+function TimeItem(options) {
+  const [value, setValue] = (0, import_react7.useState)();
+  (0, import_react7.useEffect)(() => {
+    setValue(options.value && !(0, import_dayjs4.isDayjs)(options.value) ? (0, import_dayjs4.default)(options.value) : null);
+  }, [options.value]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimePicker, {
+    ...options,
+    value
+  });
+}
 function FormItem(props) {
   var _a;
   const [computedProps, setComputedProps] = (0, import_react7.useState)();
+  const [extendTypes, setExtendTypes] = (0, import_react7.useState)();
   const config = useConfigContext();
   (0, import_react7.useEffect)(() => {
-    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__ */ (0, import_jsx_runtime.jsx)(import_antd4.Form.Item, {
       ...computedProps,
-      children: computedProps.extendTypes[computedProps.type].children
+      children: extendTypes[computedProps.type].children
     });
   if (computedProps.children)
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd4.Form.Item, {
@@ -562,14 +589,14 @@ function FormItem(props) {
     case "date":
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd4.Form.Item, {
         ...computedProps,
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DatePicker, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DateItem, {
           ...computedProps.input
         })
       });
     case "time":
       return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd4.Form.Item, {
         ...computedProps,
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimePicker, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimeItem, {
           ...computedProps.input
         })
       });
@@ -658,6 +685,7 @@ function Form(props) {
   const [loading, setLoading] = (0, import_react9.useState)(false);
   const [computedProps, setComputedProps] = (0, import_react9.useState)();
   const config = useConfigContext();
+  const [extendTypes, setExtendTypes] = (0, import_react9.useState)();
   (0, import_react9.useEffect)(() => {
     var _a2;
     const propsCopy = { ...props };
@@ -686,6 +714,10 @@ function Form(props) {
         } : values);
       };
     }
+    if (propsCopy.extendTypes) {
+      setExtendTypes(propsCopy.extendTypes);
+      delete propsCopy.extendTypes;
+    }
     setComputedProps(propsCopy);
   }, []);
   if (!computedProps)
@@ -696,7 +728,7 @@ function Form(props) {
       computedProps.beforeItems,
       (_a = computedProps.items) == null ? void 0 : _a.map((item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormItem, {
         ...item,
-        extendTypes: computedProps.extendTypes
+        extendTypes
       }, item.id)),
       computedProps.children,
       computedProps.submit !== false && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd5.Button, {
@@ -777,7 +809,7 @@ function Routes(props) {
 // src/Table.tsx
 var import_react12 = require("react");
 var import_antd8 = require("antd");
-var import_dayjs4 = __toESM(require("dayjs"));
+var import_dayjs5 = __toESM(require("dayjs"));
 var import_icons3 = require("@ant-design/icons");
 var import_lodash5 = require("lodash");
 var import_react13 = require("@faasjs/react");
@@ -806,7 +838,7 @@ function processValue(item, value) {
     if (["date", "time"].includes(item.type)) {
       if (typeof value === "number" && value.toString().length === 10)
         value = value * 1e3;
-      value = (0, import_dayjs4.default)(value).format(dayjsFormat);
+      value = (0, import_dayjs5.default)(value).format(dayjsFormat);
     }
   }
   return value;
@@ -939,12 +971,12 @@ function Table(props) {
         case "date":
           item.render = (value) => processValue(item, value);
           if (!item.onFilter)
-            item.onFilter = (value, row) => (0, import_dayjs4.default)(row[item.id]).isSame((0, import_dayjs4.default)(value));
+            item.onFilter = (value, row) => (0, import_dayjs5.default)(row[item.id]).isSame((0, import_dayjs5.default)(value));
           break;
         case "time":
           item.render = (value) => processValue(item, value);
           if (!item.onFilter)
-            item.onFilter = (value, row) => (0, import_dayjs4.default)(row[item.id]).isSame((0, import_dayjs4.default)(value));
+            item.onFilter = (value, row) => (0, import_dayjs5.default)(row[item.id]).isSame((0, import_dayjs5.default)(value));
           break;
         default:
           item.render = (value) => processValue(item, value);

package/dist/index.mjs

@@ -291,6 +291,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 +339,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 +562,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 +658,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 +687,10 @@ function Form(props) {
         } : values);
       };
     }
+    if (propsCopy.extendTypes) {
+      setExtendTypes(propsCopy.extendTypes);
+      delete propsCopy.extendTypes;
+    }
     setComputedProps(propsCopy);
   }, []);
   if (!computedProps)
@@ -669,7 +701,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, {
@@ -763,7 +795,7 @@ 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";
@@ -792,7 +824,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;
@@ -925,12 +957,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);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/ant-design",
-  "version": "0.0.2-beta.403",
+  "version": "0.0.2-beta.406",
   "license": "MIT",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -22,13 +22,13 @@
   "files": [
     "dist"
   ],
-  "peerDependencies": {
+  "dependencies": {
     "@ant-design/icons": "*",
     "antd": "*",
     "lodash": "*",
     "react": "*",
     "react-dom": "*",
-    "@faasjs/react": "^0.0.2-beta.403",
+    "@faasjs/react": "^0.0.2-beta.406",
     "react-router-dom": "*",
     "dayjs": "*"
   },