@nokecy/qc-ui-components 0.0.0-stage → 2.0.0-beta.0

package/dist/esm/ag-grid-plus/queryForm/datePrecision.js

@@ -0,0 +1,103 @@
+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); }
+import dayjs from 'dayjs';
+export var DATE_QUERY_FORMAT = 'YYYY-MM-DD';
+export var DATE_TIME_QUERY_FORMAT = 'YYYY-MM-DD HH:mm:ss';
+
+/** 查询日期精度：按日或精确到秒。@author nokecy */
+
+/**
+ * 宿主按自身字段约定推断列的查询日期精度；返回 false 表示该列不是时刻查询，undefined 表示不推断。
+ * AgGridPlus 用它为未声明 queryDatePrecision 的列补齐声明。@author nokecy
+ */
+
+/**
+ * 查询的日期精度同时用于控件与请求，避免界面选了时间、序列化时却截成日期。
+ * 只读取列上的声明：控件属性（showTime/picker/format）优先，其次 queryDatePrecision，再次列类型与筛选器。
+ * @author nokecy
+ */
+export var getDateQueryPrecision = function getDateQueryPrecision(column) {
+  var _column$searchCompone;
+  if (!column) return undefined;
+  var props = (_column$searchCompone = column.searchComponentProps) !== null && _column$searchCompone !== void 0 ? _column$searchCompone : {};
+  var types = (Array.isArray(column.type) ? column.type : [column.type]).map(String);
+  if (props.showTime === false || props.picker && props.picker !== 'date' || types.some(function (type) {
+    return /^(?:System\.)?DateOnly$/i.test(type);
+  })) return 'date';
+  if (props.showTime || typeof props.format === 'string' && /H|h|m|s/.test(props.format.replace(/\[[^\]]*\]/g, ''))) return 'dateTime';
+  if (types.some(function (type) {
+    return /^(?:numberColumn|numericColumn|number|bool|boolean|boolColumn)$/.test(type);
+  })) return undefined;
+  if (column.queryDatePrecision === false) return undefined;
+  if (column.queryDatePrecision === 'date' || column.queryDatePrecision === 'dateTime') return column.queryDatePrecision;
+  if (types.some(function (type) {
+    return /^(?:dateTimeColumn|dateTime|DateTimeOffset|System\.DateTime(?:Offset)?)$/i.test(type);
+  })) return 'dateTime';
+  if (types.some(function (type) {
+    return /^(?:dateColumn|date|DateOnly|System\.DateOnly)$/i.test(type);
+  })) return 'date';
+  if (column.filter === 'agDateColumnFilter' || /DatePicker|DateRangePicker/.test(String(column.searchComponent))) return 'date';
+  return undefined;
+};
+
+/** 用宿主推断为未声明精度的叶列补 queryDatePrecision；已声明的列与分组结构保持不变。@author nokecy */
+export var applyDateQueryPrecision = function applyDateQueryPrecision(columns, resolve) {
+  if (!resolve) return columns;
+  return columns.map(function (column) {
+    if (Array.isArray(column.children)) return _objectSpread(_objectSpread({}, column), {}, {
+      children: applyDateQueryPrecision(column.children, resolve)
+    });
+    if (column.queryDatePrecision !== undefined) return column;
+    var precision = resolve(column);
+    return precision === undefined ? column : _objectSpread(_objectSpread({}, column), {}, {
+      queryDatePrecision: precision
+    });
+  });
+};
+
+/** 时刻查询默认覆盖所选整天，用户可继续调整到具体秒；已有控件配置优先保留。@author nokecy */
+export var getDateQueryProps = function getDateQueryProps(column) {
+  var _column$searchCompone2;
+  var range = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  var props = (_column$searchCompone2 = column === null || column === void 0 ? void 0 : column.searchComponentProps) !== null && _column$searchCompone2 !== void 0 ? _column$searchCompone2 : {};
+  var precision = getDateQueryPrecision(column);
+  if (!precision) return props;
+  if (precision === 'date') return _objectSpread({
+    format: DATE_QUERY_FORMAT
+  }, props);
+  return _objectSpread(_objectSpread({}, props), {}, {
+    format: DATE_TIME_QUERY_FORMAT,
+    showTime: _objectSpread(_objectSpread({
+      defaultValue: range ? [dayjs('2000-01-01 00:00:00'), dayjs('2000-01-01 23:59:59')] : dayjs('2000-01-01 00:00:00')
+    }, _typeof(props.showTime) === 'object' ? props.showTime : {}), {}, {
+      format: 'HH:mm:ss',
+      showHour: true,
+      showMinute: true,
+      showSecond: true
+    })
+  });
+};
+
+/** 独立查询列优先于同字段的展示列，并兼容分组列与 queryField 别名。@author nokecy */
+export var findDateQueryColumn = function findDateQueryColumn(columns, field) {
+  var _leaves$find;
+  var leaves = columns.flatMap(function (column) {
+    return Array.isArray(column.children) ? flattenQueryColumns(column.children) : [column];
+  });
+  return (_leaves$find = leaves.find(function (column) {
+    var _column$queryField;
+    return ((_column$queryField = column.queryField) !== null && _column$queryField !== void 0 ? _column$queryField : column.field) === field && !column.hideInSearch;
+  })) !== null && _leaves$find !== void 0 ? _leaves$find : leaves.find(function (column) {
+    var _column$queryField2;
+    return ((_column$queryField2 = column.queryField) !== null && _column$queryField2 !== void 0 ? _column$queryField2 : column.field) === field;
+  });
+};
+var flattenQueryColumns = function flattenQueryColumns(columns) {
+  return columns.flatMap(function (column) {
+    return Array.isArray(column.children) ? flattenQueryColumns(column.children) : [column];
+  });
+};

