UNPKG

@flatbiz/antd

Version:
245 lines (240 loc) 8.83 kB
/*! @flatjs/forge MIT @flatbiz/antd */ import { _ as _objectWithoutProperties, a as _slicedToArray, b as _objectSpread2 } from './_rollupPluginBabelHelpers-BspM60Sw.js'; import { isObject } from '@dimjs/lang/is-object'; import { useState, useRef, useMemo } from 'react'; import Ace from 'react-ace'; import { useMemoizedFn } from 'ahooks'; import { Space } from 'antd'; import xmlFormat from 'xml-formatter'; import { isUndefinedOrNull } from '@flatbiz/utils'; import { B as ButtonWrapper } from './button-wrapper-BGjkUPpk.js'; import { E as ErrorBoundaryWrapper } from './error-boundary-D6RX4EQZ.js'; import { F as FlexLayout } from './flex-layout-BGtMe7zr.js'; import 'ace-builds/src-noconflict/ext-language_tools.js'; import 'ace-builds/src-noconflict/mode-xml.js'; import 'ace-builds/src-noconflict/snippets/xml.js'; import { jsxs, jsx } from 'react/jsx-runtime'; /** * 验证xml格式的正确性 * ``` * result / true 验证通过 * result / false 验证不通过,message为失败描述(使用富文本渲染) * ``` */ var validateXML = function validateXML(xmlContent) { // errorCode 0是xml正确,1是xml错误,2是无法验证 var errorCode = 0; var errorMessage; // code for IE if (window['ActiveXObject']) { var xmlDoc = new window['ActiveXObject']('Microsoft.XMLDOM'); xmlDoc.async = 'false'; xmlDoc.loadXML(xmlContent); if (xmlDoc.parseError.errorCode != 0) { errorMessage = "\u9519\u8BEFcode: ".concat(xmlDoc.parseError.errorCode, " \n"); errorMessage = "".concat(errorMessage, " \u9519\u8BEF\u539F\u56E0: ").concat(xmlDoc.parseError.reason, " \n"); errorMessage = "".concat(errorMessage, " \u9519\u8BEF\u4F4D\u7F6E: ").concat(xmlDoc.parseError.line); errorCode = 1; } else { errorMessage = '格式正确'; } } // code for Mozilla, Firefox, Opera, chrome, safari,etc. else if (document.implementation['createDocument']) { var parser = new DOMParser(); var _xmlDoc = parser.parseFromString(xmlContent, 'text/xml'); var error = _xmlDoc.getElementsByTagName('parsererror'); if (error.length > 0) { if (_xmlDoc.documentElement.nodeName == 'parsererror') { errorCode = 1; errorMessage = _xmlDoc.documentElement.childNodes[0].nodeValue; } else { errorCode = 1; errorMessage = _xmlDoc.getElementsByTagName('parsererror')[0].innerHTML; } } else { errorMessage = '格式正确'; } } else { errorCode = 2; errorMessage = '浏览器不支持验证,无法验证xml正确性'; } return { message: errorMessage, result: errorCode == 0 ? true : false }; }; var _excluded = ["value", "onChange", "height", "hiddenVerifyBtn", "hiddenFormatterBtn", "autoCompleterList", "onLoad", "hiddenErrorMsg"]; /** * xml编辑器 * ``` * 1. 受控组件,需要使用value、onChange配合显示数据 * 2. heigth 默认为100%,如果外层无高度,需要自定义设置height属性 * 3. 通过 autoCompleterList 配置自动提示关键字 * 4. 通过 hiddenVerifyBtn、hiddenFormatterBtn可隐藏底部操作按钮 * 5. 通过 theme 配置编辑器主题,例如: * 5.1 顶部引入 import 'ace-builds/src-noconflict/theme-xxxx'; * 5.2 配置 theme = xxxx * ``` */ var AceEditorXml = function AceEditorXml(props) { var value = props.value, onChange = props.onChange, height = props.height, hiddenVerifyBtn = props.hiddenVerifyBtn, hiddenFormatterBtn = props.hiddenFormatterBtn, autoCompleterList = props.autoCompleterList, onLoad = props.onLoad, hiddenErrorMsg = props.hiddenErrorMsg, otherProps = _objectWithoutProperties(props, _excluded); var heightFt = isUndefinedOrNull(height) ? '100%' : height; var _useState = useState(Date.now()), _useState2 = _slicedToArray(_useState, 2), rootNodekey = _useState2[0], setRootNodekey = _useState2[1]; var _useState3 = useState(), _useState4 = _slicedToArray(_useState3, 2), errorMsg = _useState4[0], setErrorMsg = _useState4[1]; var editorRef = useRef(); var valueNew = useMemo(function () { if (isObject(value)) { return JSON.stringify(value, null, 2); } return value; }, [value]); var handleChange = useMemoizedFn(function (content) { if (errorMsg) { setErrorMsg(undefined); } onChange === null || onChange === void 0 || onChange(content); }); var getCompletions = useMemoizedFn(function (_a, _b, _c, _d, callback) { callback(null, autoCompleterList === null || autoCompleterList === void 0 ? void 0 : autoCompleterList.map(function (item) { return { name: item.name, value: item.name, // score: 100, meta: item.desc }; })); }); var onLoadHandle = function onLoadHandle(editor) { editorRef.current = editor; /** 向编辑器中添加自动补全列表 */ var findIndex = editor.completers.findIndex(function (item) { return item.id === 'custom'; }); if (findIndex >= 0) { editor.completers[findIndex] = { getCompletions: getCompletions, id: 'custom' }; } else { editor.completers.push({ getCompletions: getCompletions, id: 'custom' }); } onLoad === null || onLoad === void 0 || onLoad(editor); }; var inputValueVerify = function inputValueVerify(inputValue) { var result = validateXML(inputValue); if (result.result) { onChange === null || onChange === void 0 || onChange(inputValue); } else { setErrorMsg(result.message); } }; var footer = /*#__PURE__*/jsxs(Space, { style: { alignItems: 'flex-start' }, children: [/*#__PURE__*/jsx(ButtonWrapper, { hidden: hiddenFormatterBtn === true, type: "primary", ghost: true, onClick: function onClick() { var _editorRef$current; var currentValue = (_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 ? void 0 : _editorRef$current.getValue(); var result = xmlFormat; onChange === null || onChange === void 0 || onChange(result(currentValue || '')); }, children: "\u7F8E\u5316" }), /*#__PURE__*/jsx(ButtonWrapper, { hidden: hiddenVerifyBtn === true, type: "primary", ghost: true, onClick: function onClick() { var _editorRef$current2; var currentValue = (_editorRef$current2 = editorRef.current) === null || _editorRef$current2 === void 0 ? void 0 : _editorRef$current2.getValue(); if (!currentValue) { onChange === null || onChange === void 0 || onChange(currentValue); return; } inputValueVerify(currentValue); }, children: "\u9A8C\u8BC1&\u683C\u5F0F\u5316\u6570\u636E" }), !hiddenErrorMsg && errorMsg ? /*#__PURE__*/jsx("span", { style: { color: 'red' }, dangerouslySetInnerHTML: { __html: errorMsg } }) : null] }); var Element = (Ace === null || Ace === void 0 ? void 0 : Ace['default']) || Ace; return /*#__PURE__*/jsxs(FlexLayout, { fullIndex: 0, className: "ace-editor-xml", style: { height: heightFt }, children: [/*#__PURE__*/jsx("div", { className: "aex-content", children: /*#__PURE__*/jsx(ErrorBoundaryWrapper, { onRenderReset: function onRenderReset() { onChange === null || onChange === void 0 || onChange(undefined); setRootNodekey(Date.now()); }, children: /*#__PURE__*/jsx(Element, _objectSpread2(_objectSpread2({ fontSize: 14, showPrintMargin: true, showGutter: true, highlightActiveLine: true, height: "100%", width: "auto", placeholder: "\u8BF7\u8F93\u5165" }, otherProps), {}, { setOptions: _objectSpread2({ useWorker: false, enableBasicAutocompletion: false, enableLiveAutocompletion: true, enableSnippets: false, showLineNumbers: true, tabSize: 2 }, otherProps.setOptions), mode: "xml", onLoad: onLoadHandle, onChange: handleChange, onBlur: function onBlur(_event, editor) { var value = editor === null || editor === void 0 ? void 0 : editor.getValue(); if (value) { inputValueVerify(value); } }, value: valueNew })) }) }), /*#__PURE__*/jsx("div", { className: "ace-editor-xml-footer", style: _objectSpread2({ marginTop: 10 }, props.footerStyle), children: props.footerExtraRender ? props.footerExtraRender(footer) : footer })] }, rootNodekey); }; export { AceEditorXml as A }; //# sourceMappingURL=editor-DZQ3NHrz.js.map