@nokecy/qc-ui 1.0.65 → 1.0.67

package/dist/esm/RuleBuilder/utils/validation.js

@@ -0,0 +1,236 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+/**
+ * 规则验证逻辑
+ */
+
+import { operatorRequiresValue, operatorRequiresValue2, operatorRequiresMultiValue, getOperatorsByDataType } from "../constants/operators";
+
+/**
+ * 验证规则组
+ * @param group 规则组
+ * @param fields 字段定义列表
+ * @returns 验证结果
+ */
+export function validateRuleGroup(group, fields) {
+  var errors = [];
+  var warnings = [];
+
+  // 1. 检查规则组不为空
+  if (group.rules.length === 0 && group.groups.length === 0) {
+    warnings.push({
+      path: [],
+      message: '规则组为空，请至少添加一条规则或子规则组'
+    });
+  }
+
+  // 2. 验证每条规则
+  group.rules.forEach(function (rule, index) {
+    var ruleErrors = validateRule(rule, fields);
+    errors.push.apply(errors, _toConsumableArray(ruleErrors.map(function (err) {
+      return _objectSpread(_objectSpread({}, err), {}, {
+        path: [index]
+      });
+    })));
+  });
+
+  // 3. 递归验证嵌套规则组
+  group.groups.forEach(function (nestedGroup, index) {
+    var groupResult = validateRuleGroup(nestedGroup, fields);
+    errors.push.apply(errors, _toConsumableArray(groupResult.errors.map(function (err) {
+      return _objectSpread(_objectSpread({}, err), {}, {
+        path: [index].concat(_toConsumableArray(err.path))
+      });
+    })));
+    warnings.push.apply(warnings, _toConsumableArray(groupResult.warnings.map(function (warn) {
+      return _objectSpread(_objectSpread({}, warn), {}, {
+        path: [index].concat(_toConsumableArray(warn.path))
+      });
+    })));
+  });
+  return {
+    isValid: errors.length === 0,
+    errors: errors,
+    warnings: warnings
+  };
+}
+
+/**
+ * 验证单条规则
+ * @param rule 规则
+ * @param fields 字段定义列表
+ * @returns 错误列表
+ */
+export function validateRule(rule, fields) {
+  var errors = [];
+
+  // 1. 检查字段名是否为空
+  if (!rule.fieldName) {
+    errors.push({
+      path: [],
+      message: '请选择字段',
+      field: rule.fieldName
+    });
+    return errors; // 字段都没选，后续验证无意义
+  }
+
+  // 2. 检查字段是否存在
+  var field = fields.find(function (f) {
+    return f.name === rule.fieldName;
+  });
+  if (!field) {
+    errors.push({
+      path: [],
+      message: "\u5B57\u6BB5 \"".concat(rule.fieldName, "\" \u4E0D\u5B58\u5728"),
+      field: rule.fieldName
+    });
+    return errors;
+  }
+
+  // 3. 检查操作符是否有效
+  var allowedOperators = field.allowedOperators || getOperatorsByDataType(field.dataType);
+  if (!allowedOperators.includes(rule.operator)) {
+    errors.push({
+      path: [],
+      message: "\u5B57\u6BB5 \"".concat(field.displayName, "\" \u4E0D\u652F\u6301\u5F53\u524D\u64CD\u4F5C\u7B26"),
+      field: rule.fieldName
+    });
+  }
+
+  // 4. 检查值是否为空（对于需要值的操作符）
+  if (operatorRequiresValue(rule.operator)) {
+    if (rule.value === undefined || rule.value === null || rule.value === '') {
+      errors.push({
+        path: [],
+        message: '请输入值',
+        field: rule.fieldName
+      });
+    } else {
+      // 验证值的类型
+      var valueTypeError = validateValueType(rule.value, field.dataType);
+      if (valueTypeError) {
+        errors.push({
+          path: [],
+          message: valueTypeError,
+          field: rule.fieldName
+        });
+      }
+    }
+  }
+
+  // 5. 检查第二个值（Between 操作符）
+  if (operatorRequiresValue2(rule.operator)) {
+    if (rule.value2 === undefined || rule.value2 === null || rule.value2 === '') {
+      errors.push({
+        path: [],
+        message: '请输入最大值',
+        field: rule.fieldName
+      });
+    } else {
+      // 验证值的类型
+      var value2TypeError = validateValueType(rule.value2, field.dataType);
+      if (value2TypeError) {
+        errors.push({
+          path: [],
+          message: "\u6700\u5927\u503C: ".concat(value2TypeError),
+          field: rule.fieldName
+        });
+      }
+
+      // 检查范围的合理性
+      if (rule.value !== undefined && rule.value2 !== undefined) {
+        if (field.dataType === 'number' || field.dataType === 'date') {
+          var val1 = field.dataType === 'date' ? new Date(rule.value).getTime() : Number(rule.value);
+          var val2 = field.dataType === 'date' ? new Date(rule.value2).getTime() : Number(rule.value2);
+          if (val1 >= val2) {
+            errors.push({
+              path: [],
+              message: '最小值必须小于最大值',
+              field: rule.fieldName
+            });
+          }
+        }
+      }
+    }
+  }
+
+  // 6. 检查多值（In/NotIn 操作符）
+  if (operatorRequiresMultiValue(rule.operator)) {
+    if (!Array.isArray(rule.value) || rule.value.length === 0) {
+      errors.push({
+        path: [],
+        message: '请至少输入一个值',
+        field: rule.fieldName
+      });
+    } else {
+      // 验证数组中每个值的类型
+      rule.value.forEach(function (val, idx) {
+        var valueTypeError = validateValueType(val, field.dataType);
+        if (valueTypeError) {
+          errors.push({
+            path: [],
+            message: "\u503C ".concat(idx + 1, ": ").concat(valueTypeError),
+            field: rule.fieldName
+          });
+        }
+      });
+    }
+  }
+  return errors;
+}
+
+/**
+ * 验证值的类型是否匹配
+ * @param value 值
+ * @param dataType 数据类型
+ * @returns 错误信息，如果有效则返回 undefined
+ */
+function validateValueType(value, dataType) {
+  if (value === null || value === undefined) {
+    return undefined; // null/undefined 在这里不算错误，由其他逻辑处理
+  }
+  switch (dataType) {
+    case 'number':
+      if (typeof value !== 'number' && isNaN(Number(value))) {
+        return '值必须是数字';
+      }
+      break;
+    case 'boolean':
+      if (typeof value !== 'boolean') {
+        return '值必须是布尔值';
+      }
+      break;
+    case 'date':
+      if (!(value instanceof Date) && isNaN(Date.parse(String(value)))) {
+        return '值必须是有效的日期';
+      }
+      break;
+    case 'string':
+      // 字符串类型接受任何值（可以转换为字符串）
+      break;
+    default:
+      break;
+  }
+  return undefined;
+}
+
+/**
+ * 简化的验证（只检查是否有致命错误）
+ * @param group 规则组
+ * @param fields 字段定义列表
+ * @returns 是否有效
+ */
+export function isRuleGroupValid(group, fields) {
+  var result = validateRuleGroup(group, fields);
+  return result.isValid;
+}

