import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types'; const OadpFormItemMeta: IPublicTypeComponentMetadata = { "componentName": "OadpFormItem", "title": "表单项", "category": "高级组件", "group": "低代码组件", "docUrl": "", "screenshot": "https://img.alicdn.com/tfs/TB1YOd2u2b2gK0jSZK9XXaEgFXa-112-64.png", "devMode": "proCode", "npm": { "package": "oadp-material", "version": "{{version}}", "exportName": "OadpFormItem", "main": "src/index.tsx", "destructuring": true, "subName": "" }, "configure": { "props": [ { "name": "DataSetting", "title": "数据设置", "type": "group", "display": "block", "items": [ { "name": "label", "title": { "label": { "type": "i18n", "zh_CN": "标题", "en_US": "Label", }, "tip": { "type": "i18n", "zh_CN": "属性: label | 说明: 标题", "en_US": "prop: label | description: label content", }, }, "description": "标题", "setter": "StringSetter", }, { "name": "name", "title": { "label": { "type": "i18n", "zh_CN": "字段名称", "en_US": "name", }, "tip": { "type": "i18n", "zh_CN": "属性: name | 说明: 字段名称，默认赋值给第一个子元素", "en_US": "prop: name | description: name", }, }, "description": "字段名称", "setter": "StringSetter", }, { "name": "valueName", "title": { "label": { "type": "i18n", "zh_CN": "子元素值名称", "en_US": "valueName", }, "tip": { "type": "i18n", "zh_CN": "属性: valueName | 说明: 子元素值名称", "en_US": "prop: valueName | description: value Name", }, }, "description": "子元素值名称", "setter": "StringSetter", }, { "name": "help", "title": { "label": { "type": "i18n", "zh_CN": "提示信息", "en_US": "help", }, "tip": { "type": "i18n", "zh_CN": "属性: help | 说明: 提示信息，如不设置，则会根据校验规则自动生成.", "en_US": "prop: help | description: help", }, }, "description": "提示信息", "setter": { "componentName": "SlotSetter", "props": { "mode": "node" }, "isRequired": false, "initialValue": { "type": "JSSlot", "value": [] } }, }, { "name": "extra", "title": { "label": { "type": "i18n", "zh_CN": "额外提示", "en_US": "extra", }, "tip": { "type": "i18n", "zh_CN": "属性: extra | 说明: 额外提示，当需要错误信息和提示文案同时出现时，可以使用这个。 位于错误信息后面.", "en_US": "prop: extra | description: extra", }, }, "description": "额外提示", "setter": { "componentName": "SlotSetter", "props": { "mode": "node" }, "isRequired": false, "initialValue": { "type": "JSSlot", "value": [] } } }, ] }, { "name": "DisplaySetting", "title": "显示设置", "type": "group", "display": "block", "items": [ { "name": "size", "title": { "label": { "type": "i18n", "en-US": "Size", "zh-CN": "尺寸模式" }, "tip": { "type": "i18n", "zh_CN": "属性: size | 说明: 尺寸模式，可选值:small=紧凑模式, medium=普通模式, large=放大模式。默认为:medium。", "en_US": "prop: size | description: Size mode, optional values: small=compact mode, medium=normal mode, large=large mode. The default is: medium.", }, }, "description": "属性: size | 说明: 尺寸模式，可选值:small=紧凑模式, medium=普通模式, large=放大模式。默认为:medium。", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "普通模式", "value": "medium" }, { "label": "紧凑模式", "value": "small" }, { "label": "放大模式", "value": "large" } ], "options": [ { "label": "普通模式", "value": "medium" }, { "label": "紧凑模式", "value": "small" }, { "label": "放大模式", "value": "large" } ] }, "initialValue": "medium" } }, // { // "name": "labelAlign", // "title": { // "label": { // "type": "i18n", // "en-US": "labelAlign", // "zh-CN": "标签位置" // }, // "tip": { // "type": "i18n", // "zh_CN": "属性: labelAlign | 说明: 标签位置 | 可选值:top=顶部, left=居左, inset=内部。| 默认值: top", // "en_US": "prop: labelAlign | description: labelAlign | options: top=top, left=left, inset=left | default: top", // }, // }, // "description": "标签位置", // "setter": { // "componentName": "RadioGroupSetter", // "props": { // "dataSource": [ // { // "label": "顶部", // "value": "top" // }, // { // "label": "居左", // "value": "left" // }, // { // "label": "内部", // "value": "inset" // } // ], // "options": [ // { // "label": "顶部", // "value": "top" // }, // { // "label": "居左", // "value": "left" // }, // { // "label": "内部", // "value": "inset" // } // ] // }, // "initialValue": "top" // } // }, { "name": "labelTextAlign", "title": { "label": { "type": "i18n", "en-US": "labelTextAlign", "zh-CN": "标签对齐" }, "tip": { "type": "i18n", "zh_CN": "属性: labelTextAlign | 说明: 标签对齐 | 可选值: left=居左对齐, right=居右对齐。| 默认值: left", "en_US": "prop: labelTextAlign | description: labelTextAlign | options: left=left, right=right | default: top", }, }, "description": "标签对齐", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "居左对齐", "value": "left" }, { "label": "居右对齐", "value": "right" } ], "options": [ { "label": "居左对齐", "value": "left" }, { "label": "居右对齐", "value": "right" } ] }, "initialValue": "left" } }, { "name": "colSpan", "title": { "label": { "type": "i18n", "en-US": "colSpan", "zh-CN": "表单项占列" }, "tip": { "type": "i18n", "zh_CN": "属性: colSpan | 说明: 在响应式布局模式下，表单项占多少列", "en_US": "prop: colSpan | description: colSpan.", }, }, "description": "在响应式布局模式下，表单项占多少列", "setter": "NumberSetter", }, { "name": "labelWidth", "title": { "label": { "type": "i18n", "en-US": "labelWidth", "zh-CN": "标题占列" }, "tip":{ "type": "i18n", "zh_CN": "属性: labelWidth | 说明: 在响应式布局模式下，标题占多少列", "en_US": "prop: labelWidth | description: labelWidth.", }, }, "description": "在响应式布局模式下，标题占多少列", "setter": "NumberSetter", }, { "name": "validateState", "title": { "label": { "type": "i18n", "en-US": "Validate State", "zh-CN": "校验状态" }, "tip": { "type": "i18n", "zh_CN": "属性: validateState | 说明: 校验状态，可选值:success=成功, error=失败, loading=校验中,warning=警告。默认为:success", "en_US": "prop: validateState | description: Validate State, optional values: success=success mode, error=error mode, loading=loading mode, warning=warning mode. The default is: success.", }, }, "description": "属性: validateState | 说明: 校验状态，可选值:success=成功, error=失败, loading=校验中,warning=警告。默认为:success", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "成功", "value": "success" }, { "label": "失败", "value": "error" }, { "label": "检验中", "value": "loading" }, { "label": "警告", "value": "warning" } ], "options": [ { "label": "成功", "value": "success" }, { "label": "失败", "value": "error" }, { "label": "检验中", "value": "loading" }, { "label": "警告", "value": "warning" } ] }, "initialValue": "success" } }, { "name": "hasFeedback", "title": { "label": { "type": "i18n", "en-US": "hasFeedback", "zh-CN": "开启反馈" }, "tip": { "type": "i18n", "zh_CN": "属性: hasFeedback | 说明: 开启反馈 | 类型: boolean | 默认值: false", "en_US": "prop: hasFeedback | description: hasFeedback | type: boolean | default: false", }, }, "description": "开启反馈", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "fullWidth", "title": { "label": { "type": "i18n", "en-US": "fullWidth", "zh-CN": "宽度占满" }, "tip": { "type": "i18n", "zh_CN": "属性: fullWidth | 说明: 表单项宽度占满 | 类型: boolean | 默认值: false", "en_US": "prop: fullWidth | description: fullWidth | type: boolean | default: false", }, }, "description": "宽度占满", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "responsive", "title": { "label": { "type": "i18n", "en-US": "responsive", "zh-CN": "响应式布局" }, "tip": { "type": "i18n", "zh_CN": "属性: responsive | 说明: 开启响应式布局 | 类型: boolean | 默认值: true", "en_US": "prop: responsive | description: responsive | type: boolean | default: true", }, }, "description": "响应式布局", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "isPreview", "title": { "label": { "type": "i18n", "en-US": "isPreview", "zh-CN": "开启预览态" }, "tip": { "type": "i18n", "zh_CN": "属性: isPreview | 说明: 开启预览态 | 类型: boolean | 默认值: false", "en_US": "prop: isPreview | description: isPreview | type: boolean | default: false", }, }, "description": "响应式布局", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "useLabelForErrorMessage", "title": { "label": { "type": "i18n", "en-US": "useLabelForErrorMessage", "zh-CN": "校验信息" }, "tip": { "type": "i18n", "zh_CN": "属性: useLabelForErrorMessage | 说明: 启用label替换校验信息name字段 | 类型: boolean | 默认值: true", "en_US": "prop: useLabelForErrorMessage | description: use Label For Error Message | type: boolean | default: true", }, }, "description": "启用label替换校验信息name字段", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "preferMarginToDisplayHelp", "title": { "label": { "type": "i18n", "en-US": "preferMarginToDisplayHelp", "zh-CN": "帮助信息" }, "tip": { "type": "i18n", "zh_CN": "属性: preferMarginToDisplayHelp | 说明: 启用item的margin空间来展示help | 类型: boolean | 默认值: false", "en_US": "prop: preferMarginToDisplayHelp | description: prefer Margin To Display Help | type: boolean | default: false", }, }, "description": "启用item的margin空间来展示help", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "colon", "title": { "label": { "type": "i18n", "en-US": "colon", "zh-CN": "标签冒号" }, "tip": { "type": "i18n", "zh_CN": "属性: colon | 说明: 显示标签冒号 | 类型: boolean | 默认值: false", "en_US": "prop: colon | description: Show Label Colon | type: boolean | default: false", }, }, "description": "标签冒号", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "disabled", "title": { "label": { "type": "i18n", "en-US": "disabled", "zh-CN": "禁用表单" }, "tip": { "type": "i18n", "zh_CN": "属性: disabled | 说明: 禁用表单 | 类型: boolean | 默认值: false", "en_US": "prop: disabled | description: disabled | type: boolean | default: false", }, }, "description": "禁用表单", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, ], }, { "name": "ValidateSetting", "title": "校验设置", "type": "group", "display": "block", "items": [ { "name": "required", "title": { "label": { "type": "i18n", "en-US": "required", "zh-CN": "必填" }, "tip": { "type": "i18n", "zh_CN": "属性: required | 说明: 必填", "en_US": "prop: required | description: required", }, }, "description": "必填", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "asterisk", "title": { "label": { "type": "i18n", "en-US": "asterisk", "zh-CN": "必填星号" }, "tip": { "type": "i18n", "zh_CN": "属性: asterisk | 说明: 必填星号", "en_US": "prop: asterisk | description: asterisk", }, }, "description": "必填星号", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, { "name": "requiredMessage", "title": { "label": { "type": "i18n", "zh_CN": "必填提示", "en_US": "requiredMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: requiredMessage | 说明: 标题", "en_US": "prop: requiredMessage | description: Required Message", }, }, "description": "必填校验提示", "setter": "StringSetter", }, { "name": "requiredTrigger", "title": { "label": { "type": "i18n", "zh_CN": "必填校验触发时机", "en_US": "requiredTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: requiredTrigger | 说明: 必填校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: requiredTrigger | description: requiredTrigger", }, }, "description": "必填校验触发时机", "setter": "StringSetter", }, { "name": "min", "title": { "label": { "type": "i18n", "en-US": "min", "zh-CN": "范围最小值," }, "tip": { "type": "i18n", "zh_CN": "属性: min | 说明: 范围最小值", "en_US": "prop: min | description: min.", }, }, "description": "范围最小值", "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 0 } }, { "name": "max", "title": { "label": { "type": "i18n", "en-US": "max", "zh-CN": "范围最大值," }, "tip": { "type": "i18n", "zh_CN": "属性: max | 说明: 范围最大值", "en_US": "prop: max | description: max.", }, }, "description": "范围最大值", "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 10 } }, { "name": "minmaxMessage", "title": { "label": { "type": "i18n", "zh_CN": "范围校验提示", "en_US": "minmaxMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: minmaxMessage | 说明: 范围校验提示", "en_US": "prop: minmaxMessage | description: minmaxMessage", }, }, "description": "范围校验提示", "setter": "StringSetter", }, { "name": "minmaxTrigger", "title": { "label": { "type": "i18n", "zh_CN": "范围校验触发时机", "en_US": "minmaxTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: minmaxTrigger | 说明: 范围校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: minmaxTrigger | description: minmaxTrigger", }, }, "description": "范围校验触发时机", "setter": "StringSetter", }, { "name": "minLength", "title": { "label": { "type": "i18n", "en-US": "minLength", "zh-CN": "长度最小值," }, "tip": { "type": "i18n", "zh_CN": "属性: minLength | 说明: 长度最小值", "en_US": "prop: minLength | description: minLength.", }, }, "description": "长度最小值", "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 0 } }, { "name": "maxLength", "title": { "label": { "type": "i18n", "en-US": "maxLength", "zh-CN": "长度最大值," }, "tip": { "type": "i18n", "zh_CN": "属性: maxLength | 说明: 长度最大值", "en_US": "prop: maxLength | description: maxLength.", }, }, "description": "长度最大值", "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 10 } }, { "name": "minmaxLengthMessage", "title": { "label": { "type": "i18n", "zh_CN": "长度校验提示", "en_US": "minmaxLengthMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: minmaxLengthMessage | 说明: 长度校验提示", "en_US": "prop: minmaxLengthMessage | description: minmaxLengthMessage", }, }, "description": "长度校验提示", "setter": "StringSetter", }, { "name": "minmaxLengthTrigger", "title": { "label": { "type": "i18n", "zh_CN": "长度校验触发时机", "en_US": "minmaxLengthTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: minmaxLengthTrigger | 说明: 长度校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: minmaxLengthTrigger | description: minmaxLengthTrigger", }, }, "description": "长度校验触发时机", "setter": "StringSetter", }, { "name": "length", "title": { "label": { "type": "i18n", "en-US": "length", "zh-CN": "长度精确值," }, "tip": { "type": "i18n", "zh_CN": "属性: length | 说明: 长度精确值", "en_US": "prop: length | description: length.", }, }, "description": "长度精确值", "setter": { "componentName": "NumberSetter", "isRequired": false, "initialValue": 0 } }, { "name": "lengthMessage", "title": { "label": { "type": "i18n", "zh_CN": "长度精确校验提示", "en_US": "lengthMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: lengthMessage | 说明: 长度精确校验提示", "en_US": "prop: lengthMessage | description: lengthMessage", }, }, "description": "长度精确校验提示", "setter": "StringSetter", }, { "name": "lengthTrigger", "title": { "label": { "type": "i18n", "zh_CN": "长度精确校验触发时机", "en_US": "lengthTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: lengthTrigger | 说明: 长度精确校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: lengthTrigger | description: lengthTrigger", }, }, "description": "长度精确校验触发时机", "setter": "StringSetter", }, { "name": "pattern", "title": { "label": { "type": "i18n", "en-US": "pattern", "zh-CN": "正则校验," }, "tip": { "type": "i18n", "zh_CN": "属性: pattern | 说明: 正则校验", "en_US": "prop: pattern | description: pattern.", }, }, "description": "正则校验", "setter": "StringSetter" }, { "name": "patternMessage", "title": { "label": { "type": "i18n", "zh_CN": "正则校验提示", "en_US": "patternMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: patternMessage | 说明: 正则校验提示", "en_US": "prop: patternMessage | description: patternMessage", }, }, "description": "正则校验提示", "setter": "StringSetter", }, { "name": "patternTrigger", "title": { "label": { "type": "i18n", "zh_CN": "正则校验触发时机", "en_US": "patternTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: patternTrigger | 说明: 正则校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: patternTrigger | description: patternTrigger", }, }, "description": "正则校验触发时机", "setter": "StringSetter", }, { "name": "format", "title": { "label": { "type": "i18n", "en-US": "format", "zh-CN": "格式校验," }, "tip": { "type": "i18n", "zh_CN": "属性: format | 说明: 格式校验｜可选值:number=数值, email=邮箱, url=网址, tel=电话", "en_US": "prop: format | description: format.", }, }, "description": "格式校验｜可选值:number=数值, email=邮箱, url=网址, tel=电话", "setter": { "componentName": "RadioGroupSetter", "props": { "dataSource": [ { "label": "数值", "value": "number" }, { "label": "邮箱", "value": "email" }, { "label": "网址", "value": "url" }, { "label": "电话", "value": "tel" } ], "options": [ { "label": "数值", "value": "number" }, { "label": "邮箱", "value": "email" }, { "label": "网址", "value": "url" }, { "label": "电话", "value": "tel" } ] }, // "initialValue": "number" } }, { "name": "formatMessage", "title": { "label": { "type": "i18n", "zh_CN": "格式校验提示", "en_US": "formatMessage", }, "tip": { "type": "i18n", "zh_CN": "属性: formatMessage | 说明: 格式校验提示", "en_US": "prop: formatMessage | description: formatMessage", }, }, "description": "格式校验提示", "setter": "StringSetter", }, { "name": "formatTrigger", "title": { "label": { "type": "i18n", "zh_CN": "格式校验触发时机", "en_US": "formatTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: formatTrigger | 说明: 格式校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: formatTrigger | description: formatTrigger", }, }, "description": "格式校验触发时机", "setter": "StringSetter", }, { "name": "validator", "title": { "label": { "type": "i18n", "en-US": "validator", "zh-CN": "校验函数" }, "tip": { "type": "i18n", "zh_CN": "属性: validator | 说明: 校验函数", "en_US": "prop: validator | description: validator.", }, }, "description": "校验函数", "setter": { "componentName": "FunctionSetter" } }, { "name": "validatorTrigger", "title": { "label": { "type": "i18n", "zh_CN": "函数校验触发时机", "en_US": "validatorTrigger", }, "tip": { "type": "i18n", "zh_CN": "属性: validatorTrigger | 说明: 函数校验触发时机，默认值 onChange, 原生事件均可使用 onChange/onBlur/onFocus/...", "en_US": "prop: validatorTrigger | description: validatorTrigger", }, }, "description": "函数校验触发时机", "setter": "StringSetter", }, { "name": "autoValidate", "title": { "label": { "type": "i18n", "en-US": "autoValidate", "zh-CN": "值改变触发校验" }, "tip": { "type": "i18n", "zh_CN": "属性: autoValidate | 说明: 值改变触发校验 | 类型: boolean | 默认值: true", "en_US": "prop: autoValidate | description: autoValidate | type: boolean | default: true", }, }, "description": "值改变触发校验", "setter": { "componentName": "BoolSetter", "isRequired": false, "initialValue": false } }, ] }, ], "supports": { "style": true }, "component": { "isContainer": true }, "advanced": { // "callbacks": { // "onNodeAdd": (dragment, currentNode) => { // console.log('onNodeAdd', dragment, currentNode); // // const comps = [ // // 'Input', // // 'Select', // // 'Radio', // // 'Checkbox', // // 'Switch', // // 'Upload', // // 'Datepicker', // // 'Rate', // // 'Transfer', // // ]; // // if ( // // !dragment || // // !dragment.componentMeta || // // !dragment.componentMeta.npm || // // !dragment.componentMeta.npm.package || // // dragment.componentMeta.npm.package.indexOf('@alilc/antd-lowcode-materials') === -1 || // // comps.every((comp) => dragment.componentName.indexOf(comp) === -1) // // ) { // // return; // // } // // // 为目标元素包裹一层P // // const layoutPNode = currentNode.document.createNode({ // // componentName: 'Form.Item', // // props: { // // label: '表单项: ', // // }, // // children: [dragment.exportSchema()], // // }); // // // 当前dragment还未添加入node子节点,需要setTimeout处理 // // setTimeout(() => { // // currentNode.replaceChild( // // dragment, // // layoutPNode.exportSchema(), // // // 避免生成新的 nodeId // // { reserveSchemaNodeId: true }, // // ); // // }, 1); // }, // }, }, } }; const snippets: IPublicTypeSnippet[] = [ { "title": "表单项", "screenshot": "https://img.alicdn.com/tfs/TB1YOd2u2b2gK0jSZK9XXaEgFXa-112-64.png", "schema": { "componentName": "OadpFormItem", "props": { "label": "名称", // "name": "name", "valueName": "name", "size": "medium", // "labelAlign": "top", "labelTextAlign": "left", "fullWidth": false, "isPreview": false, "useLabelForErrorMessage": false, "preferMarginToDisplayHelp": false, "colon": false, "style": { "width": "256px" }, "disabled": false }, "hidden": false, "title": "", "isLocked": false, "condition": true, "conditionGroup": "" } } ]; export default { ...OadpFormItemMeta, snippets };