@rainbow-oh/yee-c 0.12.2 → 0.14.0

package/dist/cjs/style/variables.css

@@ -1,7 +1,7 @@
 /*!
  * @rainbow-oh/yee-c CSS Variables
  * Auto-generated, do not edit manually
- * Generated on 2026-09-14T02:29:50.905Z
+ * Generated on 2026-09-17T09:06:26.119Z
  */
 
 /* ========== color.css ========== */

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@ declare global {
         __yee_c_version__: string;
     }
 }
-export declare const version = "0.12.2";
+export declare const version = "0.14.0";

package/dist/cjs/version.js

@@ -22,7 +22,7 @@ __export(version_exports, {
   version: () => version
 });
 module.exports = __toCommonJS(version_exports);
-var version = "0.12.2";
+var version = "0.14.0";
 if (typeof window !== "undefined") {
   window.__yee_c_version__ = version;
 }

package/dist/esm/Field/demo/standalone.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/esm/Field/demo/standalone.js

@@ -0,0 +1,43 @@
+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 { Field, Input, TextArea } from "../..";
+import React, { useState } from 'react';
+export default (function () {
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    name = _useState2[0],
+    setName = _useState2[1];
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    remark = _useState4[0],
+    setRemark = _useState4[1];
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      maxWidth: 400
+    }
+  }, /*#__PURE__*/React.createElement(Field, {
+    label: "Name",
+    required: true
+  }, /*#__PURE__*/React.createElement(Input, {
+    value: name,
+    onChange: function onChange(v) {
+      return setName(v);
+    },
+    placeholder: "Standalone controlled Input"
+  })), /*#__PURE__*/React.createElement(Field, {
+    label: "Remark"
+  }, /*#__PURE__*/React.createElement(TextArea, {
+    value: remark,
+    onChange: function onChange(v) {
+      return setRemark(v);
+    },
+    placeholder: "Standalone controlled TextArea",
+    rows: 3
+  })), /*#__PURE__*/React.createElement(Field, null, /*#__PURE__*/React.createElement(Input, {
+    placeholder: "Field without label"
+  })));
+});

package/dist/esm/Field/field.js

@@ -37,7 +37,7 @@ var Field = function Field(props) {
     }, 0),
     _useReducer2 = _slicedToArray(_useReducer, 2),
     forceUpdate = _useReducer2[1];