package/dist/esm/components/RegexEditor/core/RegexEditor.d.ts

@@ -0,0 +1,34 @@
+/**
+ * RegexEditor 组件
+ *
+ * @description
+ * CodeMirror 6 包装器组件,集成正则表达式验证和错误标注功能。
+ * 提供实时语法验证、错误高亮、复杂度分析等功能。
+ *
+ * @module RegexEditor/core/RegexEditor
+ *
+ * @example
+ * ```tsx
+ * <RegexEditor
+ *   value={pattern}
+ *   onChange={setPattern}
+ *   placeholder="请输入正则表达式"
+ *   showComplexity={true}
+ *   onValidate={(result) => {
+ *     if (!result.valid) {
+ *       console.error('验证失败:', result.errors);
+ *     }
+ *   }}
+ * />
+ * ```
+ */
+import React from 'react';
+import type { RegexEditorProps } from './types';
+import './RegexEditor.less';
+/**
+ * RegexEditor 组件
+ *
+ * @param props - 组件属性
+ * @returns React 组件
+ */
+export declare const RegexEditor: React.FC<RegexEditorProps>;

package/dist/esm/components/RegexEditor/core/RegexEditor.js

@@ -0,0 +1,214 @@
+/**
+ * RegexEditor 组件
+ *
+ * @description
+ * CodeMirror 6 包装器组件,集成正则表达式验证和错误标注功能。
+ * 提供实时语法验证、错误高亮、复杂度分析等功能。
+ *
+ * @module RegexEditor/core/RegexEditor
+ *
+ * @example
+ * ```tsx
+ * <RegexEditor
+ *   value={pattern}
+ *   onChange={setPattern}
+ *   placeholder="请输入正则表达式"
+ *   showComplexity={true}
+ *   onValidate={(result) => {
+ *     if (!result.valid) {
+ *       console.error('验证失败:', result.errors);
+ *     }
+ *   }}
+ * />
+ * ```
+ */
+
+import React, { useMemo, useEffect, useRef } from 'react';
+import CodeMirror from '@uiw/react-codemirror';
+import { javascript } from '@codemirror/lang-javascript';
+import { EditorView } from '@codemirror/view';
+import { useRegexValidation } from "../hooks/useRegexValidation";
+import { createErrorMarkers, updateErrorMarkers } from "./extensions/errorMarker";
+import { RegexRailroadDiagram } from "../visualizer/RegexRailroadDiagram";
+import "./RegexEditor.less";
+
+/**
+ * RegexEditor 组件
+ *
+ * @param props - 组件属性
+ * @returns React 组件
+ */
+export var RegexEditor = function RegexEditor(_ref) {
+  var _ref$value = _ref.value,
+    value = _ref$value === void 0 ? '' : _ref$value,
+    onChange = _ref.onChange,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? '请输入正则表达式' : _ref$placeholder,
+    _ref$readOnly = _ref.readOnly,
+    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$showComplexity = _ref.showComplexity,
+    showComplexity = _ref$showComplexity === void 0 ? false : _ref$showComplexity,
+    _ref$showRailroadDiag = _ref.showRailroadDiagram,
+    showRailroadDiagram = _ref$showRailroadDiag === void 0 ? false : _ref$showRailroadDiag,
+    onValidate = _ref.onValidate,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? '120px' : _ref$height;
+  // 编辑器引用
+  var editorRef = useRef(null);
+
+  // 验证 Hook
+  var _useRegexValidation = useRegexValidation(value),
+    validationResult = _useRegexValidation.validationResult,
+    complexity = _useRegexValidation.complexity,
+    isValidating = _useRegexValidation.isValidating;
+
+  // 通知验证结果
+  useEffect(function () {
+    if (validationResult && onValidate) {
+      onValidate(validationResult);
+    }
+  }, [validationResult, onValidate]);
+
+  // 更新错误标注
+  useEffect(function () {
+    var _editorRef$current;
+    if ((_editorRef$current = editorRef.current) !== null && _editorRef$current !== void 0 && _editorRef$current.view && validationResult) {
+      var errors = validationResult.errors || [];
+      updateErrorMarkers(editorRef.current.view, errors);
+    }
+  }, [validationResult]);
+
+  // 构建扩展
+  var extensions = useMemo(function () {
+    var exts = [
+    // JavaScript 语法高亮(支持正则表达式)
+    javascript(),
+    // 自动换行
+    EditorView.lineWrapping,
+    // 错误标注
+    createErrorMarkers([]),
+    // 自定义主题
+    EditorView.theme({
+      '&': {
+        fontSize: '14px',
+        border: '1px solid #d9d9d9',
+        borderRadius: '2px',
+        backgroundColor: '#fff'
+      },
+      '&.cm-focused': {
+        outline: 'none',
+        borderColor: '#40a9ff',
+        boxShadow: '0 0 0 2px rgba(24, 144, 255, 0.2)'
+      },
+      '.cm-content': {
+        padding: '8px 0',
+        fontFamily: '"Monaco", "Menlo", "Ubuntu Mono", "Consolas", monospace',
+        caretColor: '#000'
+      },
+      '.cm-line': {
+        padding: '0 12px'
+      },
+      '.cm-scroller': {
+        overflow: 'auto',
+        maxHeight: '400px'
+      },
+      '&.cm-editor.cm-focused': {
+        outline: 'none'
+      },
+      // 占位符样式
+      '.cm-placeholder': {
+        color: '#bfbfbf',
+        fontStyle: 'italic'
+      }
+    })];
+
+    // 只读模式
+    if (readOnly || disabled) {
+      exts.push(EditorView.editable.of(false));
+    }
+    return exts;
+  }, [readOnly, disabled]);
+
+  // 处理值变化
+  var handleChange = function handleChange(newValue) {
+    if (onChange && !readOnly && !disabled) {
+      onChange(newValue);
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "regex-editor"
+  }, /*#__PURE__*/React.createElement(CodeMirror, {
+    ref: editorRef,
+    value: value,
+    height: height,
+    placeholder: placeholder,
+    editable: !readOnly && !disabled,
+    extensions: extensions,
+    onChange: handleChange,
+    basicSetup: {
+      lineNumbers: false,
+      foldGutter: false,
+      highlightActiveLine: false,
+      highlightActiveLineGutter: false,
+      syntaxHighlighting: true,
+      bracketMatching: true,
+      autocompletion: false,
+      closeBrackets: true,
+      highlightSelectionMatches: true
+    },
+    className: readOnly || disabled ? 'cm-readonly' : ''
+  }), showComplexity && complexity && /*#__PURE__*/React.createElement("div", {
+    className: "regex-complexity"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "complexity-item"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "label"
+  }, "\u6027\u80FD\u8BC4\u5206:"), /*#__PURE__*/React.createElement("span", {
+    className: "score score-".concat(getScoreLevel(complexity.performanceScore))
+  }, complexity.performanceScore)), /*#__PURE__*/React.createElement("div", {
+    className: "complexity-item"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "label"
+  }, "\u56DE\u6EAF\u98CE\u9669:"), /*#__PURE__*/React.createElement("span", {
+    className: "risk risk-".concat(complexity.backtrackingRisk)
+  }, getRiskLabel(complexity.backtrackingRisk))), complexity.suggestions.length > 0 && /*#__PURE__*/React.createElement("div", {
+    className: "complexity-suggestions"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "suggestions-title"
+  }, "\u4F18\u5316\u5EFA\u8BAE:"), /*#__PURE__*/React.createElement("ul", null, complexity.suggestions.map(function (suggestion, index) {
+    return /*#__PURE__*/React.createElement("li", {
+      key: index
+    }, suggestion);
+  })))), showRailroadDiagram && /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginTop: '16px'
+    }
+  }, /*#__PURE__*/React.createElement(RegexRailroadDiagram, {
+    pattern: value,
+    showTitle: true,
+    size: "default"
+  })));
+};
+
+/**
+ * 获取评分等级
+ */
+var getScoreLevel = function getScoreLevel(score) {
+  if (score >= 80) return 'high';
+  if (score >= 60) return 'medium';
+  return 'low';
+};
+
+/**
+ * 获取风险标签
+ */
+var getRiskLabel = function getRiskLabel(risk) {
+  var labels = {
+    low: '低',
+    medium: '中',
+    high: '高'
+  };
+  return labels[risk];
+};

