@lobehub/ui 6.0.0-beta.1 → 6.0.0-beta.11

package/es/ProTable/hooks/useSearchForm.mjs

@@ -0,0 +1,141 @@
+import { useForm } from "../../FormKit/useForm.mjs";
+import { formatDateValue, getByPath, getFieldName, isDateType, isEmptyValue, isNil, resolveValueType, setByPath } from "../utils.mjs";
+import { useMemo, useRef } from "react";
+//#region src/ProTable/hooks/useSearchForm.ts
+const NON_SEARCH_TYPES = /* @__PURE__ */ new Set([
+	"index",
+	"indexBorder",
+	"option"
+]);
+const getSearchFields = (columns = []) => {
+	const list = [];
+	const walk = (items) => {
+		items.forEach((column) => {
+			if (column.children?.length) {
+				walk(column.children);
+				return;
+			}
+			const index = list.length;
+			const valueType = resolveValueType(column);
+			if (column.hideInSearch || column.search === false) return;
+			if (valueType && NON_SEARCH_TYPES.has(valueType)) return;
+			if (isNil(column.dataIndex) && isNil(column.key) && !column.renderFormItem) return;
+			list.push({
+				column,
+				index,
+				name: getFieldName(column, index)
+			});
+		});
+	};
+	walk(columns);
+	return list.map((field, position) => ({
+		field,
+		position
+	})).sort((a, b) => (b.field.column.order ?? 0) - (a.field.column.order ?? 0) || a.position - b.position).map(({ field }) => field);
+};
+const ruleLength = (value) => typeof value === "string" || Array.isArray(value) ? value.length : Number(value);
+const rulesToFieldProps = (rules, required) => {
+	const list = rules ?? [];
+	const requiredRule = list.find((rule) => rule.required);
+	const rest = list.filter((rule) => !rule.required || Object.keys(rule).length > 2);
+	const result = {};
+	if (requiredRule) result.required = requiredRule.message ? String(requiredRule.message) : true;
+	else if (required) result.required = true;
+	if (rest.length === 0) return result;
+	result.validate = async (value, values) => {
+		for (const rule of rest) {
+			const message = rule.message ? String(rule.message) : void 0;
+			if (rule.validator) {
+				try {
+					await rule.validator(rule, value, values);
+				} catch (error) {
+					return (error instanceof Error ? error.message : String(error ?? "")) || message || "Invalid value";
+				}
+				continue;
+			}
+			if (isEmptyValue(value)) continue;
+			if (rule.pattern && !rule.pattern.test(String(value))) return message ?? "Invalid format";
+			if (rule.len !== void 0 && ruleLength(value) !== rule.len) return message ?? `Must be ${rule.len}`;
+			if (rule.min !== void 0 && ruleLength(value) < rule.min) return message ?? `At least ${rule.min}`;
+			if (rule.max !== void 0 && ruleLength(value) > rule.max) return message ?? `At most ${rule.max}`;
+		}
+	};
+	return result;
+};
+const useSearchForm = ({ dateFormatter, fields, initialValues, onSubmit, onValuesChange, validateOn }) => {
+	const latest = useRef({
+		dateFormatter,
+		fields,
+		onSubmit
+	});
+	latest.current = {
+		dateFormatter,
+		fields,
+		onSubmit
+	};
+	const [initial] = useMemo(() => {
+		const values = {};
+		fields.forEach(({ column, name }) => {
+			if (column.initialValue !== void 0) setByPath(values, name, column.initialValue);
+		});
+		return [{
+			...values,
+			...initialValues
+		}];
+	}, []);
+	const format = (raw) => {
+		const { dateFormatter: formatter, fields: list } = latest.current;
+		const result = {};
+		const fieldRoots = new Set(list.map((field) => field.name.split(".")[0]));
+		Object.entries(raw).forEach(([key, value]) => {
+			if (!fieldRoots.has(key) && !isEmptyValue(value)) result[key] = value;
+		});
+		list.forEach(({ column, name }) => {
+			const value = getByPath(raw, name.split("."));
+			if (isEmptyValue(value)) return;
+			const valueType = resolveValueType(column);
+			let next = valueType && isDateType(valueType) ? formatDateValue(value, valueType, formatter) : value;
+			const { search } = column;
+			if (search && typeof search === "object" && search.transform) {
+				const transformed = search.transform(next, name, raw);
+				if (transformed && typeof transformed === "object") {
+					Object.assign(result, transformed);
+					return;
+				}
+				if (typeof transformed === "string") {
+					setByPath(result, transformed, next);
+					return;
+				}
+				next = transformed;
+			}
+			setByPath(result, name, next);
+		});
+		return result;
+	};
+	const base = useForm({
+		initialValues: initial,
+		onSubmit: (values) => latest.current.onSubmit(format(values)),
+		onValuesChange,
+		validateOn
+	});
+	return {
+		base,
+		form: useMemo(() => Object.assign(base, {
+			getFieldsFormatValue: () => format(base.getValues()),
+			getFieldsValue: () => base.getValues(),
+			getFieldValue: (name) => base.getValue(name),
+			resetFields: () => base.reset(structuredClone(initial)),
+			setFieldsValue: (values) => base.setValues(values),
+			setFieldValue: (name, value) => base.setValue(name, value),
+			validateFields: async () => {
+				const result = await base.validate();
+				if (!result.valid) throw result;
+				return base.getValues();
+			}
+		}), [base])
+	};
+};
+//#endregion
+export { getSearchFields, rulesToFieldProps, useSearchForm };
+
+//# sourceMappingURL=useSearchForm.mjs.map

