@formily-design/formily-antd 1.0.21 → 1.0.22

package/esm/locales/Cascader.d.ts

@@ -7,6 +7,7 @@ export declare const Cascader: {
                     title: string;
                     tooltip: string;
                 };
+                multiple: string;
                 displayRender: {
                     title: string;
                     tooltip: string;
@@ -16,6 +17,18 @@ export declare const Cascader: {
                     tooltip: string;
                 };
             };
+            'value-mapping-group': {
+                title: string;
+                fieldPath: string;
+                mappingPosition: string;
+                currentField: string;
+                siblingFields: string;
+                multipleOnlyCurrent: string;
+                empty: string;
+                incomplete: string;
+                duplicate: string;
+                invalid: string;
+            };
         };
     };
     'en-US': {
@@ -26,6 +39,7 @@ export declare const Cascader: {
                     title: string;
                     tooltip: string;
                 };
+                multiple: string;
                 displayRender: {
                     title: string;
                     tooltip: string;
@@ -35,6 +49,18 @@ export declare const Cascader: {
                     tooltip: string;
                 };
             };
+            'value-mapping-group': {
+                title: string;
+                fieldPath: string;
+                mappingPosition: string;
+                currentField: string;
+                siblingFields: string;
+                multipleOnlyCurrent: string;
+                empty: string;
+                incomplete: string;
+                duplicate: string;
+                invalid: string;
+            };
         };
     };
     'ko-KR': {
@@ -45,6 +71,7 @@ export declare const Cascader: {
                     title: string;
                     tooltip: string;
                 };
+                multiple: string;
                 displayRender: {
                     title: string;
                     tooltip: string;
@@ -54,6 +81,18 @@ export declare const Cascader: {
                     tooltip: string;
                 };
             };
+            'value-mapping-group': {
+                title: string;
+                fieldPath: string;
+                mappingPosition: string;
+                currentField: string;
+                siblingFields: string;
+                multipleOnlyCurrent: string;
+                empty: string;
+                incomplete: string;
+                duplicate: string;
+                invalid: string;
+            };
         };
     };
 };

package/esm/locales/Cascader.js

@@ -7,6 +7,7 @@ export const Cascader = {
                     title: '选择时触发',
                     tooltip: '点选每级菜单选项值都会发生变化',
                 },
+                multiple: '多选',
                 displayRender: {
                     title: '渲染函数',
                     tooltip: '选择后展示的渲染函数，默认为label => label.join("/")	',
@@ -16,6 +17,18 @@ export const Cascader = {
                     tooltip: '默认值：{ label: "label", value: "value", children: "children" }',
                 },
             },
+            'value-mapping-group': {
+                title: '数据映射',
+                fieldPath: '业务字段路径',
+                mappingPosition: '映射位置',
+                currentField: '当前字段',
+                siblingFields: '同级字段',
+                multipleOnlyCurrent: '多选模式仅支持映射到当前字段',
+                empty: '至少配置一个业务字段路径',
+                incomplete: '各级字段路径必须同时填写',
+                duplicate: '各级字段路径不能相同',
+                invalid: '请输入合法的相对字段路径',
+            },
         },
     },
     'en-US': {
@@ -26,6 +39,7 @@ export const Cascader = {
                     title: 'Change On Select',
                     tooltip: 'Click on each level of menu option value will change',
                 },
+                multiple: 'Multiple',
                 displayRender: {
                     title: 'Display Render',
                     tooltip: 'The rendering function displayed after selection, the default is label => label.join("/")	',
@@ -35,6 +49,18 @@ export const Cascader = {
                     tooltip: 'Defaults：{ label: "label", value: "value", children: "children" }',
                 },
             },
+            'value-mapping-group': {
+                title: 'Data Mapping',
+                fieldPath: 'Business field path',
+                mappingPosition: 'Mapping position',
+                currentField: 'Current field',
+                siblingFields: 'Sibling fields',
+                multipleOnlyCurrent: 'Multiple mode only supports mapping to the current field',
+                empty: 'Configure at least one business field path',
+                incomplete: 'All field paths are required',
+                duplicate: 'Field paths must be different',
+                invalid: 'Enter a valid relative field path',
+            },
         },
     },
     'ko-KR': {
@@ -45,6 +71,7 @@ export const Cascader = {
                     title: '선택 시 변경',
                     tooltip: '메뉴 옵션 값의 레벨을 클릭하면 변경됩니다.',
                 },
+                multiple: '다중 선택',
                 displayRender: {
                     title: '디스플레이 렌더링',
                     tooltip: '선택 후 실행되는 렌더링 함수로 기본 값은 label => label.join("/")	',
@@ -54,6 +81,18 @@ export const Cascader = {
                     tooltip: '기본 값：{ label: "label", value: "value", children: "children" }',
                 },
             },
+            'value-mapping-group': {
+                title: '데이터 매핑',
+                fieldPath: '업무 필드 경로',
+                mappingPosition: '매핑 위치',
+                currentField: '현재 필드',
+                siblingFields: '동급 필드',
+                multipleOnlyCurrent: '다중 선택 모드에서는 현재 필드 매핑만 지원됩니다',
+                empty: '하나 이상의 업무 필드 경로를 입력하세요',
+                incomplete: '모든 필드 경로를 입력하세요',
+                duplicate: '필드 경로는 달라야 합니다',
+                invalid: '올바른 상대 필드 경로를 입력하세요',
+            },
         },
     },
 };