package/dist/esm/components/RegexEditor/core/RegexEditor.less

@@ -0,0 +1,119 @@
+/**
+ * RegexEditor 组件样式
+ */
+
+.regex-editor {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+
+  // 复杂度信息区域
+  .regex-complexity {
+    padding: 12px;
+    background-color: #fafafa;
+    border: 1px solid #d9d9d9;
+    border-radius: 2px;
+    font-size: 13px;
+
+    .complexity-item {
+      display: flex;
+      align-items: center;
+      margin-bottom: 8px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+
+      .label {
+        font-weight: 500;
+        color: #595959;
+        margin-right: 8px;
+      }
+
+      .score {
+        padding: 2px 8px;
+        border-radius: 2px;
+        font-weight: 600;
+
+        &.score-high {
+          background-color: #f6ffed;
+          color: #52c41a;
+        }
+
+        &.score-medium {
+          background-color: #fffbe6;
+          color: #faad14;
+        }
+
+        &.score-low {
+          background-color: #fff2f0;
+          color: #ff4d4f;
+        }
+      }
+
+      .risk {
+        padding: 2px 8px;
+        border-radius: 2px;
+        font-weight: 600;
+
+        &.risk-low {
+          background-color: #f6ffed;
+          color: #52c41a;
+        }
+
+        &.risk-medium {
+          background-color: #fffbe6;
+          color: #faad14;
+        }
+
+        &.risk-high {
+          background-color: #fff2f0;
+          color: #ff4d4f;
+        }
+      }
+    }
+
+    .complexity-suggestions {
+      margin-top: 12px;
+      padding-top: 12px;
+      border-top: 1px solid #e8e8e8;
+
+      .suggestions-title {
+        font-weight: 500;
+        color: #595959;
+        margin-bottom: 8px;
+      }
+
+      ul {
+        margin: 0;
+        padding-left: 20px;
+
+        li {
+          color: #8c8c8c;
+          line-height: 1.6;
+          margin-bottom: 4px;
+
+          &:last-child {
+            margin-bottom: 0;
+          }
+        }
+      }
+    }
+  }
+
+  // 错误标注样式
+  .cm-regex-error {
+    text-decoration: wavy underline red;
+    text-decoration-skip-ink: none;
+  }
+
+  .cm-regex-warning {
+    text-decoration: wavy underline orange;
+    text-decoration-skip-ink: none;
+  }
+
+  .cm-regex-info {
+    text-decoration: wavy underline blue;
+    text-decoration-skip-ink: none;
+  }
+}