package/es/ProTable/hooks/useSearchForm.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearchForm.mjs","names":[],"sources":["../../../src/ProTable/hooks/useSearchForm.ts"],"sourcesContent":["import {\n  type FieldValidate,\n  type FormValues,\n  useForm,\n  type UseFormOptions,\n} from '@lobehub/ui/form';\nimport { useMemo, useRef } from 'react';\n\nimport type { ProColumnType, ProTableFormInstance, ProTableFormRule } from '../type';\nimport {\n  type DateFormatter,\n  formatDateValue,\n  getByPath,\n  getFieldName,\n  isDateType,\n  isEmptyValue,\n  isNil,\n  resolveValueType,\n  setByPath,\n} from '../utils';\n\ntype ValidateOn = UseFormOptions<FormValues>['validateOn'];\n\nexport interface SearchFieldSchema {\n  column: ProColumnType<any>;\n  index: number;\n  name: string;\n}\n\nconst NON_SEARCH_TYPES = new Set(['index', 'indexBorder', 'option']);\n\nexport const getSearchFields = (columns: ProColumnType<any>[] = []): SearchFieldSchema[] => {\n  const list: SearchFieldSchema[] = [];\n  const walk = (items: ProColumnType<any>[]) => {\n    items.forEach((column) => {\n      if (column.children?.length) {\n        walk(column.children);\n        return;\n      }\n      const index = list.length;\n      const valueType = resolveValueType(column);\n      if (column.hideInSearch || column.search === false) return;\n      if (valueType && NON_SEARCH_TYPES.has(valueType)) return;\n      if (isNil(column.dataIndex) && isNil(column.key) && !column.renderFormItem) return;\n      list.push({ column, index, name: getFieldName(column, index) });\n    });\n  };\n  walk(columns);\n  // Pro: larger `order` first; stable for equal orders.\n  return list\n    .map((field, position) => ({ field, position }))\n    .sort(\n      (a, b) =>\n        (b.field.column.order ?? 0) - (a.field.column.order ?? 0) || a.position - b.position,\n    )\n    .map(({ field }) => field);\n};\n\nconst ruleLength = (value: unknown) =>\n  typeof value === 'string' || Array.isArray(value) ? value.length : Number(value);\n\nexport const rulesToFieldProps = (\n  rules: ProTableFormRule[] | undefined,\n  required?: boolean,\n): { required?: boolean | string; validate?: FieldValidate } => {\n  const list = rules ?? [];\n  const requiredRule = list.find((rule) => rule.required);\n  const rest = list.filter((rule) => !rule.required || Object.keys(rule).length > 2);\n  const result: { required?: boolean | string; validate?: FieldValidate } = {};\n  if (requiredRule) result.required = requiredRule.message ? String(requiredRule.message) : true;\n  else if (required) result.required = true;\n  if (rest.length === 0) return result;\n  result.validate = async (value, values) => {\n    for (const rule of rest) {\n      const message = rule.message ? String(rule.message) : undefined;\n      if (rule.validator) {\n        try {\n          await rule.validator(rule, value, values);\n        } catch (error) {\n          return (\n            (error instanceof Error ? error.message : String(error ?? '')) ||\n            message ||\n            'Invalid value'\n          );\n        }\n        continue;\n      }\n      if (isEmptyValue(value)) continue;\n      if (rule.pattern && !rule.pattern.test(String(value))) return message ?? 'Invalid format';\n      if (rule.len !== undefined && ruleLength(value) !== rule.len)\n        return message ?? `Must be ${rule.len}`;\n      if (rule.min !== undefined && ruleLength(value) < rule.min)\n        return message ?? `At least ${rule.min}`;\n      if (rule.max !== undefined && ruleLength(value) > rule.max)\n        return message ?? `At most ${rule.max}`;\n    }\n    return undefined;\n  };\n  return result;\n};\n\nexport interface UseSearchFormOptions {\n  dateFormatter: DateFormatter;\n  fields: SearchFieldSchema[];\n  initialValues?: Record<string, any>;\n  onSubmit: (formatted: Record<string, any>) => void;\n  onValuesChange?: (changed: Record<string, any>, all: Record<string, any>) => void;\n  validateOn?: ValidateOn;\n}\n\nexport const useSearchForm = ({\n  dateFormatter,\n  fields,\n  initialValues,\n  onSubmit,\n  onValuesChange,\n  validateOn,\n}: UseSearchFormOptions) => {\n  const latest = useRef({ dateFormatter, fields, onSubmit });\n  latest.current = { dateFormatter, fields, onSubmit };\n\n  const [initial] = useMemo(() => {\n    const values: Record<string, any> = {};\n    fields.forEach(({ column, name }) => {\n      if (column.initialValue !== undefined) setByPath(values, name, column.initialValue);\n    });\n    return [{ ...values, ...initialValues }];\n    // Initial values are read once, like antd / Pro.\n  }, []);\n\n  const format = (raw: Record<string, any>) => {\n    const { dateFormatter: formatter, fields: list } = latest.current;\n    const result: Record<string, any> = {};\n    const fieldRoots = new Set(list.map((field) => field.name.split('.')[0]));\n    // Values set through `formRef` without a matching field pass through untouched.\n    Object.entries(raw).forEach(([key, value]) => {\n      if (!fieldRoots.has(key) && !isEmptyValue(value)) result[key] = value;\n    });\n    list.forEach(({ column, name }) => {\n      const value = getByPath(raw, name.split('.'));\n      if (isEmptyValue(value)) return;\n      const valueType = resolveValueType(column);\n      let next =\n        valueType && isDateType(valueType) ? formatDateValue(value, valueType, formatter) : value;\n      const { search } = column;\n      if (search && typeof search === 'object' && search.transform) {\n        const transformed = search.transform(next, name, raw);\n        if (transformed && typeof transformed === 'object') {\n          Object.assign(result, transformed);\n          return;\n        }\n        if (typeof transformed === 'string') {\n          setByPath(result, transformed, next);\n          return;\n        }\n        next = transformed;\n      }\n      setByPath(result, name, next);\n    });\n    return result;\n  };\n\n  const base = useForm<Record<string, any>>({\n    initialValues: initial,\n    onSubmit: (values) => latest.current.onSubmit(format(values)),\n    onValuesChange,\n    validateOn,\n  });\n\n  // Aliases go onto the instance itself: base-ui `Form` looks the instance up by identity.\n  const form = useMemo<ProTableFormInstance>(\n    () =>\n      Object.assign(base, {\n        getFieldsFormatValue: () => format(base.getValues()),\n        getFieldsValue: () => base.getValues(),\n        getFieldValue: (name: string) => base.getValue(name),\n        // base-ui `reset()` returns to the last submitted values; Pro resets to the initial ones.\n        resetFields: () => base.reset(structuredClone(initial)),\n        setFieldsValue: (values: Record<string, any>) => base.setValues(values),\n        setFieldValue: (name: string, value: any) => base.setValue(name, value),\n        validateFields: async () => {\n          const result = await base.validate();\n          if (!result.valid) throw result;\n          return base.getValues();\n        },\n      }) as ProTableFormInstance,\n    // `format` only reads `latest`.\n    [base],\n  );\n\n  return { base, form };\n};\n"],"mappings":"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"}

package/es/ProTable/hooks/useTableBindings.mjs

@@ -0,0 +1,39 @@
+import { useEventCallback } from "../../hooks/useEventCallback.mjs";
+import { useMemo } from "react";
+//#region src/ProTable/hooks/useTableBindings.ts
+const useTableBindings = ({ hasRequest, pageInfo, paginationConfig, rowSelection, setPageInfo }) => {
+	const rowSelectionProp = useMemo(() => {
+		if (!rowSelection) return void 0;
+		const { alwaysShowAlert: _always, ...rest } = rowSelection;
+		return {
+			...rest,
+			preserveSelectedRowKeys: rest.preserveSelectedRowKeys ?? hasRequest
+		};
+	}, [rowSelection, hasRequest]);
+	const onPageChange = useEventCallback((page, pageSize) => {
+		setPageInfo({
+			current: page,
+			pageSize
+		});
+		if (paginationConfig) paginationConfig.onChange?.(page, pageSize);
+	});
+	return {
+		pagination: useMemo(() => paginationConfig === false ? false : {
+			...paginationConfig,
+			current: pageInfo.current,
+			onChange: onPageChange,
+			pageSize: pageInfo.pageSize,
+			...hasRequest && { total: pageInfo.total }
+		}, [
+			paginationConfig,
+			pageInfo,
+			onPageChange,
+			hasRequest
+		]),
+		rowSelection: rowSelectionProp
+	};
+};
+//#endregion
+export { useTableBindings };
+
+//# sourceMappingURL=useTableBindings.mjs.map

package/es/ProTable/hooks/useTableBindings.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableBindings.mjs","names":[],"sources":["../../../src/ProTable/hooks/useTableBindings.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useEventCallback } from '@/hooks/useEventCallback';\nimport type { TablePaginationConfig } from '@/Table/type';\n\nimport type { ProTablePageInfo, ProTableProps } from '../type';\n\ninterface TableBindingsOptions<T> {\n  hasRequest: boolean;\n  pageInfo: ProTablePageInfo;\n  paginationConfig: TablePaginationConfig | false;\n  rowSelection: ProTableProps<T>['rowSelection'];\n  setPageInfo: (next: Partial<ProTablePageInfo>) => void;\n}\n\nexport const useTableBindings = <T>({\n  hasRequest,\n  pageInfo,\n  paginationConfig,\n  rowSelection,\n  setPageInfo,\n}: TableBindingsOptions<T>) => {\n  const rowSelectionProp = useMemo(() => {\n    if (!rowSelection) return undefined;\n    const { alwaysShowAlert: _always, ...rest } = rowSelection;\n    return { ...rest, preserveSelectedRowKeys: rest.preserveSelectedRowKeys ?? hasRequest };\n  }, [rowSelection, hasRequest]);\n\n  const onPageChange = useEventCallback((page: number, pageSize: number) => {\n    setPageInfo({ current: page, pageSize });\n    if (paginationConfig) paginationConfig.onChange?.(page, pageSize);\n  });\n  const pagination = useMemo(\n    (): TablePaginationConfig | false =>\n      paginationConfig === false\n        ? false\n        : {\n            ...paginationConfig,\n            current: pageInfo.current,\n            onChange: onPageChange,\n            pageSize: pageInfo.pageSize,\n            ...(hasRequest && { total: pageInfo.total }),\n          },\n    [paginationConfig, pageInfo, onPageChange, hasRequest],\n  );\n\n  return { pagination, rowSelection: rowSelectionProp };\n};\n"],"mappings":";;;AAeA,MAAa,oBAAuB,EAClC,YACA,UACA,kBACA,cACA,kBAC6B;CAC7B,MAAM,mBAAmB,cAAc;EACrC,IAAI,CAAC,cAAc,OAAO,KAAA;EAC1B,MAAM,EAAE,iBAAiB,SAAS,GAAG,SAAS;EAC9C,OAAO;GAAE,GAAG;GAAM,yBAAyB,KAAK,2BAA2B;EAAW;CACxF,GAAG,CAAC,cAAc,UAAU,CAAC;CAE7B,MAAM,eAAe,kBAAkB,MAAc,aAAqB;EACxE,YAAY;GAAE,SAAS;GAAM;EAAS,CAAC;EACvC,IAAI,kBAAkB,iBAAiB,WAAW,MAAM,QAAQ;CAClE,CAAC;CAeD,OAAO;EAAE,YAdU,cAEf,qBAAqB,QACjB,QACA;GACE,GAAG;GACH,SAAS,SAAS;GAClB,UAAU;GACV,UAAU,SAAS;GACnB,GAAI,cAAc,EAAE,OAAO,SAAS,MAAM;EAC5C,GACN;GAAC;GAAkB;GAAU;GAAc;EAAU,CAGrC;EAAG,cAAc;CAAiB;AACtD"}