package/dist/esm/ag-grid-plus/queryForm/index.d.ts

@@ -0,0 +1,20 @@
+import { ColDef, ColumnState, GridApi } from 'ag-grid-community';
+import React from 'react';
+import './index.less';
+/** 查询区初始化兜底：requestAnimationFrame 迟迟不触发时，最迟这么久后通知首查（毫秒）。@author nokecy */
+export declare const INIT_FALLBACK_DELAY = 300;
+declare const FormRender: (props: {
+    className?: any;
+    gridApi?: GridApi<any> | undefined;
+    colDefs: ColDef[];
+    /** 与表格同轮渲染的生效列定义快照。@author nokecy */
+    effectiveColDefs?: ColDef<any, any>[] | undefined;
+    columnStates: ColumnState[];
+    defaultExpand?: Boolean | undefined;
+    defaultRows?: number | undefined;
+    onQuery: (formValue: any) => void;
+    onInit?: ((defaultValues: any) => void) | undefined;
+    /** 查询条件值变化（输入、默认值落位、重置）时回调，参数为当前条件快照；不触发查询。@author nokecy */
+    onValuesChange?: ((values: Record<string, any>) => void) | undefined;
+}) => React.JSX.Element;
+export default FormRender;

package/dist/esm/ag-grid-plus/queryForm/index.js

