@faasjs/ant-design 8.0.0-beta.13 → 8.0.0-beta.15

package/README.md

@@ -1,40 +1,5 @@
 # @faasjs/ant-design
 
-UI components based on [FaasJS](https://faasjs.com), [Ant Design](https://ant.design) and [React Router](https://reactrouter.com).
-
-[![License: MIT](https://img.shields.io/npm/l/@faasjs/ant-design.svg)](https://github.com/faasjs/faasjs/blob/main/packages/ant-design/LICENSE)
-[![NPM Version](https://img.shields.io/npm/v/@faasjs/ant-design.svg)](https://www.npmjs.com/package/@faasjs/ant-design)
-
-## Features
-
-- [App](https://faasjs.com/doc/ant-design/functions/App.html) component with Ant Design & FaasJS.
-- [UnionFaasItemElement](https://faasjs.com/doc/ant-design/type-aliases/UnionFaasItemElement.html) and [UnionFaasItemRender](https://faasjs.com/doc/ant-design/type-aliases/UnionFaasItemRender.html) for custom union rendering.
-
-## Install
-
-```sh
-npm install @faasjs/ant-design
-```
-
-## Usage
-
-In `@faasjs/ant-design`, we use `FaasItemProps` to provide data structures for components.
-
-```ts
-type FaasItemType =
-  'string' | 'string[]' |
-  'number' | 'number[]' |
-  'boolean' |
-  'date' | 'time' |
-  'object' | 'object[]'
-
-type FaasItemProps = {
-  type: FaasItemTypes
-  id: string
-  title?: string
-}
-```
-
 ## Functions
 
 - [App](functions/App.md)

package/dist/index.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 //#region \0rolldown/runtime.js
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -7,16 +7,12 @@ var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __copyProps = (to, from, except, desc) => {
-	if (from && typeof from === "object" || typeof from === "function") {
-		for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
-			key = keys[i];
-			if (!__hasOwnProp.call(to, key) && key !== except) {
-				__defProp(to, key, {
-					get: ((k) => from[k]).bind(null, key),
-					enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-				});
-			}
-		}
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
 	}
 	return to;
 };
@@ -24,7 +20,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 	value: mod,
 	enumerable: true
 }) : target, mod));
-
 //#endregion
 let _faasjs_react = require("@faasjs/react");
 let antd = require("antd");
@@ -35,7 +30,6 @@ let react_jsx_runtime = require("react/jsx-runtime");
 let _ant_design_icons = require("@ant-design/icons");
 let dayjs = require("dayjs");
 dayjs = __toESM(dayjs);
-
 //#region src/Loading.tsx
 /**
 * Loading component based on Spin
@@ -53,7 +47,7 @@ function Loading(props) {
 	if (props.loading === false) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: props.children });
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		style: {
-			...props.style || {},
+			...props.style,
 			...!props.size || props.size === "large" ? {
 				margin: "20vh auto",
 				textAlign: "center"
@@ -62,7 +56,6 @@ function Loading(props) {
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Spin, { size: props.size || "large" })
 	});
 }
-
 //#endregion
 //#region src/FaasDataWrapper.tsx
 /**
@@ -101,7 +94,6 @@ function withFaasData(Component, faasProps) {
 		...faasProps
 	});
 }
-
 //#endregion
 //#region src/Config.tsx
 const zh = {
@@ -173,7 +165,6 @@ function ConfigProvider(props) {
 function useConfigContext() {
 	return (0, react.useContext)(ConfigContext);
 }
-
 //#endregion
 //#region src/Drawer.tsx
 /**
@@ -216,7 +207,6 @@ function useDrawer(init) {
 		setDrawerProps
 	};
 }
-
 //#endregion
 //#region src/ErrorBoundary.tsx
 function ErrorChildren(props) {
@@ -241,7 +231,6 @@ function ErrorBoundary(props) {
 		...props
 	});
 }
-
 //#endregion
 //#region src/Modal.tsx
 /**
@@ -282,7 +271,6 @@ function useModal(init) {
 		setModalProps
 	};
 }
-
 //#endregion
 //#region src/App.tsx
 const AppContext = (0, _faasjs_react.createSplittingContext)([
@@ -388,7 +376,6 @@ function App(props) {
 */
 const useApp = AppContext.use;
 App.useApp = useApp;
-
 //#endregion
 //#region src/Blank.tsx
 /**
@@ -410,7 +397,6 @@ function Blank(options) {
 		children: options?.text || theme.Blank.text
 	}) : options.value;
 }
-
 //#endregion
 //#region src/data.ts
 /**
@@ -480,12 +466,11 @@ function transferValue(type, value) {
 function cloneUnionFaasItemElement(element, props) {
 	return (0, react.cloneElement)((0, react.isValidElement)(element) ? element : (0, react.createElement)(element), props);
 }
-
 //#endregion
 //#region src/Description.tsx
 function DescriptionItemContent(props) {
 	const [computedProps, setComputedProps] = (0, react.useState)();
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		const propsCopy = { ...props };
 		propsCopy.item.title = propsCopy.item.title ?? idToTitle(propsCopy.item.id);
 		if (!propsCopy.item.type) propsCopy.item.type = "string";
@@ -607,7 +592,6 @@ function Description({ faasData, dataSource, renderTitle, extendTypes, ...props
 	});
 }
 Description.displayName = "Description";
-
 //#endregion
 //#region src/FormItem.tsx
 function isOptionsProps(item) {
@@ -667,7 +651,7 @@ function FormItem(props) {
 	const [extendTypes, setExtendTypes] = (0, react.useState)();
 	const { theme } = useConfigContext();
 	const [hidden, setHidden] = (0, react.useState)(props.hidden || false);
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		const { extendTypes, ...propsCopy } = { ...props };
 		if (extendTypes) setExtendTypes(extendTypes);
 		if (propsCopy.if) {
@@ -684,7 +668,11 @@ function FormItem(props) {
 			delete propsCopy.hidden;
 		}
 		setComputedProps(processProps(propsCopy, theme.common));
-	}, [props]);
+	}, [
+		hidden,
+		props,
+		theme.common
+	]);
 	if (!computedProps) return null;
 	const itemType = computedProps.type ?? "string";
 	if (hidden) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Form.Item, {
@@ -898,7 +886,6 @@ function FormItem(props) {
 	}
 }
 FormItem.useStatus = antd.Form.Item.useStatus;
-
 //#endregion
 //#region src/Form.tsx
 function isFormItemProps(item) {
@@ -917,19 +904,21 @@ function Form(props) {
 	const [extendTypes, setExtendTypes] = (0, react.useState)();
 	const [form] = antd.Form.useForm(props.form);
 	const [initialValues, setInitialValues] = (0, react.useState)(props.initialValues || Object.create(null));
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		const { submit, ...propsCopy } = {
 			...props,
 			form
 		};
+		let nextInitialValues = propsCopy.initialValues;
 		if (typeof submit !== "undefined") setSubmit(submit);
 		if (propsCopy.initialValues && propsCopy.items?.length) {
 			for (const key in propsCopy.initialValues) propsCopy.initialValues[key] = transferValue(propsCopy.items.find((item) => isFormItemProps(item) && item.id === key)?.type, propsCopy.initialValues[key]);
+			nextInitialValues = propsCopy.initialValues;
 			setInitialValues(propsCopy.initialValues);
 			delete propsCopy.initialValues;
 		}
 		if (propsCopy.items?.length) {
-			for (const item of propsCopy.items) if (isFormItemProps(item) && item.if) item.hidden = !item.if(initialValues || Object.create(null));
+			for (const item of propsCopy.items) if (isFormItemProps(item) && item.if) item.hidden = !item.if(nextInitialValues || Object.create(null));
 		}
 		const submitTo = typeof submit === "object" ? submit.to : void 0;
 		if (propsCopy.onFinish) {
@@ -968,7 +957,7 @@ function Form(props) {
 			delete propsCopy.extendTypes;
 		}
 		setComputedProps(propsCopy);
-	}, [props]);
+	}, [form, props]);
 	const onValuesChange = (0, _faasjs_react.useEqualCallback)((changedValues, allValues) => {
 		console.debug("Form:onValuesChange", changedValues, allValues);
 		if (props.onValuesChange) props.onValuesChange(changedValues, allValues);
@@ -978,12 +967,12 @@ function Form(props) {
 			if (item?.onValueChange) item.onValueChange(changedValues[key], allValues, form);
 		}
 	}, [computedProps]);
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		if (!initialValues) return;
 		console.debug("Form:initialValues", initialValues);
 		form.setFieldsValue(initialValues);
 		setInitialValues(null);
-	}, [computedProps]);
+	}, [form, initialValues]);
 	if (!computedProps) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Form, {
 		...computedProps,
@@ -1015,7 +1004,6 @@ Form.Item = FormItem;
 Form.List = antd.Form.List;
 Form.ErrorList = antd.Form.ErrorList;
 Form.Provider = antd.Form.Provider;
-
 //#endregion
 //#region src/Link.tsx
 /**
@@ -1035,7 +1023,7 @@ function Link(props) {
 	const navigate = (0, react_router_dom.useNavigate)();
 	const target = props.target || theme.Link?.target || (props.href.startsWith("http") ? "_blank" : void 0);
 	let computedStyle = {
-		...theme.Link.style || {},
+		...theme.Link.style,
 		cursor: "pointer",
 		...props.style
 	};
@@ -1049,8 +1037,16 @@ function Link(props) {
 		...buttonProps,
 		style: computedStyle,
 		onClick: (e) => {
-			props.onClick ? props.onClick(e) : target === "_blank" ? window.open(props.href) : navigate(props.href);
 			e.preventDefault();
+			if (props.onClick) {
+				props.onClick(e);
+				return;
+			}
+			if (target === "_blank") {
+				window.open(props.href);
+				return;
+			}
+			navigate(props.href);
 		},
 		children: props.children ?? props.text
 	});
@@ -1074,7 +1070,6 @@ function Link(props) {
 		children: props.children ?? props.text
 	});
 }
-
 //#endregion
 //#region src/Routers.tsx
 function PageNotFound() {
@@ -1122,7 +1117,6 @@ function Routes(props) {
 		element: props.notFound || /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PageNotFound, {})
 	}, "*")] });
 }
-
 //#endregion
 //#region src/Table.tsx
 function processValue(item, value) {
@@ -1152,7 +1146,8 @@ function processValue(item, value) {
 function Table(props) {
 	const [columns, setColumns] = (0, react.useState)();
 	const { theme } = useConfigContext();
-	const generateFilterDropdown = (item) => {
+	const { all, blank, search } = theme.common;
+	const generateFilterDropdown = (0, react.useCallback)((item) => {
 		if (item.filterDropdown && item.filterDropdown !== true) return;
 		if (!item.options?.length) return;
 		if (item.options.length < 11) {
@@ -1173,7 +1168,7 @@ function Table(props) {
 				allowClear: true,
 				showSearch: true,
 				style: { width: "100%" },
-				placeholder: `${theme.common.search} ${item.title}`,
+				placeholder: `${search} ${item.title}`,
 				value: selectedKeys,
 				onChange: (v) => {
 					setSelectedKeys(v?.length ? v : []);
@@ -1181,18 +1176,19 @@ function Table(props) {
 				},
 				mode: "multiple",
 				filterOption: (input, option) => {
-					if (!input || !option || !option.label) return true;
+					if (!input || !option) return true;
+					if (typeof option.label !== "string") return option.value === input;
 					input = input.trim();
-					return option.value === input || option.label.toString().toLowerCase().includes(input.toLowerCase());
+					return option.value === input || option.label.toLowerCase().includes(input.toLowerCase());
 				}
 			})
 		});
 		return item;
-	};
-	(0, react.useEffect)(() => {
+	}, [search]);
+	(0, _faasjs_react.useEqualEffect)(() => {
 		const items = (0, lodash_es.cloneDeep)(props.items).filter((item) => !(item.tableChildren === null || item.children === null || item.tableRender === null || item.render === null));
 		const createTextSearchFilterDropdown = (item, transformValue) => ({ setSelectedKeys, confirm, clearFilters }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Input.Search, {
-			placeholder: `${theme.common.search} ${item.title}`,
+			placeholder: `${search} ${item.title}`,
 			allowClear: true,
 			onSearch: (v) => {
 				if (v) setSelectedKeys(transformValue ? [transformValue(v)] : [v]);
@@ -1290,7 +1286,7 @@ function Table(props) {
 					}
 					break;
 				case "number[]":
-					if (!item.render) item.render = (value) => processValue(item, value).join(", ");
+					if (!item.render) item.render = (value) => processValue(item, value);
 					if (item.filterDropdown !== false) {
 						if (!item.onFilter && !props.faasData) item.onFilter = (value, row) => {
 							if (value === null && (!row[item.id] || !row[item.id].length)) return true;
@@ -1309,7 +1305,7 @@ function Table(props) {
 						color: "#ff4d4f"
 					} });
 					if (item.filterDropdown !== false) {
-						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, selectedKeys, confirm }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Radio.Group, {
+						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, selectedKeys, confirm: confirmFilter }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(antd.Radio.Group, {
 							style: { padding: 8 },
 							buttonStyle: "solid",
 							value: JSON.stringify(selectedKeys[0]),
@@ -1319,10 +1315,10 @@ function Table(props) {
 									false: false,
 									null: null
 								}[e.target.value]] : []);
-								confirm();
+								confirmFilter();
 							},
 							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Radio.Button, { children: theme.common.all }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Radio.Button, { children: all }),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Radio.Button, {
 									value: "true",
 									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_ant_design_icons.CheckOutlined, { style: {
@@ -1339,7 +1335,7 @@ function Table(props) {
 								}),
 								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Radio.Button, {
 									value: "null",
-									children: theme.common.blank
+									children: blank
 								})
 							]
 						});
@@ -1363,7 +1359,9 @@ function Table(props) {
 					};
 					if (item.filterDropdown !== false) {
 						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, confirm }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.DatePicker.RangePicker, { onChange: (dates) => {
-							setSelectedKeys(dates?.[0] && dates[1] ? [[dates[0].startOf("day").toISOString(), dates[1].endOf("day").toISOString()]] : []);
+							const start = dates?.[0];
+							const end = dates?.[1];
+							setSelectedKeys(start && end ? [[start.startOf("day").toISOString(), end.endOf("day").toISOString()]] : []);
 							confirm();
 						} });
 						if (!item.onFilter && !props.faasData) item.onFilter = (value, row) => {
@@ -1397,8 +1395,16 @@ function Table(props) {
 			}
 		}
 		setColumns(items);
-	}, [props.items]);
-	(0, react.useEffect)(() => {
+	}, [
+		all,
+		blank,
+		generateFilterDropdown,
+		props.extendTypes,
+		props.faasData,
+		props.items,
+		search
+	]);
+	(0, _faasjs_react.useEqualEffect)(() => {
 		if (!props.dataSource || !columns) return;
 		for (const column of columns) if (column.optionsType === "auto" && !column.options && !column.filters) {
 			const options = (0, lodash_es.uniqBy)(props.dataSource, column.id).map((v) => ({
@@ -1414,7 +1420,11 @@ function Table(props) {
 				return newColumns;
 			});
 		}
-	}, [props.dataSource, columns]);
+	}, [
+		props.dataSource,
+		columns,
+		generateFilterDropdown
+	]);
 	if (!columns) return null;
 	if (props.dataSource) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(antd.Table, {
 		...props,
@@ -1436,7 +1446,7 @@ function Table(props) {
 }
 function FaasDataTable({ props, columns, data, params, reload, loading }) {
 	const [currentColumns, setCurrentColumns] = (0, react.useState)(columns);
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		if (!data || Array.isArray(data)) return;
 		setCurrentColumns((prev) => {
 			const newColumns = [...prev];
@@ -1514,7 +1524,6 @@ function FaasDataTable({ props, columns, data, params, reload, loading }) {
 		}
 	});
 }
-
 //#endregion
 //#region src/Tabs.tsx
 /**
@@ -1552,7 +1561,6 @@ function Tabs(props) {
 		}))
 	});
 }
-
 //#endregion
 //#region src/Title.tsx
 /**
@@ -1575,7 +1583,7 @@ function Tabs(props) {
 */
 function Title(props) {
 	const { theme } = useConfigContext();
-	(0, react.useEffect)(() => {
+	(0, _faasjs_react.useEqualEffect)(() => {
 		const title = Array.isArray(props.title) ? props.title : [props.title];
 		document.title = title.concat(props.suffix || theme.Title.suffix).filter((t) => !!t).join(props.separator || theme.Title.separator);
 	}, [props, theme.Title]);
@@ -1591,7 +1599,6 @@ function Title(props) {
 	if (props.children) return (0, react.cloneElement)(props.children, { title: props.title });
 	return null;
 }
-
 //#endregion
 //#region src/useThemeToken.ts
 /**
@@ -1605,7 +1612,6 @@ function Title(props) {
 function useThemeToken() {
 	return antd.theme.useToken().token;
 }
-
 //#endregion
 exports.App = App;
 exports.Blank = Blank;
@@ -1629,11 +1635,11 @@ exports.Title = Title;
 exports.cloneUnionFaasItemElement = cloneUnionFaasItemElement;
 exports.faas = _faasjs_react.faas;
 exports.idToTitle = idToTitle;
-Object.defineProperty(exports, 'lazy', {
-  enumerable: true,
-  get: function () {
-    return react.lazy;
-  }
+Object.defineProperty(exports, "lazy", {
+	enumerable: true,
+	get: function() {
+		return react.lazy;
+	}
 });
 exports.transferOptions = transferOptions;
 exports.transferValue = transferValue;
@@ -1643,4 +1649,4 @@ exports.useDrawer = useDrawer;
 exports.useFaas = _faasjs_react.useFaas;
 exports.useModal = useModal;
 exports.useThemeToken = useThemeToken;
-exports.withFaasData = withFaasData;
+exports.withFaasData = withFaasData;

package/dist/index.d.ts

@@ -53,7 +53,7 @@ type FaasActionPaths = Exclude<Extract<keyof FaasActions, string>, 'faasjsAction
 /**
  * Union type accepted by action helpers.
  */
-type FaasActionUnionType = FaasActionPaths | Record<string, any> | string;
+type FaasActionUnionType = Record<string, any> | string;
 /**
  * Infer the action path type.
  *
@@ -319,7 +319,7 @@ interface useAppProps {
  */
 declare function App(props: AppProps): react_jsx_runtime0.JSX.Element;
 declare namespace App {
-  var useApp: <NewT extends useAppProps = useAppProps>() => Readonly<NewT>;
+  var useApp: any;
 }
 /**
  * Get app context.
@@ -330,7 +330,7 @@ declare namespace App {
  * const { message, notification, setModalProps, setDrawerProps } = useApp()
  * ```
  */
-declare const useApp: <NewT extends useAppProps = useAppProps>() => Readonly<NewT>;
+declare const useApp: any;
 //#endregion
 //#region src/Blank.d.ts
 interface BlankProps {
@@ -747,7 +747,7 @@ interface DescriptionItemProps<T = any> extends FaasItemProps {
   object?: DescriptionItemProps<T>[];
 }
 interface DescriptionProps<T = any, ExtendItemProps = any> extends Omit<DescriptionsProps, 'items'> {
-  renderTitle?(values: T): ReactNode;
+  renderTitle?(this: void, values: T): ReactNode;
   items: (DescriptionItemProps | ExtendItemProps)[];
   extendTypes?: {
     [key: string]: ExtendDescriptionTypeProps;
@@ -825,7 +825,7 @@ type FormSubmitProps = {
    * ```
    */
   to?: {
-    action: FaasAction | string; /** params will overwrite form values before submit */
+    action: FaasAction; /** params will overwrite form values before submit */
     params?: Record<string, any>;
     then?: (result: any) => void;
     catch?: (error: any) => void;

package/dist/index.mjs

@@ -2,11 +2,10 @@ import { ErrorBoundary as ErrorBoundary$1, FaasDataWrapper as FaasDataWrapper$1,
 import { Alert, Button, Col, ConfigProvider as ConfigProvider$1, DatePicker, Descriptions, Drawer, Form as Form$1, Input, InputNumber, Modal, Radio, Result, Row, Select, Skeleton, Space, Spin, Switch, Table as Table$1, Tabs as Tabs$1, Typography, message, notification, theme } from "antd";
 import { BrowserRouter, Route, Routes as Routes$1, useLocation, useNavigate } from "react-router-dom";
 import { cloneDeep, defaultsDeep, isNil, uniqBy } from "lodash-es";
-import { Suspense, cloneElement, createContext, createElement, isValidElement, lazy, useContext, useEffect, useState } from "react";
+import { Suspense, cloneElement, createContext, createElement, isValidElement, lazy, useCallback, useContext, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { CheckOutlined, CloseOutlined, MinusCircleOutlined, PlusOutlined } from "@ant-design/icons";
 import dayjs from "dayjs";
-
 //#region src/Loading.tsx
 /**
 * Loading component based on Spin
@@ -24,7 +23,7 @@ function Loading(props) {
 	if (props.loading === false) return /* @__PURE__ */ jsx(Fragment, { children: props.children });
 	return /* @__PURE__ */ jsx("div", {
 		style: {
-			...props.style || {},
+			...props.style,
 			...!props.size || props.size === "large" ? {
 				margin: "20vh auto",
 				textAlign: "center"
@@ -33,7 +32,6 @@ function Loading(props) {
 		children: /* @__PURE__ */ jsx(Spin, { size: props.size || "large" })
 	});
 }
-
 //#endregion
 //#region src/FaasDataWrapper.tsx
 /**
@@ -72,7 +70,6 @@ function withFaasData(Component, faasProps) {
 		...faasProps
 	});
 }
-
 //#endregion
 //#region src/Config.tsx
 const zh = {
@@ -144,7 +141,6 @@ function ConfigProvider(props) {
 function useConfigContext() {
 	return useContext(ConfigContext);
 }
-
 //#endregion
 //#region src/Drawer.tsx
 /**
@@ -187,7 +183,6 @@ function useDrawer(init) {
 		setDrawerProps
 	};
 }
-
 //#endregion
 //#region src/ErrorBoundary.tsx
 function ErrorChildren(props) {
@@ -212,7 +207,6 @@ function ErrorBoundary(props) {
 		...props
 	});
 }
-
 //#endregion
 //#region src/Modal.tsx
 /**
@@ -253,7 +247,6 @@ function useModal(init) {
 		setModalProps
 	};
 }
-
 //#endregion
 //#region src/App.tsx
 const AppContext = createSplittingContext([
@@ -359,7 +352,6 @@ function App(props) {
 */
 const useApp = AppContext.use;
 App.useApp = useApp;
-
 //#endregion
 //#region src/Blank.tsx
 /**
@@ -381,7 +373,6 @@ function Blank(options) {
 		children: options?.text || theme.Blank.text
 	}) : options.value;
 }
-
 //#endregion
 //#region src/data.ts
 /**
@@ -451,12 +442,11 @@ function transferValue(type, value) {
 function cloneUnionFaasItemElement(element, props) {
 	return cloneElement(isValidElement(element) ? element : createElement(element), props);
 }
-
 //#endregion
 //#region src/Description.tsx
 function DescriptionItemContent(props) {
 	const [computedProps, setComputedProps] = useState();
-	useEffect(() => {
+	useEqualEffect(() => {
 		const propsCopy = { ...props };
 		propsCopy.item.title = propsCopy.item.title ?? idToTitle(propsCopy.item.id);
 		if (!propsCopy.item.type) propsCopy.item.type = "string";
@@ -578,7 +568,6 @@ function Description({ faasData, dataSource, renderTitle, extendTypes, ...props
 	});
 }
 Description.displayName = "Description";
-
 //#endregion
 //#region src/FormItem.tsx
 function isOptionsProps(item) {
@@ -638,7 +627,7 @@ function FormItem(props) {
 	const [extendTypes, setExtendTypes] = useState();
 	const { theme } = useConfigContext();
 	const [hidden, setHidden] = useState(props.hidden || false);
-	useEffect(() => {
+	useEqualEffect(() => {
 		const { extendTypes, ...propsCopy } = { ...props };
 		if (extendTypes) setExtendTypes(extendTypes);
 		if (propsCopy.if) {
@@ -655,7 +644,11 @@ function FormItem(props) {
 			delete propsCopy.hidden;
 		}
 		setComputedProps(processProps(propsCopy, theme.common));
-	}, [props]);
+	}, [
+		hidden,
+		props,
+		theme.common
+	]);
 	if (!computedProps) return null;
 	const itemType = computedProps.type ?? "string";
 	if (hidden) return /* @__PURE__ */ jsx(Form$1.Item, {
@@ -869,7 +862,6 @@ function FormItem(props) {
 	}
 }
 FormItem.useStatus = Form$1.Item.useStatus;
-
 //#endregion
 //#region src/Form.tsx
 function isFormItemProps(item) {
@@ -888,19 +880,21 @@ function Form(props) {
 	const [extendTypes, setExtendTypes] = useState();
 	const [form] = Form$1.useForm(props.form);
 	const [initialValues, setInitialValues] = useState(props.initialValues || Object.create(null));
-	useEffect(() => {
+	useEqualEffect(() => {
 		const { submit, ...propsCopy } = {
 			...props,
 			form
 		};
+		let nextInitialValues = propsCopy.initialValues;
 		if (typeof submit !== "undefined") setSubmit(submit);
 		if (propsCopy.initialValues && propsCopy.items?.length) {
 			for (const key in propsCopy.initialValues) propsCopy.initialValues[key] = transferValue(propsCopy.items.find((item) => isFormItemProps(item) && item.id === key)?.type, propsCopy.initialValues[key]);
+			nextInitialValues = propsCopy.initialValues;
 			setInitialValues(propsCopy.initialValues);
 			delete propsCopy.initialValues;
 		}
 		if (propsCopy.items?.length) {
-			for (const item of propsCopy.items) if (isFormItemProps(item) && item.if) item.hidden = !item.if(initialValues || Object.create(null));
+			for (const item of propsCopy.items) if (isFormItemProps(item) && item.if) item.hidden = !item.if(nextInitialValues || Object.create(null));
 		}
 		const submitTo = typeof submit === "object" ? submit.to : void 0;
 		if (propsCopy.onFinish) {
@@ -939,7 +933,7 @@ function Form(props) {
 			delete propsCopy.extendTypes;
 		}
 		setComputedProps(propsCopy);
-	}, [props]);
+	}, [form, props]);
 	const onValuesChange = useEqualCallback((changedValues, allValues) => {
 		console.debug("Form:onValuesChange", changedValues, allValues);
 		if (props.onValuesChange) props.onValuesChange(changedValues, allValues);
@@ -949,12 +943,12 @@ function Form(props) {
 			if (item?.onValueChange) item.onValueChange(changedValues[key], allValues, form);
 		}
 	}, [computedProps]);
-	useEffect(() => {
+	useEqualEffect(() => {
 		if (!initialValues) return;
 		console.debug("Form:initialValues", initialValues);
 		form.setFieldsValue(initialValues);
 		setInitialValues(null);
-	}, [computedProps]);
+	}, [form, initialValues]);
 	if (!computedProps) return null;
 	return /* @__PURE__ */ jsxs(Form$1, {
 		...computedProps,
@@ -986,7 +980,6 @@ Form.Item = FormItem;
 Form.List = Form$1.List;
 Form.ErrorList = Form$1.ErrorList;
 Form.Provider = Form$1.Provider;
-
 //#endregion
 //#region src/Link.tsx
 /**
@@ -1006,7 +999,7 @@ function Link(props) {
 	const navigate = useNavigate();
 	const target = props.target || theme.Link?.target || (props.href.startsWith("http") ? "_blank" : void 0);
 	let computedStyle = {
-		...theme.Link.style || {},
+		...theme.Link.style,
 		cursor: "pointer",
 		...props.style
 	};
@@ -1020,8 +1013,16 @@ function Link(props) {
 		...buttonProps,
 		style: computedStyle,
 		onClick: (e) => {
-			props.onClick ? props.onClick(e) : target === "_blank" ? window.open(props.href) : navigate(props.href);
 			e.preventDefault();
+			if (props.onClick) {
+				props.onClick(e);
+				return;
+			}
+			if (target === "_blank") {
+				window.open(props.href);
+				return;
+			}
+			navigate(props.href);
 		},
 		children: props.children ?? props.text
 	});
@@ -1045,7 +1046,6 @@ function Link(props) {
 		children: props.children ?? props.text
 	});
 }
-
 //#endregion
 //#region src/Routers.tsx
 function PageNotFound() {
@@ -1093,7 +1093,6 @@ function Routes(props) {
 		element: props.notFound || /* @__PURE__ */ jsx(PageNotFound, {})
 	}, "*")] });
 }
-
 //#endregion
 //#region src/Table.tsx
 function processValue(item, value) {
@@ -1123,7 +1122,8 @@ function processValue(item, value) {
 function Table(props) {
 	const [columns, setColumns] = useState();
 	const { theme } = useConfigContext();
-	const generateFilterDropdown = (item) => {
+	const { all, blank, search } = theme.common;
+	const generateFilterDropdown = useCallback((item) => {
 		if (item.filterDropdown && item.filterDropdown !== true) return;
 		if (!item.options?.length) return;
 		if (item.options.length < 11) {
@@ -1144,7 +1144,7 @@ function Table(props) {
 				allowClear: true,
 				showSearch: true,
 				style: { width: "100%" },
-				placeholder: `${theme.common.search} ${item.title}`,
+				placeholder: `${search} ${item.title}`,
 				value: selectedKeys,
 				onChange: (v) => {
 					setSelectedKeys(v?.length ? v : []);
@@ -1152,18 +1152,19 @@ function Table(props) {
 				},
 				mode: "multiple",
 				filterOption: (input, option) => {
-					if (!input || !option || !option.label) return true;
+					if (!input || !option) return true;
+					if (typeof option.label !== "string") return option.value === input;
 					input = input.trim();
-					return option.value === input || option.label.toString().toLowerCase().includes(input.toLowerCase());
+					return option.value === input || option.label.toLowerCase().includes(input.toLowerCase());
 				}
 			})
 		});
 		return item;
-	};
-	useEffect(() => {
+	}, [search]);
+	useEqualEffect(() => {
 		const items = cloneDeep(props.items).filter((item) => !(item.tableChildren === null || item.children === null || item.tableRender === null || item.render === null));
 		const createTextSearchFilterDropdown = (item, transformValue) => ({ setSelectedKeys, confirm, clearFilters }) => /* @__PURE__ */ jsx(Input.Search, {
-			placeholder: `${theme.common.search} ${item.title}`,
+			placeholder: `${search} ${item.title}`,
 			allowClear: true,
 			onSearch: (v) => {
 				if (v) setSelectedKeys(transformValue ? [transformValue(v)] : [v]);
@@ -1261,7 +1262,7 @@ function Table(props) {
 					}
 					break;
 				case "number[]":
-					if (!item.render) item.render = (value) => processValue(item, value).join(", ");
+					if (!item.render) item.render = (value) => processValue(item, value);
 					if (item.filterDropdown !== false) {
 						if (!item.onFilter && !props.faasData) item.onFilter = (value, row) => {
 							if (value === null && (!row[item.id] || !row[item.id].length)) return true;
@@ -1280,7 +1281,7 @@ function Table(props) {
 						color: "#ff4d4f"
 					} });
 					if (item.filterDropdown !== false) {
-						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, selectedKeys, confirm }) => /* @__PURE__ */ jsxs(Radio.Group, {
+						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, selectedKeys, confirm: confirmFilter }) => /* @__PURE__ */ jsxs(Radio.Group, {
 							style: { padding: 8 },
 							buttonStyle: "solid",
 							value: JSON.stringify(selectedKeys[0]),
@@ -1290,10 +1291,10 @@ function Table(props) {
 									false: false,
 									null: null
 								}[e.target.value]] : []);
-								confirm();
+								confirmFilter();
 							},
 							children: [
-								/* @__PURE__ */ jsx(Radio.Button, { children: theme.common.all }),
+								/* @__PURE__ */ jsx(Radio.Button, { children: all }),
 								/* @__PURE__ */ jsx(Radio.Button, {
 									value: "true",
 									children: /* @__PURE__ */ jsx(CheckOutlined, { style: {
@@ -1310,7 +1311,7 @@ function Table(props) {
 								}),
 								/* @__PURE__ */ jsx(Radio.Button, {
 									value: "null",
-									children: theme.common.blank
+									children: blank
 								})
 							]
 						});
@@ -1334,7 +1335,9 @@ function Table(props) {
 					};
 					if (item.filterDropdown !== false) {
 						if (typeof item.filterDropdown === "undefined") item.filterDropdown = ({ setSelectedKeys, confirm }) => /* @__PURE__ */ jsx(DatePicker.RangePicker, { onChange: (dates) => {
-							setSelectedKeys(dates?.[0] && dates[1] ? [[dates[0].startOf("day").toISOString(), dates[1].endOf("day").toISOString()]] : []);
+							const start = dates?.[0];
+							const end = dates?.[1];
+							setSelectedKeys(start && end ? [[start.startOf("day").toISOString(), end.endOf("day").toISOString()]] : []);
 							confirm();
 						} });
 						if (!item.onFilter && !props.faasData) item.onFilter = (value, row) => {
@@ -1368,8 +1371,16 @@ function Table(props) {
 			}
 		}
 		setColumns(items);
-	}, [props.items]);
-	useEffect(() => {
+	}, [
+		all,
+		blank,
+		generateFilterDropdown,
+		props.extendTypes,
+		props.faasData,
+		props.items,
+		search
+	]);
+	useEqualEffect(() => {
 		if (!props.dataSource || !columns) return;
 		for (const column of columns) if (column.optionsType === "auto" && !column.options && !column.filters) {
 			const options = uniqBy(props.dataSource, column.id).map((v) => ({
@@ -1385,7 +1396,11 @@ function Table(props) {
 				return newColumns;
 			});
 		}
-	}, [props.dataSource, columns]);
+	}, [
+		props.dataSource,
+		columns,
+		generateFilterDropdown
+	]);
 	if (!columns) return null;
 	if (props.dataSource) return /* @__PURE__ */ jsx(Table$1, {
 		...props,
@@ -1407,7 +1422,7 @@ function Table(props) {
 }
 function FaasDataTable({ props, columns, data, params, reload, loading }) {
 	const [currentColumns, setCurrentColumns] = useState(columns);
-	useEffect(() => {
+	useEqualEffect(() => {
 		if (!data || Array.isArray(data)) return;
 		setCurrentColumns((prev) => {
 			const newColumns = [...prev];
@@ -1485,7 +1500,6 @@ function FaasDataTable({ props, columns, data, params, reload, loading }) {
 		}
 	});
 }
-
 //#endregion
 //#region src/Tabs.tsx
 /**
@@ -1523,7 +1537,6 @@ function Tabs(props) {
 		}))
 	});
 }
-
 //#endregion
 //#region src/Title.tsx
 /**
@@ -1546,7 +1559,7 @@ function Tabs(props) {
 */
 function Title(props) {
 	const { theme } = useConfigContext();
-	useEffect(() => {
+	useEqualEffect(() => {
 		const title = Array.isArray(props.title) ? props.title : [props.title];
 		document.title = title.concat(props.suffix || theme.Title.suffix).filter((t) => !!t).join(props.separator || theme.Title.separator);
 	}, [props, theme.Title]);
@@ -1562,7 +1575,6 @@ function Title(props) {
 	if (props.children) return cloneElement(props.children, { title: props.title });
 	return null;
 }
-
 //#endregion
 //#region src/useThemeToken.ts
 /**
@@ -1576,6 +1588,5 @@ function Title(props) {
 function useThemeToken() {
 	return theme.useToken().token;
 }
-
 //#endregion
-export { App, Blank, ConfigContext, ConfigProvider, Description, Drawer, ErrorBoundary, FaasDataWrapper, FaasReactClient, Form, FormItem, Link, Loading, Modal, PageNotFound, Routes, Table, Tabs, Title, cloneUnionFaasItemElement, faas, idToTitle, lazy, transferOptions, transferValue, useApp, useConfigContext, useDrawer, useFaas, useModal, useThemeToken, withFaasData };
+export { App, Blank, ConfigContext, ConfigProvider, Description, Drawer, ErrorBoundary, FaasDataWrapper, FaasReactClient, Form, FormItem, Link, Loading, Modal, PageNotFound, Routes, Table, Tabs, Title, cloneUnionFaasItemElement, faas, idToTitle, lazy, transferOptions, transferValue, useApp, useConfigContext, useDrawer, useFaas, useModal, useThemeToken, withFaasData };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/ant-design",
-  "version": "8.0.0-beta.13",
+  "version": "8.0.0-beta.15",
   "homepage": "https://faasjs.com/doc/ant-design",
   "bugs": {
     "url": "https://github.com/faasjs/faasjs/issues"
@@ -26,12 +26,9 @@
       "require": "./dist/index.cjs"
     }
   },
-  "scripts": {
-    "build": "tsdown src/index.ts --config ../../tsdown.config.ts --dts.eager --no-sourcemap --no-dts.sourcemap"
-  },
   "devDependencies": {
     "@ant-design/icons": "*",
-    "@faasjs/react": ">=8.0.0-beta.13",
+    "@faasjs/react": ">=8.0.0-beta.15",
     "@types/lodash-es": "*",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
@@ -43,7 +40,7 @@
   },
   "peerDependencies": {
     "@ant-design/icons": "*",
-    "@faasjs/react": ">=8.0.0-beta.13",
+    "@faasjs/react": ">=8.0.0-beta.15",
     "antd": "^6.0.0",
     "lodash-es": "*",
     "react": "^19.0.0",