package/es/ProTable/hooks/useTableSelection.mjs

@@ -0,0 +1,14 @@
+import { useCallback, useMemo, useSyncExternalStore } from "react";
+//#region src/ProTable/hooks/useTableSelection.ts
+const EMPTY = /* @__PURE__ */ new Set();
+const noop = () => {};
+const useSelectedRowKeys = (handleRef) => {
+	const subscribe = useCallback((notify) => handleRef.current?.store.subscribe(notify) ?? noop, [handleRef]);
+	const getSnapshot = () => handleRef.current?.store.getState().selectedKeys ?? EMPTY;
+	const keySet = useSyncExternalStore(subscribe, getSnapshot, () => EMPTY);
+	return useMemo(() => [...keySet], [keySet]);
+};
+//#endregion
+export { useSelectedRowKeys };
+
+//# sourceMappingURL=useTableSelection.mjs.map

package/es/ProTable/hooks/useTableSelection.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableSelection.mjs","names":[],"sources":["../../../src/ProTable/hooks/useTableSelection.ts"],"sourcesContent":["import { type Key, type RefObject, useCallback, useMemo, useSyncExternalStore } from 'react';\n\nimport type { TableInternalHandle } from '@/Table/internal';\n\nconst EMPTY: ReadonlySet<Key> = new Set();\nconst noop = () => {};\n\nexport const useSelectedRowKeys = (handleRef: RefObject<TableInternalHandle | null>) => {\n  const subscribe = useCallback(\n    (notify: () => void) => handleRef.current?.store.subscribe(notify) ?? noop,\n    [handleRef],\n  );\n  const getSnapshot = () => handleRef.current?.store.getState().selectedKeys ?? EMPTY;\n  const keySet = useSyncExternalStore(subscribe, getSnapshot, () => EMPTY);\n  return useMemo(() => [...keySet], [keySet]);\n};\n"],"mappings":";;AAIA,MAAM,wBAA0B,IAAI,IAAI;AACxC,MAAM,aAAa,CAAC;AAEpB,MAAa,sBAAsB,cAAqD;CACtF,MAAM,YAAY,aACf,WAAuB,UAAU,SAAS,MAAM,UAAU,MAAM,KAAK,MACtE,CAAC,SAAS,CACZ;CACA,MAAM,oBAAoB,UAAU,SAAS,MAAM,SAAS,CAAC,CAAC,gBAAgB;CAC9E,MAAM,SAAS,qBAAqB,WAAW,mBAAmB,KAAK;CACvE,OAAO,cAAc,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,CAAC;AAC5C"}