package/dist/esm/components/RegexEditor/core/extensions/errorMarker.d.ts

@@ -0,0 +1,49 @@
+/**
+ * CodeMirror 错误标注扩展
+ *
+ * @description
+ * 为 CodeMirror 编辑器添加错误标注功能,支持波浪下划线高亮显示错误位置。
+ *
+ * @module RegexEditor/core/extensions/errorMarker
+ */
+import { DecorationSet, EditorView } from '@codemirror/view';
+import { StateField } from '@codemirror/state';
+import type { RegexError } from '../../validation/types';
+/**
+ * 设置错误的 StateEffect
+ */
+export declare const setErrorsEffect: import("@codemirror/state").StateEffectType<RegexError[]>;
+/**
+ * 错误装饰状态字段
+ *
+ * @description
+ * 管理错误标注的 DecorationSet
+ */
+export declare const errorDecorationsField: StateField<DecorationSet>;
+/**
+ * 创建错误标注扩展
+ *
+ * @param errors - 错误列表
+ * @returns CodeMirror 扩展数组
+ *
+ * @example
+ * ```typescript
+ * const extensions = [
+ *   javascript(),
+ *   createErrorMarkers(errors)
+ * ];
+ * ```
+ */
+export declare const createErrorMarkers: (errors: RegexError[]) => StateField<DecorationSet>[];
+/**
+ * 更新错误标注的辅助函数
+ *
+ * @param view - EditorView 实例
+ * @param errors - 新的错误列表
+ *
+ * @example
+ * ```typescript
+ * updateErrorMarkers(editorView, validationErrors);
+ * ```
+ */
+export declare const updateErrorMarkers: (view: EditorView, errors: RegexError[]) => void;