@@ -0,0 +1,267 @@
+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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { DatePicker, FormButtonGroup, FormGrid, FormItem, Form, Input, Select, Submit } from '@nokecy/formily-antd'; // @author nokecy
+import { createForm, LifeCycleTypes } from '@nokecy/formily-core';
+import { createSchemaField } from '@nokecy/formily-react';
+import { Button, theme } from 'antd';
+import classNames from 'classnames';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import QueryForm from "./queryForm";
+import { queryFormSchemaKey } from "./schemaKey";
+import { resolveQueryColumns } from "./queryColumns";
+import BoolSelect from "../_utils/boolSelect";
+import { getDateQueryPrecision, getDateQueryProps } from "./datePrecision";
+import "./index.less";
+
+/** 查询区初始化兜底：requestAnimationFrame 迟迟不触发时，最迟这么久后通知首查（毫秒）。@author nokecy */
+import { jsx as _jsx } from "react/jsx-runtime";
+export var INIT_FALLBACK_DELAY = 300;
+var FormRender = function FormRender(props) {
+  var className = props.className,
+    colDefs = props.colDefs,
+    _props$effectiveColDe = props.effectiveColDefs,
+    effectiveColDefs = _props$effectiveColDe === void 0 ? colDefs : _props$effectiveColDe,
+    columnStates = props.columnStates,
+    onQuery = props.onQuery,
+    _props$defaultRows = props.defaultRows,
+    defaultRows = _props$defaultRows === void 0 ? 1 : _props$defaultRows;
+  var _theme$useToken = theme.useToken(),
+    token = _theme$useToken.token; // 筛选区跟随宿主主题。@author nokecy
+  var queryColumns = resolveQueryColumns(colDefs, effectiveColDefs, columnStates);
+  var schemaKey = queryFormSchemaKey(undefined, queryColumns);
+  var _useState = useState({
+      type: 'object',
+      properties: {}
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    schema = _useState2[0],
+    setSchema = _useState2[1];
+
+  // 表单与 SchemaField 实例保持稳定，元数据更新不清空已输入的查询值。@author nokecy
+  var form = useMemo(function () {
+    return createForm();
+  }, []);
+
+  // 条件变化只通知宿主（如提示「条件已变更」），回调走 ref，宿主每次渲染传新函数也不重复订阅。@author nokecy
+  var onValuesChangeRef = useRef(props.onValuesChange);
+  onValuesChangeRef.current = props.onValuesChange;
+  useEffect(function () {
+    var id = form.subscribe(function (_ref) {
+      var _onValuesChangeRef$cu;
+      var type = _ref.type;
+      if (type === LifeCycleTypes.ON_FORM_VALUES_CHANGE) (_onValuesChangeRef$cu = onValuesChangeRef.current) === null || _onValuesChangeRef$cu === void 0 || _onValuesChangeRef$cu.call(onValuesChangeRef, _objectSpread({}, form.values));
+    });
+    return function () {
+      return form.unsubscribe(id);
+    };
+  }, [form]);
+  var SchemaField = useMemo(function () {
+    return createSchemaField({
+      components: {
+        QueryForm: QueryForm,
+        Input: Input,
+        Select: Select,
+        DatePicker: DatePicker,
+        FormItem: FormItem,
+        FormGrid: FormGrid,
+        FormButtonGroup: FormButtonGroup,
+        Submit: Submit,
+        Button: Button,
+        BoolSelect: BoolSelect
+      }
+    });
+  }, []);
+  var onSubmit = function onSubmit() {
+    onQuery && onQuery(form.values);
+  };
+  var onReset = function onReset() {
+    // 使用 forceClear: true 强制清空所有字段，包括有默认值的字段
+    form.reset('*', {
+      forceClear: true
+    });
+    onQuery({});
+  };
+  var getComponent = function getComponent(colDef) {
+    var component = colDef.searchComponent ? colDef.searchComponent : undefined;
+    if (component) {
+      return component;
+    } else {
+      if (getDateQueryPrecision(colDef) && !colDef.enum) return 'DatePicker.RangePicker';
+      switch (colDef.filter) {
+        case "agDateColumnFilter":
+          component = "DatePicker.RangePicker";
+          break;
+        case "boolFilter":
+          component = "BoolSelect";
+          break;
+      }
+      switch (colDef.type) {
+        case "dateTimeColumn":
+        case "dateColumn":
+          component = "DatePicker.RangePicker";
+          break;
+        case "boolColumn":
+        case "bool":
+          component = "BoolSelect";
+          break;
+      }
+      if (colDef.enum) {
+        component = "Select";
+      }
+      return component ? component : "Input";
+    }
+  };
+  var getSchema = function getSchema() {
+    var rootSchema = {
+      type: 'object',
+      properties: {}
+    };
+    var gridSchema = {
+      type: 'void',
+      "name": 'queryForm',
+      "x-component": 'QueryForm',
+      properties: {},
+      "x-component-props": {
+        defaultRows: defaultRows,
+        defaultExpand: props.defaultExpand,
+        onReset: onReset
+      }
+    };
+    queryColumns.forEach(function (col) {
+      var _colDef$queryField, _colDef$searchTitle;
+      var colDef = col;
+      var name = (_colDef$queryField = colDef.queryField) !== null && _colDef$queryField !== void 0 ? _colDef$queryField : colDef.field;
+      var headerName = (_colDef$searchTitle = colDef.searchTitle) !== null && _colDef$searchTitle !== void 0 ? _colDef$searchTitle : colDef.headerName;
+      //表单自定义组件
+      var component = getComponent(colDef);
+      if (colDef.filter != false) {
+        var _colDef$searchCompone, _colDef$searchCompone2, _colDef$searchCompone3, _colDef$searchCompone4;
+        // 为多选下拉框添加maxTagCount配置
+        var componentProps = _objectSpread({
+          placeholder: "\u8BF7\u8F93\u5165".concat(headerName),
+          allowClear: true,
+          style: {
+            maxWidth: 200
+          }
+        }, getDateQueryProps(colDef, component !== 'DatePicker'));
+
+        // 如果是Select组件且为多选模式，添加标签数量限制
+        if (component === 'Select' && (componentProps.mode === 'multiple' || componentProps.mode === 'tags')) {
+          var _componentProps$maxTa, _componentProps$maxTa2;
+          componentProps.maxTagCount = (_componentProps$maxTa = componentProps.maxTagCount) !== null && _componentProps$maxTa !== void 0 ? _componentProps$maxTa : 2;
+          componentProps.maxTagPlaceholder = (_componentProps$maxTa2 = componentProps.maxTagPlaceholder) !== null && _componentProps$maxTa2 !== void 0 ? _componentProps$maxTa2 : function (omittedValues) {
+            return "+".concat(omittedValues.length, "...");
+          };
+        }
+        var filedSchema = {
+          type: 'string',
+          title: headerName,
+          required: (colDef === null || colDef === void 0 || (_colDef$searchCompone = colDef.searchComponentProps) === null || _colDef$searchCompone === void 0 ? void 0 : _colDef$searchCompone.required) || false,
+          default: (_colDef$searchCompone2 = colDef === null || colDef === void 0 || (_colDef$searchCompone3 = colDef.searchComponentProps) === null || _colDef$searchCompone3 === void 0 ? void 0 : _colDef$searchCompone3.default) !== null && _colDef$searchCompone2 !== void 0 ? _colDef$searchCompone2 : colDef === null || colDef === void 0 || (_colDef$searchCompone4 = colDef.searchComponentProps) === null || _colDef$searchCompone4 === void 0 ? void 0 : _colDef$searchCompone4.defaultValue,
+          enum: colDef === null || colDef === void 0 ? void 0 : colDef.enum,
+          "x-component": component,
+          "x-component-props": componentProps,
+          "x-decorator": 'FormItem',
+          "x-decorator-props": {
+            wrapperWrap: true
+          }
+        };
+        ///@ts-ignore
+        gridSchema.properties[name] = filedSchema;
+      }
+    });
+    ///@ts-ignore
+    rootSchema.properties["queryForm"] = gridSchema;
+    if (!queryColumns.length) {
+      ///@ts-ignore
+      delete rootSchema.properties["queryForm"];
+    }
+    return rootSchema;
+  };
+
+  // 【新增】用于追踪是否已完成首次初始化
+  var initializedRef = useRef(false);
+  var previousFieldsRef = useRef([]);
+  useEffect(function () {
+    var _new_schema$propertie, _new_schema$propertie2;
+    var new_schema = getSchema();
+    var fieldSchemas = (_new_schema$propertie = (_new_schema$propertie2 = new_schema.properties) === null || _new_schema$propertie2 === void 0 || (_new_schema$propertie2 = _new_schema$propertie2.queryForm) === null || _new_schema$propertie2 === void 0 ? void 0 : _new_schema$propertie2.properties) !== null && _new_schema$propertie !== void 0 ? _new_schema$propertie : {};
+    // 移除失效查询项的字段图和值，避免界面已经移除却仍提交旧筛选。@author nokecy
+    previousFieldsRef.current.filter(function (name) {
+      return !(name in fieldSchemas);
+    }).forEach(function (name) {
+      form.clearFormGraph(name);
+      form.deleteValuesIn(name);
+      form.deleteInitialValuesIn(name);
+    });
+    previousFieldsRef.current = Object.keys(fieldSchemas);
+    setSchema(new_schema);
+    // 已有字段同步元数据，不触碰仍有效字段的查询值，也不触发查询。@author nokecy
+    Object.entries(fieldSchemas).forEach(function (_ref2) {
+      var _ref3 = _slicedToArray(_ref2, 2),
+        name = _ref3[0],
+        fieldSchema = _ref3[1];
+      form.query(name).take(function (field) {
+        var _fieldSchema$enum;
+        field.title = fieldSchema.title;
+        field.required = fieldSchema.required;
+        // Select 会把 dataSource 映射为 options；仅配置 options 时也同步该数据源。@author nokecy
+        field.dataSource = (_fieldSchema$enum = fieldSchema.enum) !== null && _fieldSchema$enum !== void 0 ? _fieldSchema$enum : fieldSchema['x-component-props'].options;
+        field.component = [fieldSchema['x-component'], fieldSchema['x-component-props']];
+      });
+    });
+    form.query('queryForm').take(function (field) {
+      return field.setComponentProps({
+        defaultRows: defaultRows,
+        defaultExpand: props.defaultExpand,
+        onReset: onReset
+      });
+    });
+
+    // 【修复】在 schema 设置完成后调用 onInit
+    // 使用 setTimeout 确保 Formily 有时间处理 schema 并应用默认值
+    if (!initializedRef.current) {
+      initializedRef.current = true;
+      // 使用 requestAnimationFrame + setTimeout 确保默认值已应用
+      // 后台标签页或浏览器繁忙时 requestAnimationFrame 可能迟迟不触发，列表首查就一直不发，
+      // 只能手动点「查询」；另设一个定时兜底，两条路先到先执行、只执行一次。@author nokecy
+      var initialized = false;
+      var notifyInit = function notifyInit() {
+        if (initialized) return;
+        initialized = true;
+        props.onInit && props.onInit(form.values);
+      };
+      requestAnimationFrame(function () {
+        setTimeout(notifyInit, 0);
+      });
+      setTimeout(notifyInit, INIT_FALLBACK_DELAY);
+    }
+  }, [schemaKey, defaultRows, props.defaultExpand]);
+  return /*#__PURE__*/_jsx("div", {
+    className: classNames(className, "ag-grid-table-search ag-grid-table-search-query-filter"),
+    style: {
+      backgroundColor: token.colorBgContainer
+    },
+    children: /*#__PURE__*/_jsx(Form, {
+      form: form,
+      labelWidth: 120,
+      labelWrap: false,
+      feedbackLayout: "none",
+      onAutoSubmit: onSubmit,
+      children: /*#__PURE__*/_jsx(SchemaField, {
+        schema: schema
+      })
+    })
+  });
+};
+export default FormRender;

package/dist/esm/ag-grid-plus/queryForm/index.less

@@ -0,0 +1,67 @@
+
+@pro-table-search-prefix-cls: ~'ag-grid-table-search';
+
+@pro-table-form-prefix-cls: ~'ag-grid-table-form';
+
+.@{pro-table-search-prefix-cls} {
+    margin-bottom: 8px;
+    padding: 8px;
+    // padding-bottom: 0;
+    // 背景由组件读取 Ant Design 主题 token，支持浅色和深色。@author nokecy
+
+    &.@{pro-table-form-prefix-cls} {
+        margin: 0;
+        padding: 0 16px;
+        overflow: unset;
+    }
+
+    &-light {
+        margin-bottom: 0;
+        padding: 16px 0;
+    }
+
+    &-form-option {
+        .ant-form-item {
+            margin: 0;
+        }
+
+        .ant-form-item-label {
+            opacity: 0;
+        }
+
+        .ant-form-item-control-input {
+            justify-content: flex-start;
+        }
+    }
+
+    // 多选下拉框标签省略样式
+    .ant-select-multiple {
+        max-width: 200px; // 限制整个选择器的最大宽度
+
+        .ant-select-content {
+            max-width: 100%;
+            flex-wrap: nowrap; // AntD 6 tags now live directly under content
+            overflow: hidden; // 防止内容溢出
+
+            .ant-select-selection-item {
+                max-width: 100px; // 单个标签最大宽度
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                flex-shrink: 0; // 防止标签被压缩
+            }
+        }
+    }
+}
+
+@media (max-width: 575px) {
+    .@{pro-table-search-prefix-cls} {
+        height: auto !important;
+        padding-bottom: 24px;
+
+        .ant-form-item-label {
+            min-width: 80px;
+            text-align: left;
+        }
+    }
+}

package/dist/esm/ag-grid-plus/queryForm/queryColumns.d.ts

@@ -0,0 +1,8 @@
+import type { ColumnState } from 'ag-grid-community';
+import type { ExtendedColDef } from '../types';
+/**
+ * 从同一轮渲染的列定义快照派生查询项，不在副作用中读取 AG Grid 的上一轮定义。
+ * 表头名称跟随生效列方案；查询专用元数据和独立标题由页面声明。
+ * @author nokecy
+ */
+export declare const resolveQueryColumns: (sourceColumns: readonly ExtendedColDef[], effectiveColumns: readonly ExtendedColDef[], columnStates: readonly ColumnState[]) => ExtendedColDef[];

package/dist/esm/ag-grid-plus/queryForm/queryColumns.js

@@ -0,0 +1,47 @@
+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); }
+/**
+ * 从同一轮渲染的列定义快照派生查询项，不在副作用中读取 AG Grid 的上一轮定义。
+ * 表头名称跟随生效列方案；查询专用元数据和独立标题由页面声明。
+ * @author nokecy
+ */
+export var resolveQueryColumns = function resolveQueryColumns(sourceColumns, effectiveColumns, columnStates) {
+  var effectiveById = new Map();
+  effectiveColumns.forEach(function (column) {
+    if (column.colId) effectiveById.set(column.colId, column);
+    if (column.field) effectiveById.set(column.field, column);
+  });
+  var stateById = new Map(columnStates.map(function (state) {
+    return [state.colId, state];
+  }));
+  return sourceColumns.map(function (source) {
+    var _source$colId, _ref, _state$hide, _effective$headerName;
+    var columnId = (_source$colId = source.colId) !== null && _source$colId !== void 0 ? _source$colId : source.field;
+    var effective = columnId ? effectiveById.get(columnId) : undefined;
+    var state = columnId ? stateById.get(columnId) : undefined;
+    return _objectSpread(_objectSpread(_objectSpread({}, source), effective), {}, {
+      // 查询只使用列状态的显隐；null 表示沿用生效列定义。@author nokecy
+      hide: (_ref = (_state$hide = state === null || state === void 0 ? void 0 : state.hide) !== null && _state$hide !== void 0 ? _state$hide : effective === null || effective === void 0 ? void 0 : effective.hide) !== null && _ref !== void 0 ? _ref : source.hide,
+      // 查询元数据不从持久表格方案反向覆盖源码。@author nokecy
+      field: source.field,
+      queryField: source.queryField,
+      headerName: (_effective$headerName = effective === null || effective === void 0 ? void 0 : effective.headerName) !== null && _effective$headerName !== void 0 ? _effective$headerName : source.headerName,
+      searchTitle: source.searchTitle,
+      queryDatePrecision: source.queryDatePrecision,
+      hideInSearch: source.hideInSearch,
+      hideInTable: source.hideInTable,
+      filter: source.filter,
+      type: source.type,
+      enum: source.enum,
+      searchComponent: source.searchComponent,
+      searchComponentProps: source.searchComponentProps
+    });
+  }).filter(function (column) {
+    var _column$queryField;
+    return Boolean((_column$queryField = column.queryField) !== null && _column$queryField !== void 0 ? _column$queryField : column.field) && column.filter !== false && !column.hideInSearch && (column.hideInTable || column.visible !== false && !column.hide);
+  });
+};