package/es/ProTable/index.d.mts

@@ -0,0 +1,4 @@
+import { ProColumnRequest, ProColumnType, ProColumns, ProTableActionType, ProTableAlertRender, ProTableAlertRenderProps, ProTableColumnsState, ProTableColumnsStateItem, ProTableColumnsStateMap, ProTableDensity, ProTableFormInstance, ProTableLoadingConfig, ProTableLocale, ProTableOptionConfig, ProTablePageInfo, ProTableProps, ProTableRequest, ProTableRequestData, ProTableRequestFilter, ProTableRequestOption, ProTableRequestSort, ProTableSchemaConfig, ProTableSearchConfig, ProTableSearchTransform, ProTableSpanBreakpoint, ProTableSpanConfig, ProTableStatus, ProTableToolbarConfig, ProTableValueEnum, ProTableValueEnumItem, ProTableValueType } from "./type.mjs";
+import { PRO_TABLE_LOCALES, PRO_TABLE_LOCALE_EN_US, PRO_TABLE_LOCALE_ZH_CN, ProTableLocaleResolved, resolveProTableLocale } from "./locale.mjs";
+import ProTable, { DEFAULT_PRO_TABLE_LOCALE } from "./ProTable.mjs";
+export { DEFAULT_PRO_TABLE_LOCALE, PRO_TABLE_LOCALES, PRO_TABLE_LOCALE_EN_US, PRO_TABLE_LOCALE_ZH_CN, type ProColumnRequest, type ProColumnType, type ProColumns, ProTable, type ProTableActionType, type ProTableAlertRender, type ProTableAlertRenderProps, type ProTableColumnsState, type ProTableColumnsStateItem, type ProTableColumnsStateMap, type ProTableDensity, type ProTableFormInstance, type ProTableLoadingConfig, type ProTableLocale, type ProTableLocaleResolved, type ProTableOptionConfig, type ProTablePageInfo, type ProTableProps, type ProTableRequest, type ProTableRequestData, type ProTableRequestFilter, type ProTableRequestOption, type ProTableRequestSort, type ProTableSchemaConfig, type ProTableSearchConfig, type ProTableSearchTransform, type ProTableSpanBreakpoint, type ProTableSpanConfig, type ProTableStatus, type ProTableToolbarConfig, type ProTableValueEnum, type ProTableValueEnumItem, type ProTableValueType, ProTable as default, resolveProTableLocale };

package/es/ProTable/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/ProTable/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/ProTable/index.mjs

@@ -0,0 +1,3 @@
+import { PRO_TABLE_LOCALES, PRO_TABLE_LOCALE_EN_US, PRO_TABLE_LOCALE_ZH_CN, resolveProTableLocale } from "./locale.mjs";
+import ProTable, { DEFAULT_PRO_TABLE_LOCALE } from "./ProTable.mjs";
+export { DEFAULT_PRO_TABLE_LOCALE, PRO_TABLE_LOCALES, PRO_TABLE_LOCALE_EN_US, PRO_TABLE_LOCALE_ZH_CN, ProTable, ProTable as default, resolveProTableLocale };

package/es/ProTable/locale.d.mts

@@ -0,0 +1,15 @@
+import { ProTableLocale } from "./type.mjs";
+import { ReactNode } from "react";
+//#region src/ProTable/locale.d.ts
+export type ProTableLocaleResolved = Required<Omit<ProTableLocale, 'alertSelected'>> & {
+  alertSelected: (count: number) => ReactNode;
+};
+export declare const PRO_TABLE_LOCALE_EN_US: ProTableLocaleResolved;
+export declare const PRO_TABLE_LOCALE_ZH_CN: ProTableLocaleResolved;
+export declare const PRO_TABLE_LOCALES: {
+  readonly 'en-US': ProTableLocaleResolved;
+  readonly 'zh-CN': ProTableLocaleResolved;
+};
+export declare const resolveProTableLocale: (language?: string) => ProTableLocaleResolved;
+//#endregion
+//# sourceMappingURL=locale.d.mts.map

package/es/ProTable/locale.mjs