package/esm/locales/DatePicker.js

@@ -79,8 +79,8 @@ export const DateRangePicker = createLocales(DatePicker, {
         settings: {
             'value-mapping-group': {
                 title: '数据映射',
-                startPath: '开始日期字段路径',
-                endPath: '结束日期字段路径',
+                startPath: '开始字段路径',
+                endPath: '结束字段路径',
                 incomplete: '开始和结束字段路径必须同时填写',
                 duplicate: '开始和结束字段路径不能相同',
                 invalid: '请输入合法的相对字段路径',
@@ -92,8 +92,8 @@ export const DateRangePicker = createLocales(DatePicker, {
         settings: {
             'value-mapping-group': {
                 title: 'Data Mapping',
-                startPath: 'Start date field path',
-                endPath: 'End date field path',
+                startPath: 'Start field path',
+                endPath: 'End field path',
                 incomplete: 'Both start and end field paths are required',
                 duplicate: 'Start and end field paths must be different',
                 invalid: 'Enter a valid relative field path',
@@ -105,8 +105,8 @@ export const DateRangePicker = createLocales(DatePicker, {
         settings: {
             'value-mapping-group': {
                 title: '데이터 매핑',
-                startPath: '시작 날짜 필드 경로',
-                endPath: '종료 날짜 필드 경로',
+                startPath: '시작 필드 경로',
+                endPath: '종료 필드 경로',
                 incomplete: '시작 및 종료 필드 경로를 모두 입력하세요',
                 duplicate: '시작 및 종료 필드 경로는 달라야 합니다',
                 invalid: '올바른 상대 필드 경로를 입력하세요',

package/esm/schemas/Cascader.js

@@ -14,6 +14,11 @@ export const Cascader = {
             'x-decorator': 'FormItem',
             'x-component': 'Switch',
         },
+        multiple: {
+            type: 'boolean',
+            'x-decorator': 'FormItem',
+            'x-component': 'Switch',
+        },
         autoFocus: {
             type: 'boolean',
             'x-decorator': 'FormItem',

package/lib/components/Cascader/preview.js

@@ -3,25 +3,104 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Cascader = void 0;
 const antd_v5_1 = require("@formily/antd-v5");
 const core_1 = require("@formily-design/core");
-const Field_1 = require("../Field");
+const shared_1 = require("../Field/shared");
+const valueMapping_1 = require("../Field/valueMapping");
 const schemas_1 = require("../../schemas");
 const locales_1 = require("../../locales");
+// 这些路径同时被 value-mapping 公共 reaction 和映射位置设置项读取，避免组件配置各自维护协议路径。
+const valueMappingFieldsPath = `${core_1.VALUE_MAPPING_SCHEMA_KEY}.target.fields`;
+const valueMappingTargetTypePath = `${core_1.VALUE_MAPPING_SCHEMA_KEY}.target.type`;
+const multiplePath = 'x-component-props.multiple';
+/**
+ * Cascader 复用 tuple adapter；字段数量由动态 ArrayItems 管理，target 则根据 multiple
+ * 和映射位置设置在运行时解析，从而让公共 value-mapping helper 不依赖 Cascader 属性。
+ */
+const ValueMappingGroup = (0, valueMapping_1.createValueMappingGroup)({
+    adapter: 'tuple',
+    fields: {
+        type: 'dynamic',
+        path: valueMappingFieldsPath,
+        token: 'fieldPath',
+    },
+    cardinality: { path: multiplePath },
+    target: {
+        resolve: ({ form, cardinality }) => {
+            // 多选业务值必须是对象数组，因此强制使用当前字段 object/source。
+            if (cardinality === core_1.VALUE_MAPPING_CARDINALITY_MULTIPLE) {
+                return {
+                    type: core_1.VALUE_MAPPING_TARGET_OBJECT,
+                    scope: core_1.VALUE_MAPPING_SCOPE_SOURCE,
+                };
+            }
+            // 单选允许在当前字段对象和同级字段之间切换，默认沿用当前字段。
+            return form.getValuesIn(valueMappingTargetTypePath) ===
+                core_1.VALUE_MAPPING_TARGET_FIELDS
+                ? {
+                    type: core_1.VALUE_MAPPING_TARGET_FIELDS,
+                    scope: core_1.VALUE_MAPPING_SCOPE_RELATIVE,
+                    includeSource: false,
+                }
+                : {
+                    type: core_1.VALUE_MAPPING_TARGET_OBJECT,
+                    scope: core_1.VALUE_MAPPING_SCOPE_SOURCE,
+                };
+        },
+    },
+    settingsProperties: {
+        // 映射位置是组件专属的设置 UI，最终只影响 target.type；scope/includeSource 由 resolver 固定。
+        [valueMappingTargetTypePath]: {
+            type: 'string',
+            title: '{{$node.getMessage("settings.value-mapping-group.mappingPosition")}}',
+            enum: [
+                {
+                    value: core_1.VALUE_MAPPING_TARGET_OBJECT,
+                    label: '{{$node.getMessage("settings.value-mapping-group.currentField")}}',
+                },
+                {
+                    value: core_1.VALUE_MAPPING_TARGET_FIELDS,
+                    label: '{{$node.getMessage("settings.value-mapping-group.siblingFields")}}',
+                },
+            ],
+            'x-decorator': 'FormItem',
+            'x-decorator-props': {
+                tooltip: '{{$node.getMessage("settings.value-mapping-group.multipleOnlyCurrent")}}',
+            },
+            'x-component': 'Radio.Group',
+            'x-component-props': {
+                optionType: 'button',
+                defaultValue: core_1.VALUE_MAPPING_TARGET_OBJECT,
+            },
+            'x-reactions': (field) => {
+                const fields = field.form.getValuesIn(valueMappingFieldsPath);
+                const multiple = field.form.getValuesIn(multiplePath);
+                // 没有字段行时不显示位置选项；multiple 开启后位置只能是当前字段。
+                field.visible = Array.isArray(fields) && fields.length > 0;
+                field.disabled = multiple === true;
+            },
+        },
+    },
+});
 exports.Cascader = antd_v5_1.Cascader;
+// 将 Cascader 注册为可选中的设计器行为，并挂载专属属性面板配置。
 exports.Cascader.Behavior = (0, core_1.createBehavior)({
     name: 'Cascader',
     extends: ['Field'],
     selector: (node) => node.props['x-component'] === 'Cascader',
     designerProps: {
-        propsSchema: (0, Field_1.createFieldSchema)(schemas_1.AllSchemas.Cascader),
+        propsSchema: (0, shared_1.createFieldSchema)(schemas_1.AllSchemas.Cascader, undefined, {
+            'value-mapping-group': ValueMappingGroup,
+        }),
     },
     designerLocales: locales_1.AllLocales.Cascader,
 });
+// 将 Cascader 注册到资源面板，拖入画布时生成默认 Field Schema。
 exports.Cascader.Resource = (0, core_1.createResource)({
     icon: 'CascaderSource',
     elements: [
         {
             componentName: 'Field',
             props: {
+                type: 'array',
                 title: 'Cascader',
                 'x-decorator': 'FormItem',
                 'x-component': 'Cascader',

package/lib/components/DatePicker/preview.js

@@ -3,47 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DatePicker = void 0;
 const antd_v5_1 = require("@formily/antd-v5");
 const core_1 = require("@formily-design/core");
-const core_2 = require("@formily-design/core");
 const shared_1 = require("../Field/shared");
 const valueMapping_1 = require("../Field/valueMapping");
 const schemas_1 = require("../../schemas");
 const locales_1 = require("../../locales");
-const valueMappingTargetPaths = [
-    `${core_2.VALUE_MAPPING_SCHEMA_KEY}.targets.0.path`,
-    `${core_2.VALUE_MAPPING_SCHEMA_KEY}.targets.1.path`,
-];
-const createMappingPathSchema = (titleToken) => ({
-    type: 'string',
-    title: `{{$node.getMessage("settings.value-mapping-group.${titleToken}")}}`,
-    'x-decorator': 'FormItem',
-    'x-decorator-props': {
-        // SettingsForm 默认不展示 feedback；映射路径需要即时呈现输入校验结果。
-        feedbackLayout: 'loose',
+const ValueMappingGroup = (0, valueMapping_1.createValueMappingGroup)({
+    adapter: 'tuple',
+    fields: {
+        type: 'fixed',
+        paths: [
+            'x-value-mapping.target.fields.0.path',
+            'x-value-mapping.target.fields.1.path',
+        ],
+        tokens: ['startPath', 'endPath'],
     },
-    'x-component': 'Input',
-    'x-component-props': {
-        allowClear: true,
+    cardinality: 'single',
+    target: {
+        type: 'fields',
+        scope: 'relative',
+        includeSource: false,
     },
 });
-const ValueMappingGroup = {
-    type: 'void',
-    'x-component': 'CollapseItem',
-    'x-component-props': { defaultExpand: false },
-    // 分组只挂一个 reaction，避免协议同步与反馈校验的两个 autorun 产生竞态。
-    'x-reactions': [
-        (0, valueMapping_1.createValueMappingSettingsReaction)({
-            adapter: 'tuple',
-            targetPaths: valueMappingTargetPaths,
-            scope: 'relative',
-            submitSource: false,
-            getMessage: (error, scope) => { var _a; return (_a = scope.$node) === null || _a === void 0 ? void 0 : _a.getMessage(`settings.value-mapping-group.${error}`); },
-        }),
-    ],
-    properties: {
-        [valueMappingTargetPaths[0]]: createMappingPathSchema('startPath'),
-        [valueMappingTargetPaths[1]]: createMappingPathSchema('endPath'),
-    },
-};
 exports.DatePicker = antd_v5_1.DatePicker;
 exports.DatePicker.Behavior = (0, core_1.createBehavior)({
     name: 'DatePicker',

package/lib/components/Field/valueMapping.d.ts

@@ -1,45 +1,78 @@
-import type { IScopeContext, SchemaReaction } from '@formily/json-schema';
-import { VALUE_MAPPING_RELATIVE_SCOPE } from '@formily-design/core';
-import type { ValueMappingTargetValidationError } from '@formily-design/core';
+import type { ISchema, IScopeContext, SchemaReaction } from '@formily/json-schema';
+import type { Form } from '@formily/core';
+import { VALUE_MAPPING_TARGET_FIELDS, VALUE_MAPPING_TARGET_OBJECT, VALUE_MAPPING_SCOPE_RELATIVE, VALUE_MAPPING_SCOPE_SOURCE } from '@formily-design/core';
+import type { ValueMappingCardinality, ValueMappingTargetValidationError } from '@formily-design/core';
 export type { ValueMappingTargetValidationError } from '@formily-design/core';
+/** 固定字段由组件属性直接提供；动态字段由设置器中的 ArrayItems 提供。 */
+export type ValueMappingSettingsFieldSource = {
+    type: 'fixed';
+    paths: string[];
+    tokens: string[];
+} | {
+    type: 'dynamic';
+    path: string;
+    token: string;
+};
+export type ValueMappingSettingsCardinality = 
+/** 固定 cardinality 适合 RangePicker 等属性已知的组件。 */
+ValueMappingCardinality
+/** 动态 cardinality 从组件属性路径读取，供 Cascader.multiple 等属性联动。 */
+ | {
+    path: string;
+};
+/** 设置器侧只描述 target 的选择项，具体 fields 由 reaction 在运行时补全。 */
+export type ValueMappingSettingsTarget = {
+    type: typeof VALUE_MAPPING_TARGET_FIELDS;
+    scope: typeof VALUE_MAPPING_SCOPE_RELATIVE;
+    includeSource: boolean;
+} | {
+    type: typeof VALUE_MAPPING_TARGET_OBJECT;
+    scope: typeof VALUE_MAPPING_SCOPE_SOURCE;
+};
+/** 根据当前设置表单状态解析 target，使公共 helper 不需要识别具体组件。 */
+export type ValueMappingSettingsTargetResolver = {
+    resolve(context: {
+        form: Form;
+        cardinality: ValueMappingCardinality;
+    }): ValueMappingSettingsTarget;
+};
+export type ValueMappingSettingsTargetSource = ValueMappingSettingsTarget | ValueMappingSettingsTargetResolver;
 export interface ICreateValueMappingSettingsReactionOptions {
-    /**
-     * 映射运行时使用的 adapter 名称，例如 tuple。
-     */
+    /** adapter 名称写入协议，转换实现由 designer runtime 注册。 */
     adapter: string;
-    /**
-     * 设置表单中 target path 输入框的完整数据路径。
-     *
-     * 注意：这里配置的是输入框在设置表单中的路径，而不是用户最终填写的
-     * startDate、address.provinceCode 等业务字段路径。
-     */
-    targetPaths: string[];
-    scope?: typeof VALUE_MAPPING_RELATIVE_SCOPE;
-    submitSource?: boolean;
-    /**
-     * 根据校验错误码返回当前语言的提示文案。scope 会透传 Formily
-     * reaction 的作用域，因此设置器可以使用 `$node.getMessage` 读取节点语言。
-     */
+    /** 映射字段的来源及设置器字段路径。 */
+    fields: ValueMappingSettingsFieldSource;
+    /** 固定值或组件属性驱动的 cardinality。 */
+    cardinality: ValueMappingSettingsCardinality;
+    /** 静态 target 或依赖 form/cardinality 的 target resolver。 */
+    target: ValueMappingSettingsTargetSource;
+    /** 将协议校验错误转换为当前语言的设置器文案。 */
     getMessage: (error: ValueMappingTargetValidationError, scope: IScopeContext) => string | undefined;
 }
+export interface IValueMappingGroupOptions extends Omit<ICreateValueMappingSettingsReactionOptions, 'getMessage'> {
+    /** value-mapping 分组使用的 locale 命名空间。 */
+    localeKey?: string;
+    /** 由具体组件追加的配置项，例如 Cascader 的映射位置单选框。 */
+    settingsProperties?: Record<string, ISchema>;
+}
+export declare const validateValueMappingTargetPaths: (paths: unknown[], allowEmpty?: boolean) => ValueMappingTargetValidationError | undefined;
 /**
- * 校验一组手动输入的映射 target 路径。
- *
- * 空数组表示尚未启用映射；一旦任意路径有值，所有 target 都必须填写、合法且唯一。
- * 该方法与具体组件数量无关，日期范围、省市区等配置界面均可复用。
+ * 创建统一处理协议同步、动态字段和校验反馈的设置 reaction。
+ * reaction 先读取设置状态，再决定删除协议、反馈错误或写入 canonical v1 协议。
  */
-export declare const validateValueMappingTargetPaths: (paths: unknown[]) => ValueMappingTargetValidationError | undefined;
+export declare const createValueMappingSettingsReaction: ({ adapter, fields, cardinality, target, getMessage, }: ICreateValueMappingSettingsReactionOptions) => SchemaReaction;
 /**
- * 创建设置表单使用的 value-mapping 协议与校验 reaction。
- *
- * 协议和反馈必须由一个 autorun 编排。若分别挂两个 x-reactions，它们对同一
- * 次 onInput 的调度顺序不稳定：协议 reaction 规范化数字路径时会再次写值，
- * 校验 reaction 可能拿到中间快照，导致残留错误或覆盖刚写入的配置。本 reaction
- * 先读取一次 targetValues，再同步反馈和协议，保证二者始终对应同一组输入。
- *
- * target 全空时先同步清除反馈，让界面立即恢复；父级协议延迟到当前 onInput/batch
- * 结束后的 Promise 微任务再删除。微任务执行前会重新读取最新 target：若用户已快速
- * 重新输入则跳过删除，避免旧 cleanup 误删。按 Form 隔离的 WeakSet 会合并同一 Form
- * 的重复 cleanup，同时不会影响其它设置 Form。
+ * 创建组件属性面板中的新 v1 value-mapping 分组。
+ * 具体组件可通过 settingsProperties 注入额外设置，但协议同步仍由公共 reaction 负责。
  */
-export declare const createValueMappingSettingsReaction: ({ adapter, targetPaths, scope, submitSource, getMessage, }: ICreateValueMappingSettingsReactionOptions) => SchemaReaction;
+export declare const createValueMappingGroup: ({ localeKey, settingsProperties, ...options }: IValueMappingGroupOptions) => {
+    type: string;
+    'x-component': string;
+    'x-component-props': {
+        defaultExpand: boolean;
+    };
+    'x-reactions': SchemaReaction[];
+    properties: {
+        [x: string]: any;
+    };
+};