package/dist/esm/ag-grid-plus/queryForm/queryForm.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const QueryForm: React.MemoExoticComponent<import("@nokecy/formily-react").ReactFC<any>>;
+export default QueryForm;

package/dist/esm/ag-grid-plus/queryForm/queryForm.js

@@ -0,0 +1,118 @@
+import { ClearOutlined, DownOutlined, SearchOutlined } from "@ant-design/icons";
+import { FormButtonGroup, FormGrid, Submit } from "@nokecy/formily-antd";
+import { observer } from "@nokecy/formily-react";
+import { Button } from "antd";
+import React, { useMemo, Fragment } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+var useCollapseGrid = function useCollapseGrid(maxRows, defaultExpand) {
+  var grid = useMemo(function () {
+    return FormGrid.createFormGrid({
+      maxColumns: 5,
+      // 查询项含固定标签和输入框，操作区含查询、重置、折叠入口。@author nokecy
+      minWidth: 240,
+      maxWidth: 240,
+      maxRows: defaultExpand ? Infinity : maxRows,
+      shouldVisible: function shouldVisible(node, grid) {
+        // 展开状态时，显示所有元素
+        if (grid.maxRows === Infinity) return true;
+
+        // 对于按钮列（最后一个元素），总是显示
+        if (node.index === grid.childSize - 1) {
+          return true;
+        }
+
+        // 所有查询项均占一格；按当前响应式列数为末行按钮预留一格。
+        // 单列窄屏至少保留一个查询项，按钮自然换到下一行。@author nokecy
+        var capacity = Math.max(1, maxRows * Math.max(1, grid.columns) - 1);
+        return node.index !== undefined && node.index < capacity;
+      }
+    });
+  }, [maxRows, defaultExpand] // 添加依赖项
+  );
+  var expanded = grid.maxRows === Infinity;
+  // 操作区展开时会填满余列，不能把它上一次的跨度用来判断是否还有隐藏条件。
+  // 根据完整查询项数量判断，折叠、外部重渲染和容器变宽都不会丢失入口。@author nokecy
+  var capacity = Math.max(1, maxRows * Math.max(1, grid.columns) - 1);
+  var collapsible = Math.max(0, grid.childSize - 1) > capacity;
+  var toggle = function toggle() {
+    if (grid.maxRows === Infinity) {
+      grid.maxRows = maxRows;
+    } else {
+      grid.maxRows = Infinity;
+    }
+  };
+  return {
+    grid: grid,
+    expanded: expanded,
+    toggle: toggle,
+    collapsible: collapsible
+  };
+};
+var QueryForm = observer(function (props) {
+  var onReset = props.onReset,
+    _props$defaultExpand = props.defaultExpand,
+    defaultExpand = _props$defaultExpand === void 0 ? false : _props$defaultExpand,
+    _props$defaultRows = props.defaultRows,
+    defaultRows = _props$defaultRows === void 0 ? 1 : _props$defaultRows;
+  var _useCollapseGrid = useCollapseGrid(defaultRows, defaultExpand),
+    grid = _useCollapseGrid.grid,
+    expanded = _useCollapseGrid.expanded,
+    toggle = _useCollapseGrid.toggle,
+    collapsible = _useCollapseGrid.collapsible;
+  var renderActions = function renderActions() {
+    return /*#__PURE__*/_jsxs(Fragment, {
+      children: [/*#__PURE__*/_jsx(Submit, {
+        type: "primary",
+        icon: /*#__PURE__*/_jsx(SearchOutlined, {}),
+        children: "\u67E5\u8BE2"
+      }), /*#__PURE__*/_jsx(Button, {
+        icon: /*#__PURE__*/_jsx(ClearOutlined, {}),
+        onClick: onReset,
+        children: "\u91CD\u7F6E"
+      })]
+    });
+  };
+  var renderExpanded = function renderExpanded() {
+    return /*#__PURE__*/_jsx("a", {
+      href: "#",
+      "aria-expanded": expanded,
+      onClick: function onClick(e) {
+        e.preventDefault();
+        toggle();
+      },
+      children: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [expanded ? "收起" : "展开", /*#__PURE__*/_jsx(DownOutlined, {
+          style: {
+            marginLeft: "0.5em",
+            transition: "0.3s all",
+            transform: "rotate(".concat(expanded ? 0 : 0.5, "turn)")
+          }
+        })]
+      })
+    });
+  };
+  var renderButtonGroup = function renderButtonGroup() {
+    return /*#__PURE__*/_jsx(Fragment, {
+      children: /*#__PURE__*/_jsxs(FormButtonGroup, {
+        align: "right",
+        children: [renderActions(), collapsible ? renderExpanded() : null]
+      })
+    });
+  };
+  return /*#__PURE__*/_jsxs(FormGrid, {
+    grid: grid,
+    colWrap: true,
+    strictAutoFit: true,
+    children: [props.children, /*#__PURE__*/_jsx(FormGrid.GridColumn, {
+      gridSpan: expanded || !collapsible ? -1 : 1,
+      style: {
+        display: "flex",
+        justifyContent: "right"
+      },
+      children: renderButtonGroup()
+    })]
+  });
+});
+export default QueryForm;