@@ -0,0 +1,66 @@
+//#region src/ProTable/locale.ts
+const PRO_TABLE_LOCALE_EN_US = {
+	alertClear: "Clear",
+	alertSelected: (count) => `${count} selected`,
+	collapse: "Collapse",
+	columnSetting: "Column settings",
+	columnSettingReset: "Reset",
+	columnSettingTitle: "Columns",
+	copy: "Copy",
+	density: "Density",
+	densityLarge: "Large",
+	densityMedium: "Medium",
+	densitySmall: "Compact",
+	expand: "Expand",
+	fixedEnd: "Pin to end",
+	fixedEndTitle: "Pinned to end",
+	fixedStart: "Pin to start",
+	fixedStartTitle: "Pinned to start",
+	fullScreen: "Full screen",
+	moveDown: "Move down",
+	moveUp: "Move up",
+	noFixed: "Unpin",
+	reload: "Reload",
+	reset: "Reset",
+	search: "Search",
+	searchPlaceholder: "Please enter",
+	selectPlaceholder: "Please select",
+	unfixedTitle: "Not pinned"
+};
+const PRO_TABLE_LOCALE_ZH_CN = {
+	alertClear: "取消选择",
+	alertSelected: (count) => `已选择 ${count} 项`,
+	collapse: "收起",
+	columnSetting: "列设置",
+	columnSettingReset: "重置",
+	columnSettingTitle: "列展示",
+	copy: "复制",
+	density: "密度",
+	densityLarge: "宽松",
+	densityMedium: "中等",
+	densitySmall: "紧凑",
+	expand: "展开",
+	fixedEnd: "固定在列尾",
+	fixedEndTitle: "固定在右侧",
+	fixedStart: "固定在列首",
+	fixedStartTitle: "固定在左侧",
+	fullScreen: "全屏",
+	moveDown: "下移",
+	moveUp: "上移",
+	noFixed: "取消固定",
+	reload: "刷新",
+	reset: "重置",
+	search: "查询",
+	searchPlaceholder: "请输入",
+	selectPlaceholder: "请选择",
+	unfixedTitle: "不固定"
+};
+const PRO_TABLE_LOCALES = {
+	"en-US": PRO_TABLE_LOCALE_EN_US,
+	"zh-CN": PRO_TABLE_LOCALE_ZH_CN
+};
+const resolveProTableLocale = (language) => language && /^zh/i.test(language) ? PRO_TABLE_LOCALE_ZH_CN : PRO_TABLE_LOCALE_EN_US;
+//#endregion
+export { PRO_TABLE_LOCALES, PRO_TABLE_LOCALE_EN_US, PRO_TABLE_LOCALE_ZH_CN, resolveProTableLocale };
+
+//# sourceMappingURL=locale.mjs.map

package/es/ProTable/locale.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"locale.mjs","names":[],"sources":["../../src/ProTable/locale.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport type { ProTableLocale } from './type';\n\nexport type ProTableLocaleResolved = Required<Omit<ProTableLocale, 'alertSelected'>> & {\n  alertSelected: (count: number) => ReactNode;\n};\n\nexport const PRO_TABLE_LOCALE_EN_US: ProTableLocaleResolved = {\n  alertClear: 'Clear',\n  alertSelected: (count) => `${count} selected`,\n  collapse: 'Collapse',\n  columnSetting: 'Column settings',\n  columnSettingReset: 'Reset',\n  columnSettingTitle: 'Columns',\n  copy: 'Copy',\n  density: 'Density',\n  densityLarge: 'Large',\n  densityMedium: 'Medium',\n  densitySmall: 'Compact',\n  expand: 'Expand',\n  fixedEnd: 'Pin to end',\n  fixedEndTitle: 'Pinned to end',\n  fixedStart: 'Pin to start',\n  fixedStartTitle: 'Pinned to start',\n  fullScreen: 'Full screen',\n  moveDown: 'Move down',\n  moveUp: 'Move up',\n  noFixed: 'Unpin',\n  reload: 'Reload',\n  reset: 'Reset',\n  search: 'Search',\n  searchPlaceholder: 'Please enter',\n  selectPlaceholder: 'Please select',\n  unfixedTitle: 'Not pinned',\n};\n\nexport const PRO_TABLE_LOCALE_ZH_CN: ProTableLocaleResolved = {\n  alertClear: '取消选择',\n  alertSelected: (count) => `已选择 ${count} 项`,\n  collapse: '收起',\n  columnSetting: '列设置',\n  columnSettingReset: '重置',\n  columnSettingTitle: '列展示',\n  copy: '复制',\n  density: '密度',\n  densityLarge: '宽松',\n  densityMedium: '中等',\n  densitySmall: '紧凑',\n  expand: '展开',\n  fixedEnd: '固定在列尾',\n  fixedEndTitle: '固定在右侧',\n  fixedStart: '固定在列首',\n  fixedStartTitle: '固定在左侧',\n  fullScreen: '全屏',\n  moveDown: '下移',\n  moveUp: '上移',\n  noFixed: '取消固定',\n  reload: '刷新',\n  reset: '重置',\n  search: '查询',\n  searchPlaceholder: '请输入',\n  selectPlaceholder: '请选择',\n  unfixedTitle: '不固定',\n};\n\nexport const PRO_TABLE_LOCALES = {\n  'en-US': PRO_TABLE_LOCALE_EN_US,\n  'zh-CN': PRO_TABLE_LOCALE_ZH_CN,\n} as const;\n\nexport const resolveProTableLocale = (language?: string): ProTableLocaleResolved =>\n  language && /^zh/i.test(language) ? PRO_TABLE_LOCALE_ZH_CN : PRO_TABLE_LOCALE_EN_US;\n"],"mappings":";AAQA,MAAa,yBAAiD;CAC5D,YAAY;CACZ,gBAAgB,UAAU,GAAG,MAAM;CACnC,UAAU;CACV,eAAe;CACf,oBAAoB;CACpB,oBAAoB;CACpB,MAAM;CACN,SAAS;CACT,cAAc;CACd,eAAe;CACf,cAAc;CACd,QAAQ;CACR,UAAU;CACV,eAAe;CACf,YAAY;CACZ,iBAAiB;CACjB,YAAY;CACZ,UAAU;CACV,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,mBAAmB;CACnB,mBAAmB;CACnB,cAAc;AAChB;AAEA,MAAa,yBAAiD;CAC5D,YAAY;CACZ,gBAAgB,UAAU,OAAO,MAAM;CACvC,UAAU;CACV,eAAe;CACf,oBAAoB;CACpB,oBAAoB;CACpB,MAAM;CACN,SAAS;CACT,cAAc;CACd,eAAe;CACf,cAAc;CACd,QAAQ;CACR,UAAU;CACV,eAAe;CACf,YAAY;CACZ,iBAAiB;CACjB,YAAY;CACZ,UAAU;CACV,QAAQ;CACR,SAAS;CACT,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,mBAAmB;CACnB,mBAAmB;CACnB,cAAc;AAChB;AAEA,MAAa,oBAAoB;CAC/B,SAAS;CACT,SAAS;AACX;AAEA,MAAa,yBAAyB,aACpC,YAAY,OAAO,KAAK,QAAQ,IAAI,yBAAyB"}