-  var _useVirtualField = useVirtualField(formName, name, {
+  var _useVirtualField = useVirtualField(formName !== null && formName !== void 0 ? formName : '', name !== null && name !== void 0 ? name : '', {
       props: props,
       onStoreChange: forceUpdate
     }),
@@ -55,22 +55,35 @@ var Field = function Field(props) {
     }) || required;
   };
   var getControlled = function getControlled(children) {
-    var mergedDisabled = disabled || children.props.disabled;
+    var childProps = children.props;
+
+    // Pure layout mode (no form): children keep their own value/onChange.
+    // Only a Field-level disabled is merged down.
+    // Pure layout mode (no form or no field name): children keep their own
+    // value/onChange. Only a Field-level disabled is merged down.
+    if (!form || name === undefined) {
+      if (disabled === undefined) return children;
+      return /*#__PURE__*/React.cloneElement(children, {
+        disabled: disabled || childProps.disabled
+      });
+    }
+    var mergedDisabled = disabled || childProps.disabled;
+    var fieldName = name;
     var attr = {
-      value: getFieldValue === null || getFieldValue === void 0 ? void 0 : getFieldValue(name),
+      value: getFieldValue === null || getFieldValue === void 0 ? void 0 : getFieldValue(fieldName),
       name: formName,
-      id: name,
+      id: fieldName,
       disabled: mergedDisabled,
       onChange: function onChange(value) {
         var _callbacks$onValuesBe, _children$props, _callbacks$onValuesCh;
         var callbacks = getCallbacks === null || getCallbacks === void 0 ? void 0 : getCallbacks();
         var _value = value;
         var fieldsValue = getFieldsValue === null || getFieldsValue === void 0 ? void 0 : getFieldsValue();
-        var feedback = callbacks === null || callbacks === void 0 || (_callbacks$onValuesBe = callbacks.onValuesBeforeChange) === null || _callbacks$onValuesBe === void 0 ? void 0 : _callbacks$onValuesBe.call(callbacks, _defineProperty({}, name, _value), fieldsValue);
+        var feedback = callbacks === null || callbacks === void 0 || (_callbacks$onValuesBe = callbacks.onValuesBeforeChange) === null || _callbacks$onValuesBe === void 0 ? void 0 : _callbacks$onValuesBe.call(callbacks, _defineProperty({}, fieldName, _value), fieldsValue);
         if (feedback !== undefined) {
           _value = feedback;
         }
-        setFieldsValue === null || setFieldsValue === void 0 || setFieldsValue(_defineProperty({}, name, _value), 'onChange');
+        setFieldsValue === null || setFieldsValue === void 0 || setFieldsValue(_defineProperty({}, fieldName, _value), 'onChange');
 
         // Call child component's onChange
         if ((_children$props = children.props) !== null && _children$props !== void 0 && _children$props.onChange) {
@@ -80,12 +93,12 @@ var Field = function Field(props) {
           }
           (_ref2 = children.props).onChange.apply(_ref2, [_value].concat(rest));
         }
-        callbacks === null || callbacks === void 0 || (_callbacks$onValuesCh = callbacks['onValuesChange']) === null || _callbacks$onValuesCh === void 0 || _callbacks$onValuesCh.call(callbacks, _defineProperty({}, name, _value), fieldsValue);
+        callbacks === null || callbacks === void 0 || (_callbacks$onValuesCh = callbacks['onValuesChange']) === null || _callbacks$onValuesCh === void 0 || _callbacks$onValuesCh.call(callbacks, _defineProperty({}, fieldName, _value), fieldsValue);
         forceUpdate();
       },
       onBlur: function onBlur(event) {
         // Fire-and-forget async validation; store notifies onStoreChange on completion.
-        void (validateField === null || validateField === void 0 ? void 0 : validateField(name, 'onBlur'));
+        void (validateField === null || validateField === void 0 ? void 0 : validateField(fieldName, 'onBlur'));
 
         // Call child component's onBlur
         if (children.props.onBlur) {
@@ -95,14 +108,14 @@ var Field = function Field(props) {
     };
     return /*#__PURE__*/React.cloneElement(children, attr);
   };
-  var validate = getFieldValidate === null || getFieldValidate === void 0 ? void 0 : getFieldValidate(name);
+  var validate = name !== undefined ? getFieldValidate === null || getFieldValidate === void 0 ? void 0 : getFieldValidate(name) : undefined;
   return /*#__PURE__*/React.createElement("div", {
     className: clsx("".concat(prefixCls), "".concat(prefixCls, "-").concat(layout), _defineProperty({}, "".concat(prefixCls, "-").concat(validate === null || validate === void 0 ? void 0 : validate.status), validate === null || validate === void 0 ? void 0 : validate.status), className),
     style: style
-  }, /*#__PURE__*/React.createElement("label", {
+  }, label ? /*#__PURE__*/React.createElement("label", {
     className: clsx("".concat(prefixCls, "-label"), _defineProperty({}, "".concat(prefixCls, "-required"), isRequired()), classNames === null || classNames === void 0 ? void 0 : classNames.label),
     style: styles === null || styles === void 0 ? void 0 : styles.label
-  }, label), /*#__PURE__*/React.createElement("div", {
+  }, label) : null, /*#__PURE__*/React.createElement("div", {
     className: clsx("".concat(prefixCls, "-content"), classNames === null || classNames === void 0 ? void 0 : classNames.content),
     style: styles === null || styles === void 0 ? void 0 : styles.content
   }, /*#__PURE__*/React.createElement("div", {

package/dist/esm/Field/interface.d.ts

@@ -27,13 +27,16 @@ export interface FieldProps {
      */
     label?: React.ReactNode;
     /**
-     * Field name
+     * Field name (required only when used with a registered virtual form)
      */
-    name: string;
+    name?: string;
     /**
-     * Name of the parent form
+     * Name of the parent form.
+     * When omitted (or no form is registered under this name), Field renders
+     * as a pure layout wrapper: the child keeps its own value/onChange and
+     * no validation runs.
      */
-    formName: string;
+    formName?: string;
     /**
      * Whether disabled
      */

package/dist/esm/Field/style/index.less

@@ -25,6 +25,7 @@
   &-content {
     position: relative;
     padding-bottom: var(--yee-field-content-padding-bottom);
+    width: stretch;
   }
 
   &-error {

package/dist/esm/Table/demo/controlled-filter.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: () => React.JSX.Element;
+export default _default;

package/dist/esm/Table/demo/controlled-filter.js

@@ -0,0 +1,122 @@
+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 { Button, message, Space, Table } from "../..";
+import React, { useState } from 'react';
+var allData = [{
+  key: '1',
+  name: 'John Brown',
+  age: 32,
+  gender: 'male'
+}, {
+  key: '2',
+  name: 'Jim Green',
+  age: 42,
+  gender: 'male'
+}, {
+  key: '3',
+  name: 'Joe Black',
+  age: 32,
+  gender: 'male'
+}, {
+  key: '4',
+  name: 'Jon Snow',
+  age: 42,
+  gender: 'female'
+}, {
+  key: '5',
+  name: 'Arya Stark',
+  age: 16,
+  gender: 'female'
+}];
+export default (function () {
+  var _message$useMessage = message.useMessage(),
+    messageApi = _message$useMessage.messageApi,
+    messageHolder = _message$useMessage.messageHolder;
+
+  // Server-side search: keep the keyword controlled, refetch in onChange.
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    nameKeyword = _useState2[0],
+    setNameKeyword = _useState2[1];
+
+  // Controlled local filter: the tree selection lives in the parent state.
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    genders = _useState4[0],
+    setGenders = _useState4[1];
+  var columns = [{
+    title: 'Name',
+    dataIndex: 'name',
+    key: 'name',
+    filter: {
+      searchable: true,
+      // No onFilter: no local matching, the search hits the "server".
+      filteredValue: nameKeyword
+    }
+  }, {
+    title: 'Age',
+    dataIndex: 'age',
+    key: 'age'
+  }, {
+    title: 'Gender',
+    dataIndex: 'gender',
+    key: 'gender',
+    filter: {
+      filterMode: 'tree',
+      items: [{
+        label: 'Male',
+        key: 'male'
+      }, {
+        label: 'Female',
+        key: 'female'
+      }],
+      filteredValue: genders,
+      onFilter: function onFilter(value, record) {
+        return value === record.gender;
+      }
+    }
+  }];
+  var handleChange = function handleChange(info) {
+    var _info$filters, _filters$name, _filters$gender;
+    if (info.action !== 'filter') return;
+    var filters = (_info$filters = info.filters) !== null && _info$filters !== void 0 ? _info$filters : {};
+
+    // The committing column's key is always present in the payload — with its
+    // empty value on clear — so both setting and clearing are mirrored here.
+    var name = (_filters$name = filters.name) !== null && _filters$name !== void 0 ? _filters$name : '';
+    if (name !== nameKeyword) {
+      // Pretend to refetch with ?name=<keyword>.
+      messageApi.info("Fetch: /api/users?name=".concat(name));
+      setNameKeyword(name);
+    }
+    setGenders((_filters$gender = filters.gender) !== null && _filters$gender !== void 0 ? _filters$gender : []);
+  };
+  var data = allData.filter(function (item) {
+    var matchName = nameKeyword ? item.name.toLowerCase().includes(nameKeyword.toLowerCase()) : true;
+    var matchGender = genders.length ? genders.includes(item.gender) : true;
+    return matchName && matchGender;
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, messageHolder, /*#__PURE__*/React.createElement(Space, {
+    block: true,
+    style: {
+      marginBottom: 16
+    }
+  }, /*#__PURE__*/React.createElement(Button, {
+    onClick: function onClick() {
+      return setNameKeyword('');
+    }
+  }, "Reset name search"), /*#__PURE__*/React.createElement(Button, {
+    onClick: function onClick() {
+      return setGenders([]);
+    }
+  }, "Reset gender filter")), /*#__PURE__*/React.createElement(Table, {
+    columns: columns,
+    dataSource: data,
+    onChange: handleChange,
+    pagination: false
+  }));
+});

package/dist/esm/Table/hooks/useFilter.d.ts

@@ -8,12 +8,16 @@ type FilterRecord = {
     value: FilterInput;
     dataIndex: string;
 };
+export declare const isControlledFilter: (column?: ColumnProps) => boolean;
 export default function useFilter({ data, columns, }: {
     data: Array<Record<string, unknown>>;
     columns: ColumnProps[];
 }): {
     data: Record<string, unknown>[];
     filterRecords: FilterRecord[];
-    onFilter: ({ value, dataIndex }: FilterOptions) => void;
+    onFilter: ({ value, dataIndex }: FilterOptions) => {
+        data: Record<string, unknown>[];
+        filterRecords: FilterRecord[];
+    };
 };
 export {};

package/dist/esm/Table/hooks/useFilter.js

@@ -4,102 +4,145 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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 _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; }
 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 _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 { useEffect, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 var isEmptyFilterValue = function isEmptyFilterValue(value) {
   return value === '' || Array.isArray(value) && value.length === 0;
 };
+export var isControlledFilter = function isControlledFilter(column) {
+  var _column$filter;
+  return (column === null || column === void 0 || (_column$filter = column.filter) === null || _column$filter === void 0 ? void 0 : _column$filter.filteredValue) !== undefined;
+};
 var normalizeValue = function normalizeValue(value) {
   return value === null || value === undefined ? '' : String(value).toLowerCase();
 };
-export default function useFilter(_ref) {
-  var data = _ref.data,
-    columns = _ref.columns;
+
+// Controlled columns (`filteredValue` defined) always take their value from
+// the prop; internal records for them are ignored entirely — a commit on a
+// controlled column must not leak into the merged state while the parent has
+// not (yet) applied the new prop value.
+var mergeRecords = function mergeRecords(internalRecords, columnMap) {
+  var controlled = [];
+  columnMap.forEach(function (column, dataIndex) {
+    var _column$filter2;
+    if (!isControlledFilter(column)) return;
+    var value = (_column$filter2 = column.filter) === null || _column$filter2 === void 0 ? void 0 : _column$filter2.filteredValue;
+    if (!isEmptyFilterValue(value)) {
+      controlled.push({
+        dataIndex: dataIndex,
+        value: value
+      });
+    }
+  });
+  var merged = internalRecords.filter(function (record) {
+    return !isControlledFilter(columnMap.get(record.dataIndex));
+  });
+  if (!controlled.length && merged.length === internalRecords.length) {
+    return internalRecords;
+  }
+  return [].concat(_toConsumableArray(merged), controlled);
+};
+var applyFilters = function applyFilters(data, records, columnMap) {
+  var handled = records.filter(function (_ref) {
+    var dataIndex = _ref.dataIndex,
+      value = _ref.value;
+    return Boolean(dataIndex) && columnMap.has(dataIndex) && !isEmptyFilterValue(value);
+  });
+  if (!handled.length) {
+    return data;
+  }
+  return data.filter(function (item) {
+    return handled.every(function (_ref2) {
+      var _column$filter3, _column$filter4;
+      var dataIndex = _ref2.dataIndex,
+        value = _ref2.value;
+      var column = columnMap.get(dataIndex);
+
+      // Controlled column without `onFilter` is server-side: the data the
+      // consumer renders is already filtered upstream, pass it through.
+      if (isControlledFilter(column) && !(column !== null && column !== void 0 && (_column$filter3 = column.filter) !== null && _column$filter3 !== void 0 && _column$filter3.onFilter)) {
+        return true;
+      }
+      var customFilter = column === null || column === void 0 || (_column$filter4 = column.filter) === null || _column$filter4 === void 0 ? void 0 : _column$filter4.onFilter;
+      if (customFilter) {
+        return Array.isArray(value) ? value.some(function (filterValue) {
+          return customFilter(filterValue, item);
+        }) : customFilter(value, item);
+      }
+      var targetValue = normalizeValue(item[dataIndex]);
+      if (Array.isArray(value)) {
+        return value.some(function (filterValue) {
+          return targetValue === normalizeValue(filterValue);
+        });
+      }
+      return targetValue.includes(normalizeValue(value));
+    });
+  });
+};
+export default function useFilter(_ref3) {
+  var data = _ref3.data,
+    columns = _ref3.columns;
   var _useState = useState([]),
     _useState2 = _slicedToArray(_useState, 2),
-    filterRecords = _useState2[0],
-    setFilterRecords = _useState2[1];
+    internalRecords = _useState2[0],
+    setInternalRecords = _useState2[1];
   var columnMap = useMemo(function () {
     return new Map(columns.flatMap(function (column) {
       return column.dataIndex ? [[column.dataIndex, column]] : [];
     }));
   }, [columns]);
   useEffect(function () {
-    setFilterRecords(function (current) {
-      var next = current.filter(function (_ref2) {
-        var dataIndex = _ref2.dataIndex;
+    setInternalRecords(function (current) {
+      var next = current.filter(function (_ref4) {
+        var dataIndex = _ref4.dataIndex;
         return columnMap.has(dataIndex);
       });
       return next.length === current.length ? current : next;
     });
   }, [columnMap]);
-  var onFilter = function onFilter(_ref3) {
-    var value = _ref3.value,
-      dataIndex = _ref3.dataIndex;
-    setFilterRecords(function (current) {
-      if (isEmptyFilterValue(value)) {
-        return current.filter(function (item) {
-          return item.dataIndex !== dataIndex;
-        });
-      }
-      var index = current.findIndex(function (item) {
-        return item.dataIndex === dataIndex;
-      });
-      if (index === -1) {
-        return [].concat(_toConsumableArray(current), [{
-          dataIndex: dataIndex,
-          value: value
-        }]);
-      }
-      return current.map(function (item, itemIndex) {
-        return itemIndex === index ? _objectSpread(_objectSpread({}, item), {}, {
-          value: value
-        }) : item;
-      });
-    });
-  };
+  var activeRecords = useMemo(function () {
+    return mergeRecords(internalRecords, columnMap);
+  }, [internalRecords, columnMap]);
   var filtered = useMemo(function () {
-    var handled = filterRecords.filter(function (_ref4) {
-      var dataIndex = _ref4.dataIndex,
-        value = _ref4.value;
-      return Boolean(dataIndex) && columnMap.has(dataIndex) && !isEmptyFilterValue(value);
-    });
-    if (!handled.length) {
-      return data;
-    }
-    return data.filter(function (item) {
-      return handled.every(function (_ref5) {
-        var _columnMap$get;
-        var dataIndex = _ref5.dataIndex,
-          value = _ref5.value;
-        var customFilter = (_columnMap$get = columnMap.get(dataIndex)) === null || _columnMap$get === void 0 || (_columnMap$get = _columnMap$get.filter) === null || _columnMap$get === void 0 ? void 0 : _columnMap$get.onFilter;
-        if (customFilter) {
-          return Array.isArray(value) ? value.some(function (filterValue) {
-            return customFilter(filterValue, item);
-          }) : customFilter(value, item);
-        }
-        var targetValue = normalizeValue(item[dataIndex]);
-        if (Array.isArray(value)) {
-          return value.some(function (filterValue) {
-            return targetValue === normalizeValue(filterValue);
-          });
-        }
-        return targetValue.includes(normalizeValue(value));
-      });
-    });
-  }, [columnMap, data, filterRecords]);
+    return applyFilters(data, activeRecords, columnMap);
+  }, [columnMap, data, activeRecords]);
+
+  // Mirrors useSorter.onSort: computes the next state synchronously and
+  // returns it, so callers can emit onChange with the result in the same tick.
+  var onFilter = useCallback(function (_ref5) {
+    var value = _ref5.value,
+      dataIndex = _ref5.dataIndex;
+    var nextInternal = isEmptyFilterValue(value) ? internalRecords.filter(function (item) {
+      return item.dataIndex !== dataIndex;
+    }) : internalRecords.some(function (item) {
+      return item.dataIndex === dataIndex;
+    }) ? internalRecords.map(function (item) {
+      return item.dataIndex === dataIndex ? _objectSpread(_objectSpread({}, item), {}, {
+        value: value
+      }) : item;
+    }) : [].concat(_toConsumableArray(internalRecords), [{
+      dataIndex: dataIndex,
+      value: value
+    }]);
+    setInternalRecords(nextInternal);
+    var nextActive = mergeRecords(nextInternal, columnMap);
+    return {
+      data: applyFilters(data, nextActive, columnMap),
+      filterRecords: nextActive
+    };
+  }, [internalRecords, columnMap, data]);
   return {
     data: filtered,
-    filterRecords: filterRecords,
+    filterRecords: activeRecords,
     onFilter: onFilter
   };
 }

package/dist/esm/Table/index.d.ts

@@ -2,7 +2,7 @@ import Column from './column';
 import Summary from './summary';
 import InternalTable from './table';
 import Head from './theader';
-export type { ColumnProps, HeaderCell, PaginationType, RowSelectionType, TableBodyComponents, TableComponents, TableProps, TableRowRendererProps, onChangeParams, } from './interface';
+export type { ColumnProps, FilterValue, HeaderCell, PaginationType, RowSelectionType, TableBodyComponents, TableComponents, TableProps, TableRowRendererProps, onChangeParams, } from './interface';
 type TableType = typeof InternalTable & {
     Column: typeof Column;
     Summary: typeof Summary;

package/dist/esm/Table/interface.d.ts

@@ -62,11 +62,13 @@ export interface HeadCellProps extends Omit<WrapedColumnProps, 'title'> {
         [prop: string]: number;
     };
     showSorterTooltip?: boolean;
-    internalFilters?: {
-        [dataIndex: string]: boolean;
-    };
     onSort?: (dataIndex: string, sorter: any) => void;
-    onInternalFilter?: (dataIndex: string, value: string) => void;
+    onInternalFilter?: (options: {
+        dataIndex: string;
+        value: FilterValue | FilterValue[];
+        type?: 'filter' | 'search';
+        column: WrapedColumnProps;
+    }) => void;
     /**
      * `resizeKey` of the column currently being dragged, if any
      */
@@ -188,6 +190,14 @@ export interface ColumnProps {
          * Whether searchable, when items is undefined, it acts as a search component
          */
         searchable?: boolean;
+        /**
+         * Controlled filter state. When defined, this column's filter state is
+         * controlled: the dropdown echo, icon highlight and the `filters` in
+         * onChange all derive from it. With no `onFilter`, local matching is
+         * skipped entirely (server mode — filter in your onChange handler).
+         * Reset with `[]` / `''`.
+         */
+        filteredValue?: FilterValue | FilterValue[];
         /**
          * Filter icon
          */