@wordrhyme/auto-crud 1.2.1 → 1.2.4

package/dist/index.js

@@ -4864,7 +4864,7 @@ const filterModeConfig = {
 		tooltip: "Linear-style command filters"
 	}
 };
-function AutoTable({ schema, data, pageCount = 1, overrides, enableRowSelection = true, exclude, actions, pinnedColumns, filterMode = "simple", search = false, onDeleteSelected, onUpdateSelected, batchUpdateFields, actionBarExtra, actionBarActions, initialSorting, enableExport = true, showDefaultExport = true, onSelectedCountChange, getSelectedRows }) {
+function AutoTable({ schema, data, pageCount = 1, overrides, enableRowSelection = true, exclude, actions, pinnedColumns, filterMode = "simple", search = false, onDeleteSelected, onUpdateSelected, batchUpdateFields, actionBarExtra, actionBarActions, initialSorting, enableExport = true, showDefaultExport = true, onSelectedCountChange, onSelectedRowsChange, getSelectedRows }) {
 	const modes = filterMode ? Array.isArray(filterMode) ? filterMode : [filterMode] : DEFAULT_MODES;
 	const [currentMode, setCurrentMode] = useQueryState("filterMode", parseAsStringEnum(modes).withDefault(modes[0] ?? "simple"));
 	const showToggle = modes.length > 1;
@@ -4913,17 +4913,28 @@ function AutoTable({ schema, data, pageCount = 1, overrides, enableRowSelection
 		shallow: false,
 		clearOnDefault: true
 	});
-	const getSelectedRowsFn = useCallback(() => table.getFilteredSelectedRowModel().rows.map((row) => row.original), [table]);
+	const rowSelection = table.getState().rowSelection;
+	const columnFilters = table.getState().columnFilters;
+	const selectedRows = useMemo(() => table.getFilteredSelectedRowModel().rows.map((row) => row.original), [
+		table,
+		rowSelection,
+		columnFilters,
+		data
+	]);
+	const getSelectedRowsFn = useCallback(() => selectedRows, [selectedRows]);
 	useEffect(() => {
 		if (getSelectedRows) getSelectedRows.current = getSelectedRowsFn;
 		return () => {
 			if (getSelectedRows) getSelectedRows.current = null;
 		};
 	}, [getSelectedRows, getSelectedRowsFn]);
-	const selectedRowCount = table.getFilteredSelectedRowModel().rows.length;
+	const selectedRowCount = selectedRows.length;
 	useEffect(() => {
 		onSelectedCountChange?.(selectedRowCount);
 	}, [selectedRowCount, onSelectedCountChange]);
+	useEffect(() => {
+		onSelectedRowsChange?.(selectedRows);
+	}, [selectedRows, onSelectedRowsChange]);
 	const FilterModeSelect = showToggle ? /* @__PURE__ */ jsxs(DropdownMenu, { children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
 		asChild: true,
 		children: /* @__PURE__ */ jsx(Button, {
@@ -5192,8 +5203,12 @@ function createEditFormSchema(schema, options) {
 function createRegistry(label) {
 	const entries = /* @__PURE__ */ new Map();
 	const listeners = /* @__PURE__ */ new Set();
+	let notifyScheduled = false;
 	const notify = () => {
+		if (notifyScheduled) return;
+		notifyScheduled = true;
 		queueMicrotask(() => {
+			notifyScheduled = false;
 			for (const listener of listeners) listener();
 		});
 	};
@@ -5223,20 +5238,32 @@ function createRegistry(label) {
 	};
 }
 const formComponents = createRegistry("form component");
-const dataSources = createRegistry("data source");
-function normalizeDataSourceConfig(config) {
-	if (typeof config === "string") return config.length > 0 ? {
-		key: config,
-		dependsOn: [],
-		resetOnChange: false
-	} : void 0;
-	if (!config?.key) return void 0;
+const components = formComponents;
+function normalizeDataSourceRegistration(registration) {
+	if (typeof registration === "function") return {
+		dependencies: [],
+		reset: false,
+		load: registration
+	};
 	return {
-		key: config.key,
-		dependsOn: Array.isArray(config.dependsOn) ? config.dependsOn : [],
-		resetOnChange: config.resetOnChange === true
+		dependencies: Array.isArray(registration.dependencies) ? registration.dependencies : [],
+		reset: registration.reset === true,
+		load: registration.load
 	};
 }
+const dataSourceRegistry = createRegistry("data source");
+const dataSources = {
+	register(name, registration) {
+		dataSourceRegistry.register(name, normalizeDataSourceRegistration(registration));
+	},
+	unregister: dataSourceRegistry.unregister,
+	get: dataSourceRegistry.get,
+	all: dataSourceRegistry.all,
+	subscribe: dataSourceRegistry.subscribe
+};
+function normalizeDataSourceConfig(config) {
+	if (typeof config === "string") return config.length > 0 ? { key: config } : void 0;
+}
 function normalizeOptions(result) {
 	const options = Array.isArray(result) ? result : result?.options;
 	if (!Array.isArray(options)) return [];
@@ -5302,9 +5329,7 @@ function useRegistryVersion$1(subscribe) {
 	return version;
 }
 function isDataSourceConfig(value) {
-	if (typeof value === "string") return value.length > 0;
-	if (!value || typeof value !== "object" || Array.isArray(value)) return false;
-	return typeof value.key === "string";
+	return typeof value === "string" && value.length > 0;
 }
 function collectDataSourceConfigs(schema, result = {}) {
 	const properties = schema.properties;
@@ -5334,17 +5359,17 @@ function useFormDataSources(form, schema) {
 		const loadFieldOptions = async (fieldName, source) => {
 			const version = (loadVersions.get(fieldName) ?? 0) + 1;
 			loadVersions.set(fieldName, version);
-			const loader = dataSources.get(source.key);
-			if (!loader) {
+			const entry = dataSources.get(source.key);
+			if (!entry) {
 				form.setFieldState(fieldName, (state) => {
 					state.dataSource = [];
 				});
 				return;
 			}
 			try {
-				const options = normalizeOptions(await loader({
+				const options = normalizeOptions(await entry.load({
 					field: fieldName,
-					values: Object.fromEntries(source.dependsOn.map((dependency) => [dependency, form.getValuesIn(dependency)])),
+					values: Object.fromEntries(entry.dependencies.map((dependency) => [dependency, form.getValuesIn(dependency)])),
 					signal: controller?.signal
 				}));
 				if (!active || loadVersions.get(fieldName) !== version) return;
@@ -5361,10 +5386,11 @@ function useFormDataSources(form, schema) {
 		};
 		for (const [fieldName, source] of sourceEntries) loadFieldOptions(fieldName, source);
 		form.addEffects(effectId, () => {
-			for (const dependency of new Set(sourceEntries.flatMap(([, source]) => source.dependsOn))) onFieldValueChange(dependency, () => {
+			for (const dependency of new Set(sourceEntries.flatMap(([, source]) => dataSources.get(source.key)?.dependencies ?? []))) onFieldValueChange(dependency, () => {
 				for (const [fieldName, source] of sourceEntries) {
-					if (!source.dependsOn.includes(dependency)) continue;
-					if (source.resetOnChange) form.setValuesIn(fieldName, void 0);
+					const entry = dataSources.get(source.key);
+					if (!entry?.dependencies.includes(dependency)) continue;
+					if (entry.reset) form.setValuesIn(fieldName, void 0);
 					loadFieldOptions(fieldName, source);
 				}
 			});
@@ -5403,8 +5429,8 @@ function AutoFormInner({ schema: zodSchema, initialValues, onSubmit, overrides,
 	}, [labelAlign, labelWidth]);
 	const fieldComponents = useMemo(() => ({ fields: {
 		...defaultFieldComponents,
-		...formComponents.all()
-	} }), [useRegistryVersion$1(formComponents.subscribe)]);
+		...components.all()
+	} }), [useRegistryVersion$1(components.subscribe)]);
 	useFormDataSources(form, formSchema);
 	const handleSubmit = async () => {
 		await form.validate();
@@ -6217,6 +6243,44 @@ function ImportDialog({ open, onOpenChange, onImport, columns = [], title, local
 
 //#endregion
 //#region src/components/auto-crud/auto-crud-table.tsx
+let autoCrudToolbarResolver = null;
+function setAutoCrudToolbarResolver(resolver) {
+	autoCrudToolbarResolver = resolver;
+}
+function getDefaultToolbarActions() {
+	return [
+		{ type: "import" },
+		{ type: "export" },
+		{ type: "create" }
+	];
+}
+function resolveOwnerToolbarActions(toolbar) {
+	const resolved = typeof toolbar === "function" ? toolbar(getDefaultToolbarActions()) : toolbar;
+	return resolved !== void 0 && resolved.length > 0 ? [...resolved] : getDefaultToolbarActions();
+}
+function readRowIds(rows, idKey) {
+	return rows.flatMap((row) => {
+		const value = row[idKey];
+		return value === null || value === void 0 ? [] : [String(value)];
+	});
+}
+function areStringArraysEqual(left, right) {
+	return left.length === right.length && left.every((value, index) => value === right[index]);
+}
+function haveSameRowSelection(left, right, idKey) {
+	if (left.length !== right.length) return false;
+	const leftIds = readRowIds(left, idKey);
+	const rightIds = readRowIds(right, idKey);
+	if (leftIds.length === left.length && rightIds.length === right.length) return areStringArraysEqual(leftIds, rightIds);
+	return left.every((row, index) => row === right[index]);
+}
+function readCreateAction(actions) {
+	return actions.find((action) => action.type === "create");
+}
+function resolveToolbarActionsWithResolver(targetId, ownerActions, context) {
+	const resolver = autoCrudToolbarResolver;
+	return targetId !== void 0 && targetId.length > 0 && resolver !== null ? resolver(targetId, ownerActions, context) : ownerActions;
+}
 function mergeFieldPart(base, override) {
 	if (override === void 0) return base;
 	if (override === false || base === false || typeof base !== "object" || typeof override !== "object" || base === null || override === null || Array.isArray(base) || Array.isArray(override)) return override;
@@ -6303,10 +6367,10 @@ function useDynamicFilterOptions(fields) {
 		let active = true;
 		const controller = typeof AbortController === "undefined" ? void 0 : new AbortController();
 		Promise.all(sourceEntries.map(async ({ field, source }) => {
-			const loader = dataSources.get(source.key);
-			if (!loader) return [field, []];
+			const entry = dataSources.get(source.key);
+			if (!entry) return [field, []];
 			try {
-				return [field, normalizeOptions(await loader({
+				return [field, normalizeOptions(await entry.load({
 					field,
 					values: {},
 					signal: controller?.signal
@@ -6540,7 +6604,7 @@ function renderFieldValue(value, type, booleanLocale, options) {
 /**
 * ViewModal 组件 - 详情查看弹窗
 */
-function ViewModal({ open, onOpenChange, variant, data, schema, fields: fieldConfig, denyFields, locale }) {
+function ViewModal({ open, onOpenChange, variant, data, schema, fields: fieldConfig, dynamicOptions, denyFields, locale }) {
 	if (!data) return null;
 	const shape = schema.shape;
 	const denySet = new Set(denyFields ?? []);
@@ -6553,7 +6617,7 @@ function ViewModal({ open, onOpenChange, variant, data, schema, fields: fieldCon
 			const parsed = parseZodField(fieldSchema);
 			const label = fieldConfig?.[key]?.label ?? humanize(key);
 			const value = data[key];
-			const options = normalizeFieldOptions(fieldConfig?.[key]?.enum);
+			const options = normalizeFieldOptions(fieldConfig?.[key]?.enum) ?? normalizeFieldOptions(dynamicOptions?.[key]);
 			return /* @__PURE__ */ jsxs("div", {
 				className: "grid grid-cols-3 items-start gap-4",
 				children: [/* @__PURE__ */ jsx("dt", {
@@ -6575,6 +6639,7 @@ function ViewModal({ open, onOpenChange, variant, data, schema, fields: fieldCon
 		open,
 		onOpenChange,
 		children: /* @__PURE__ */ jsxs(DialogContent, {
+			"aria-describedby": void 0,
 			className: "max-w-2xl max-h-[80vh] overflow-y-auto",
 			children: [/* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: locale.viewModal.title }) }), content]
 		})
@@ -6666,7 +6731,7 @@ function resolveActions(actionsOrFn, defaults, rowActionsLocale) {
 *
 * 高级 CRUD 表格组件，封装了完整的增删改查流程
 */
-function AutoCrudTable({ title, description, schema, resource, fields, table: tableConfig, form: formConfig, permissions, actions: actionItems, toolbarActions, locale: localeProp, onCreate }) {
+function AutoCrudTable({ id, title, description, schema, resource, fields, table: tableConfig, form: formConfig, permissions, actions: actionItems, toolbar, toolbarActions, locale: localeProp, onCreate }) {
 	const locale = resolveLocale(localeProp);
 	const resolvedSchema = resource.schema ?? schema;
 	const resolvedFields = React.useMemo(() => mergeFields(resource.fields, fields) ?? {}, [fields, resource.fields]);
@@ -6681,10 +6746,35 @@ function AutoCrudTable({ title, description, schema, resource, fields, table: ta
 	const canImport = can.import && !!resource.handlers.import;
 	const canExport = can.export;
 	const [importOpen, setImportOpen] = React.useState(false);
-	const [selectedCount, setSelectedCount] = React.useState(0);
+	const [selectedRows, setSelectedRows] = React.useState([]);
 	const [exporting, setExporting] = React.useState(false);
 	const getSelectedRowsRef = React.useRef(null);
 	const dynamicFilterOptions = useDynamicFilterOptions(resolvedFields);
+	const resourceIdKey = resource.idKey ?? "id";
+	const ownerToolbarActions = React.useMemo(() => resolveOwnerToolbarActions(toolbar ?? toolbarActions), [toolbar, toolbarActions]);
+	const selectedCount = selectedRows.length;
+	const selectedRowIds = React.useMemo(() => readRowIds(selectedRows, resourceIdKey), [selectedRows, resourceIdKey]);
+	const rowIds = React.useMemo(() => readRowIds(resource.tableData.data, resourceIdKey), [resource.tableData.data, resourceIdKey]);
+	const handleSelectedRowsChange = React.useCallback((rows) => {
+		setSelectedRows((currentRows) => haveSameRowSelection(currentRows, rows, resourceIdKey) ? currentRows : rows);
+	}, [resourceIdKey]);
+	const ownerCreateAction = React.useMemo(() => readCreateAction(ownerToolbarActions), [ownerToolbarActions]);
+	const toolbarOpenCreate = can.create ? ownerCreateAction?.onClick ?? onCreate ?? resource.handlers.openCreate : void 0;
+	const resolvedToolbarActions = resolveToolbarActionsWithResolver(id, ownerToolbarActions, React.useMemo(() => ({
+		crudId: id ?? "",
+		idKey: resourceIdKey,
+		rowIds,
+		selectedRowIds,
+		selectedCount,
+		...toolbarOpenCreate ? { openCreate: toolbarOpenCreate } : {}
+	}), [
+		id,
+		resourceIdKey,
+		rowIds,
+		selectedRowIds,
+		selectedCount,
+		toolbarOpenCreate
+	]));
 	const importColumns = React.useMemo(() => {
 		const shape = resolvedSchema.shape;
 		const denySet = new Set(denyFields ?? []);
@@ -6694,9 +6784,9 @@ function AutoCrudTable({ title, description, schema, resource, fields, table: ta
 		const filename = title ?? "export";
 		const excludeColumns = denyFields;
 		if (mode === "selected") {
-			const selectedRows = getSelectedRowsRef.current?.();
-			if (!selectedRows || selectedRows.length === 0) return;
-			exportAllToCSV(selectedRows, {
+			const selectedRows$1 = getSelectedRowsRef.current?.();
+			if (!selectedRows$1 || selectedRows$1.length === 0) return;
+			exportAllToCSV(selectedRows$1, {
 				filename,
 				excludeColumns
 			});
@@ -6790,11 +6880,6 @@ function AutoCrudTable({ title, description, schema, resource, fields, table: ta
 						}, "create");
 						return null;
 					};
-					const resolvedToolbarActions = typeof toolbarActions === "function" ? toolbarActions([
-						{ type: "import" },
-						{ type: "export" },
-						{ type: "create" }
-					]) : toolbarActions;
 					if (!resolvedToolbarActions || resolvedToolbarActions.length === 0) return /* @__PURE__ */ jsxs("div", {
 						className: "flex items-center gap-2",
 						children: [
@@ -6852,7 +6937,7 @@ function AutoCrudTable({ title, description, schema, resource, fields, table: ta
 				enableExport: canExport,
 				showDefaultExport: false,
 				initialSorting: tableConfig?.defaultSort,
-				onSelectedCountChange: setSelectedCount,
+				onSelectedRowsChange: handleSelectedRowsChange,
 				getSelectedRows: getSelectedRowsRef
 			}),
 			/* @__PURE__ */ jsx(CrudFormModal, {
@@ -6879,6 +6964,7 @@ function AutoCrudTable({ title, description, schema, resource, fields, table: ta
 				data: resource.modal.selected,
 				schema: resolvedSchema,
 				fields: resolvedFields,
+				dynamicOptions: dynamicFilterOptions,
 				denyFields,
 				locale
 			}),
@@ -7926,6 +8012,7 @@ function useAutoCrudResource({ router, schema, query: queryTransform, options =
 	]);
 	const canExport = !!(exportFetcher || exportQuery);
 	return {
+		idKey,
 		tableData: {
 			data: tableRows,
 			pageCount: listQuery.data?.pageCount ?? 0,
@@ -8265,4 +8352,4 @@ function createMemoryDataSource(initialData = []) {
 }
 
 //#endregion
-export { AutoCrudTable, AutoForm, AutoTable, AutoTableActionBar, AutoTableSimpleFilters, CrudFormModal, DataTable, DataTableAdvancedToolbar, DataTableColumnHeader, DataTableFacetedFilter, DataTablePagination, DataTableToolbar, DataTableViewOptions, ExportDialog, ImportDialog, MultiCombobox, SchemaAdapter, cn, coerceRowValues, createActionsColumn, createEditFormSchema, createFormSchema, createMemoryDataSource, createSelectColumn, createTRPCDataSource, createTableSchema, dataSources, dataToCSV, deDE, downloadCSVTemplate, enUS, esES, exportAllToCSV, exportTableToCSV, formComponents, formatDate, frFR, generateCSVTemplate, getUrlParams, humanize, jaJP, koKR, noopToastAdapter, normalizeDataSourceConfig, normalizeOptions, parseAsArrayOf, parseAsInteger, parseAsString, parseAsStringEnum, parseCSV, parseImportFile, parseJSON, parseZodField, resolveLocale, setSearchParams, useAutoCrudResource, useDataTable, useQueryState, useQueryStates, useReadableFilters, useUrlState, useUrlStates, zhCN };
+export { AutoCrudTable, AutoForm, AutoTable, AutoTableActionBar, AutoTableSimpleFilters, CrudFormModal, DataTable, DataTableAdvancedToolbar, DataTableColumnHeader, DataTableFacetedFilter, DataTablePagination, DataTableToolbar, DataTableViewOptions, ExportDialog, ImportDialog, MultiCombobox, SchemaAdapter, cn, coerceRowValues, components, createActionsColumn, createEditFormSchema, createFormSchema, createMemoryDataSource, createSelectColumn, createTRPCDataSource, createTableSchema, dataSources, dataToCSV, deDE, downloadCSVTemplate, enUS, esES, exportAllToCSV, exportTableToCSV, formComponents, formatDate, frFR, generateCSVTemplate, getUrlParams, humanize, jaJP, koKR, noopToastAdapter, normalizeDataSourceConfig, normalizeOptions, parseAsArrayOf, parseAsInteger, parseAsString, parseAsStringEnum, parseCSV, parseImportFile, parseJSON, parseZodField, resolveLocale, setAutoCrudToolbarResolver, setSearchParams, useAutoCrudResource, useDataTable, useQueryState, useQueryStates, useReadableFilters, useUrlState, useUrlStates, zhCN };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@wordrhyme/auto-crud",
   "type": "module",
-  "version": "1.2.1",
+  "version": "1.2.4",
   "description": "Schema-first CRUD components with auto-generated tables and forms",
   "author": "wordrhyme",
   "license": "MIT",
@@ -67,8 +67,8 @@
     "tailwind-merge": "^3.5.0",
     "vaul": "^1.1.2",
     "@pixpilot/formily-shadcn": "1.11.20",
-    "@pixpilot/shadcn": "1.2.7",
-    "@pixpilot/shadcn-ui": "1.21.1"
+    "@pixpilot/shadcn-ui": "1.21.1",
+    "@pixpilot/shadcn": "1.2.7"
   },
   "devDependencies": {
     "@tanstack/react-query": "^5.90.15",
@@ -86,11 +86,11 @@
     "tsdown": "^0.15.12",
     "typescript": "^5.9.3",
     "vitest": "^3.2.4",
-    "@internal/tsconfig": "0.1.0",
+    "@internal/eslint-config": "0.3.0",
     "@internal/prettier-config": "0.0.1",
+    "@internal/tsdown-config": "0.1.0",
     "@internal/vitest-config": "0.1.0",
-    "@internal/eslint-config": "0.3.0",
-    "@internal/tsdown-config": "0.1.0"
+    "@internal/tsconfig": "0.1.0"
   },
   "prettier": "@internal/prettier-config",
   "scripts": {