package/es/ProTable/parts/ColumnSetting.mjs

@@ -0,0 +1,155 @@
+import Button from "../../Button/Button.mjs";
+import ActionIcon from "../../ActionIcon/ActionIcon.mjs";
+import Checkbox_default from "../../Checkbox/Checkbox.mjs";
+import { styles } from "../style.mjs";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { ArrowDown, ArrowLeftToLine, ArrowRightToLine, ArrowUp, PinOff } from "lucide-react";
+//#region src/ProTable/parts/ColumnSetting.tsx
+const fixedGroupOf = (fixed) => {
+	if (fixed === true || fixed === "left" || fixed === "start") return "start";
+	if (fixed === "right" || fixed === "end") return "end";
+	return "none";
+};
+const ColumnSetting = ({ checkable = true, columns, draggable = true, locale, onChange, onReset, showListItemOption = true, state }) => {
+	const isShown = (key) => state[key]?.show !== false;
+	const toggleable = columns.filter((column) => !column.disabled);
+	const shownCount = toggleable.filter((column) => isShown(column.key)).length;
+	const patch = (key, value) => onChange({
+		...state,
+		[key]: {
+			...state[key],
+			...value
+		}
+	});
+	const setAll = (show) => {
+		const next = { ...state };
+		toggleable.forEach(({ key }) => {
+			next[key] = {
+				...next[key],
+				show
+			};
+		});
+		onChange(next);
+	};
+	const groups = {
+		end: [],
+		none: [],
+		start: []
+	};
+	columns.forEach((column) => groups[fixedGroupOf(state[column.key]?.fixed)].push(column));
+	const move = (key, delta) => {
+		const keys = columns.map((column) => column.key);
+		const from = keys.indexOf(key);
+		const to = from + delta;
+		if (from < 0 || to < 0 || to >= keys.length) return;
+		[keys[from], keys[to]] = [keys[to], keys[from]];
+		const next = { ...state };
+		keys.forEach((k, order) => {
+			next[k] = {
+				...next[k],
+				order
+			};
+		});
+		onChange(next);
+	};
+	const renderItem = (column, group) => {
+		const position = columns.indexOf(column);
+		return /* @__PURE__ */ jsxs("div", {
+			className: styles.settingItem,
+			"data-column-key": column.key,
+			children: [
+				checkable ? /* @__PURE__ */ jsx(Checkbox_default, {
+					checked: isShown(column.key),
+					disabled: column.disabled,
+					onChange: (checked) => patch(column.key, { show: checked }),
+					children: /* @__PURE__ */ jsx("span", {
+						className: styles.settingItemTitle,
+						children: column.title
+					})
+				}) : /* @__PURE__ */ jsx("span", {
+					className: styles.settingItemTitle,
+					children: column.title
+				}),
+				/* @__PURE__ */ jsx("span", { style: { flex: 1 } }),
+				/* @__PURE__ */ jsxs("span", {
+					className: styles.settingItemActions,
+					"data-setting-actions": "",
+					children: [
+						showListItemOption && group !== "start" && /* @__PURE__ */ jsx(ActionIcon, {
+							"aria-label": locale.fixedStart,
+							icon: ArrowLeftToLine,
+							size: "small",
+							onClick: () => patch(column.key, { fixed: "start" })
+						}),
+						showListItemOption && group !== "none" && /* @__PURE__ */ jsx(ActionIcon, {
+							"aria-label": locale.noFixed,
+							icon: PinOff,
+							size: "small",
+							onClick: () => patch(column.key, { fixed: void 0 })
+						}),
+						showListItemOption && group !== "end" && /* @__PURE__ */ jsx(ActionIcon, {
+							"aria-label": locale.fixedEnd,
+							icon: ArrowRightToLine,
+							size: "small",
+							onClick: () => patch(column.key, { fixed: "end" })
+						}),
+						draggable && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ActionIcon, {
+							"aria-label": locale.moveUp,
+							disabled: position === 0,
+							icon: ArrowUp,
+							size: "small",
+							onClick: () => move(column.key, -1)
+						}), /* @__PURE__ */ jsx(ActionIcon, {
+							"aria-label": locale.moveDown,
+							disabled: position === columns.length - 1,
+							icon: ArrowDown,
+							size: "small",
+							onClick: () => move(column.key, 1)
+						})] })
+					]
+				})
+			]
+		}, column.key);
+	};
+	const titles = {
+		end: locale.fixedEndTitle,
+		none: locale.unfixedTitle,
+		start: locale.fixedStartTitle
+	};
+	const pinnedAny = groups.start.length > 0 || groups.end.length > 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className: styles.setting,
+		"data-pro-table-setting": "",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: styles.settingHeader,
+			children: [checkable ? /* @__PURE__ */ jsx(Checkbox_default, {
+				checked: shownCount > 0 && shownCount === toggleable.length,
+				indeterminate: shownCount > 0 && shownCount < toggleable.length,
+				onChange: (checked) => setAll(checked),
+				children: locale.columnSettingTitle
+			}) : /* @__PURE__ */ jsx("span", { children: locale.columnSettingTitle }), /* @__PURE__ */ jsx(Button, {
+				size: "small",
+				type: "link",
+				onClick: onReset,
+				children: locale.columnSettingReset
+			})]
+		}), /* @__PURE__ */ jsx("div", {
+			className: styles.settingList,
+			children: [
+				"start",
+				"none",
+				"end"
+			].map((group) => groups[group].length === 0 ? null : /* @__PURE__ */ jsxs("div", {
+				"data-group": group,
+				children: [pinnedAny && /* @__PURE__ */ jsx("div", {
+					className: styles.settingGroupTitle,
+					children: titles[group]
+				}), groups[group].map((column) => renderItem(column, group))]
+			}, group))
+		})]
+	});
+};
+//#endregion
+export { ColumnSetting as default, fixedGroupOf };
+
+//# sourceMappingURL=ColumnSetting.mjs.map

package/es/ProTable/parts/ColumnSetting.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnSetting.mjs","names":["Checkbox"],"sources":["../../../src/ProTable/parts/ColumnSetting.tsx"],"sourcesContent":["import { ArrowDown, ArrowLeftToLine, ArrowRightToLine, ArrowUp, PinOff } from 'lucide-react';\nimport { type ReactNode } from 'react';\n\nimport ActionIcon from '@/ActionIcon';\nimport Button from '@/Button';\nimport Checkbox from '@/Checkbox/Checkbox';\n\nimport { styles } from '../style';\nimport type { ProTableColumnsStateItem, ProTableColumnsStateMap, ProTableLocale } from '../type';\n\nexport interface SettingColumn {\n  disabled: boolean;\n  key: string;\n  title: ReactNode;\n}\n\ntype FixedGroup = 'start' | 'none' | 'end';\n\nexport const fixedGroupOf = (fixed: ProTableColumnsStateItem['fixed']): FixedGroup => {\n  if (fixed === true || fixed === 'left' || fixed === 'start') return 'start';\n  if (fixed === 'right' || fixed === 'end') return 'end';\n  return 'none';\n};\n\nexport interface ColumnSettingProps {\n  checkable?: boolean;\n  columns: SettingColumn[];\n  draggable?: boolean;\n  locale: Required<\n    Pick<\n      ProTableLocale,\n      | 'columnSetting'\n      | 'columnSettingReset'\n      | 'columnSettingTitle'\n      | 'fixedEnd'\n      | 'fixedEndTitle'\n      | 'fixedStart'\n      | 'fixedStartTitle'\n      | 'moveDown'\n      | 'moveUp'\n      | 'noFixed'\n      | 'unfixedTitle'\n    >\n  >;\n  onChange: (map: ProTableColumnsStateMap) => void;\n  onReset: () => void;\n  showListItemOption?: boolean;\n  state: ProTableColumnsStateMap;\n}\n\nconst ColumnSetting = ({\n  checkable = true,\n  columns,\n  draggable = true,\n  locale,\n  onChange,\n  onReset,\n  showListItemOption = true,\n  state,\n}: ColumnSettingProps) => {\n  const isShown = (key: string) => state[key]?.show !== false;\n  const toggleable = columns.filter((column) => !column.disabled);\n  const shownCount = toggleable.filter((column) => isShown(column.key)).length;\n\n  const patch = (key: string, value: Partial<ProTableColumnsStateItem>) =>\n    onChange({ ...state, [key]: { ...state[key], ...value } });\n\n  const setAll = (show: boolean) => {\n    const next = { ...state };\n    toggleable.forEach(({ key }) => {\n      next[key] = { ...next[key], show };\n    });\n    onChange(next);\n  };\n\n  const groups: Record<FixedGroup, SettingColumn[]> = { end: [], none: [], start: [] };\n  columns.forEach((column) => groups[fixedGroupOf(state[column.key]?.fixed)].push(column));\n\n  // Reorder within the full list; `order` is rewritten for every column so it stays dense.\n  const move = (key: string, delta: -1 | 1) => {\n    const keys = columns.map((column) => column.key);\n    const from = keys.indexOf(key);\n    const to = from + delta;\n    if (from < 0 || to < 0 || to >= keys.length) return;\n    [keys[from], keys[to]] = [keys[to], keys[from]];\n    const next = { ...state };\n    keys.forEach((k, order) => {\n      next[k] = { ...next[k], order };\n    });\n    onChange(next);\n  };\n\n  const renderItem = (column: SettingColumn, group: FixedGroup) => {\n    const position = columns.indexOf(column);\n    return (\n      <div className={styles.settingItem} data-column-key={column.key} key={column.key}>\n        {checkable ? (\n          <Checkbox\n            checked={isShown(column.key)}\n            disabled={column.disabled}\n            onChange={(checked) => patch(column.key, { show: checked })}\n          >\n            <span className={styles.settingItemTitle}>{column.title}</span>\n          </Checkbox>\n        ) : (\n          <span className={styles.settingItemTitle}>{column.title}</span>\n        )}\n        <span style={{ flex: 1 }} />\n        <span className={styles.settingItemActions} data-setting-actions=\"\">\n          {showListItemOption && group !== 'start' && (\n            <ActionIcon\n              aria-label={locale.fixedStart}\n              icon={ArrowLeftToLine}\n              size=\"small\"\n              onClick={() => patch(column.key, { fixed: 'start' })}\n            />\n          )}\n          {showListItemOption && group !== 'none' && (\n            <ActionIcon\n              aria-label={locale.noFixed}\n              icon={PinOff}\n              size=\"small\"\n              onClick={() => patch(column.key, { fixed: undefined })}\n            />\n          )}\n          {showListItemOption && group !== 'end' && (\n            <ActionIcon\n              aria-label={locale.fixedEnd}\n              icon={ArrowRightToLine}\n              size=\"small\"\n              onClick={() => patch(column.key, { fixed: 'end' })}\n            />\n          )}\n          {draggable && (\n            <>\n              <ActionIcon\n                aria-label={locale.moveUp}\n                disabled={position === 0}\n                icon={ArrowUp}\n                size=\"small\"\n                onClick={() => move(column.key, -1)}\n              />\n              <ActionIcon\n                aria-label={locale.moveDown}\n                disabled={position === columns.length - 1}\n                icon={ArrowDown}\n                size=\"small\"\n                onClick={() => move(column.key, 1)}\n              />\n            </>\n          )}\n        </span>\n      </div>\n    );\n  };\n\n  const titles: Record<FixedGroup, ReactNode> = {\n    end: locale.fixedEndTitle,\n    none: locale.unfixedTitle,\n    start: locale.fixedStartTitle,\n  };\n  const pinnedAny = groups.start.length > 0 || groups.end.length > 0;\n\n  const panel = (\n    <div className={styles.setting} data-pro-table-setting=\"\">\n      <div className={styles.settingHeader}>\n        {checkable ? (\n          <Checkbox\n            checked={shownCount > 0 && shownCount === toggleable.length}\n            indeterminate={shownCount > 0 && shownCount < toggleable.length}\n            onChange={(checked) => setAll(checked)}\n          >\n            {locale.columnSettingTitle}\n          </Checkbox>\n        ) : (\n          <span>{locale.columnSettingTitle}</span>\n        )}\n        <Button size=\"small\" type=\"link\" onClick={onReset}>\n          {locale.columnSettingReset}\n        </Button>\n      </div>\n      <div className={styles.settingList}>\n        {(['start', 'none', 'end'] as FixedGroup[]).map((group) =>\n          groups[group].length === 0 ? null : (\n            <div data-group={group} key={group}>\n              {pinnedAny && <div className={styles.settingGroupTitle}>{titles[group]}</div>}\n              {groups[group].map((column) => renderItem(column, group))}\n            </div>\n          ),\n        )}\n      </div>\n    </div>\n  );\n\n  return panel;\n};\n\nexport default ColumnSetting;\n"],"mappings":"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"}

package/es/ProTable/parts/FieldControl.mjs

@@ -0,0 +1,134 @@
+import { useThemeMode } from "../../styles/theme/scope.mjs";
+import Switch from "../../Switch/Switch.mjs";
+import Input_default from "../../Input/Input.mjs";
+import InputNumber_default from "../../Input/InputNumber.mjs";
+import Select from "../../Select/Select.mjs";
+import DayjsDatePicker from "../../DatePicker/DayjsDatePicker.mjs";
+import DayjsDateRangePicker from "../../DatePicker/DayjsDateRangePicker.mjs";
+import { resolveValueEnum, resolveValueType, valueEnumToList } from "../utils.mjs";
+import { styles } from "../style.mjs";
+import { useColumnRequest } from "../hooks/useColumnRequest.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import dayjs from "dayjs";
+//#region src/ProTable/parts/FieldControl.tsx
+const SELECT_TYPES = /* @__PURE__ */ new Set([
+	"select",
+	"radio",
+	"checkbox"
+]);
+const toDayjs = (value) => value ? dayjs(value) : null;
+const toDate = (value) => value?.toDate() ?? null;
+const FieldControl = ({ column, form, light, onChange, placeholder, value }) => {
+	const valueType = resolveValueType(column) ?? "text";
+	const valueEnum = resolveValueEnum(column);
+	const { fieldProps = {} } = column;
+	const size = light ? "small" : void 0;
+	const { isDarkMode } = useThemeMode();
+	const variant = light ? isDarkMode ? "filled" : "outlined" : void 0;
+	const remote = useColumnRequest(column);
+	const lightLabel = light && column.title !== void 0 && column.title !== null && typeof column.title !== "function" ? /* @__PURE__ */ jsx("span", {
+		className: styles.lightFilterLabel,
+		"data-pro-table-light-label": "",
+		children: column.title
+	}) : void 0;
+	const labelProps = lightLabel ? { prefix: lightLabel } : {};
+	if (column.renderFormItem) return column.renderFormItem(column, {
+		form,
+		isQuery: !light,
+		onChange,
+		value
+	}, form);
+	if (remote.enabled || valueEnum || SELECT_TYPES.has(valueType)) {
+		const options = remote.options ?? fieldProps.options ?? valueEnumToList(valueEnum).map((item) => ({
+			disabled: item.disabled,
+			label: item.text,
+			value: item.value
+		}));
+		return /* @__PURE__ */ jsx(Select, {
+			allowClear: true,
+			loading: remote.loading,
+			mode: valueType === "checkbox" ? "multiple" : void 0,
+			options,
+			placeholder: placeholder.select,
+			size,
+			...labelProps,
+			style: { width: "100%" },
+			value: value ?? (valueType === "checkbox" ? [] : null),
+			variant,
+			...fieldProps,
+			onChange: (next) => onChange(next ?? void 0),
+			onSearch: remote.onSearch ? (keyWords) => {
+				remote.onSearch(keyWords);
+				fieldProps.onSearch?.(keyWords);
+			} : fieldProps.onSearch
+		});
+	}
+	switch (valueType) {
+		case "digit":
+		case "money":
+		case "percent":
+		case "progress": return /* @__PURE__ */ jsx(InputNumber_default, {
+			placeholder: placeholder.input,
+			size,
+			...labelProps,
+			style: { width: "100%" },
+			value: value ?? null,
+			variant,
+			...fieldProps,
+			onChange: (next) => onChange(next ?? void 0)
+		});
+		case "switch": {
+			const control = /* @__PURE__ */ jsx(Switch, {
+				checked: !!value,
+				...fieldProps,
+				onChange: (next) => onChange(next)
+			});
+			return lightLabel ? /* @__PURE__ */ jsxs("span", {
+				className: styles.lightFilterSwitch,
+				children: [lightLabel, control]
+			}) : control;
+		}
+		case "date":
+		case "dateTime": return /* @__PURE__ */ jsx(DayjsDatePicker, {
+			allowClear: true,
+			placeholder: placeholder.select,
+			size,
+			...labelProps,
+			style: { width: "100%" },
+			value: toDayjs(value),
+			variant,
+			...fieldProps,
+			onChange: (next) => onChange(toDate(next) ?? void 0)
+		});
+		case "dateRange":
+		case "dateTimeRange": return /* @__PURE__ */ jsx(DayjsDateRangePicker, {
+			allowClear: true,
+			size,
+			...labelProps,
+			style: { width: "100%" },
+			value: value ? [toDayjs(value[0]), toDayjs(value[1])] : null,
+			variant,
+			...fieldProps,
+			onChange: (next) => onChange(next && (next[0] || next[1]) ? [toDate(next[0]), toDate(next[1])] : void 0)
+		});
+		default: return /* @__PURE__ */ jsx(Input_default, {
+			allowClear: true,
+			placeholder: placeholder.input,
+			size,
+			...labelProps,
+			type: valueType === "password" ? "password" : void 0,
+			value: value ?? "",
+			variant,
+			...fieldProps,
+			onChange: (event) => onChange(event.target.value === "" ? void 0 : event.target.value),
+			onClear: () => {
+				onChange(void 0);
+				fieldProps.onClear?.();
+			}
+		});
+	}
+};
+//#endregion
+export { FieldControl as default };
+
+//# sourceMappingURL=FieldControl.mjs.map