@oceanbase/design 1.0.0-alpha.17 → 1.0.0-alpha.18

package/lib/filter/components/FilterButton.js

@@ -37,6 +37,7 @@ const FilterButton = /*#__PURE__*/(0, _react.forwardRef)(({
   _isInWrapComponent = false,
   _isFlat = false,
   style,
+  allowClear = true,
   ...restProps
 }, ref) => {
   const {
@@ -46,6 +47,7 @@ const FilterButton = /*#__PURE__*/(0, _react.forwardRef)(({
     isCollapsed
   } = (0, _FilterContext.useFilterContext)();
   const [open, setOpen] = (0, _react.useState)(false);
+  const [popoverWidth, setPopoverWidth] = (0, _react.useState)();
   const {
     wrapSSR,
     prefixCls
@@ -77,11 +79,24 @@ const FilterButton = /*#__PURE__*/(0, _react.forwardRef)(({
   const handleOpenChange = newOpen => {
     if (!disabled) {
       setOpen(newOpen);
-      // 调用外部传入的 onOpenChange 回调，让父组件能够实时监听状态变化
       externalOnOpenChange?.(newOpen);
     }
   };
 
+  // 折叠模式下实时监听按钮宽度变化，同步到 Popover 面板宽度
+  (0, _react.useEffect)(() => {
+    if (!open || !isCollapsed || _isInWrapComponent || !innerRef.current) {
+      return;
+    }
+    const el = innerRef.current;
+    setPopoverWidth(el.offsetWidth);
+    const observer = new ResizeObserver(() => {
+      setPopoverWidth(el.offsetWidth);
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [open, isCollapsed, _isInWrapComponent]);
+
   // 使用 useMemo 缓存 content，避免每次都重新创建
   const popoverContent = (0, _react.useMemo)(() => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [!_isFlat && (!isCollapsed || _isInWrapComponent) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Flex, {
@@ -116,7 +131,10 @@ const FilterButton = /*#__PURE__*/(0, _react.forwardRef)(({
       body: {
         padding: 0,
         maxWidth: 300,
-        minWidth: 120
+        minWidth: 120,
+        ...(isCollapsed && !_isInWrapComponent && popoverWidth ? {
+          width: popoverWidth
+        } : {})
       }
     },
     ...popoverProps,
@@ -153,11 +171,11 @@ const FilterButton = /*#__PURE__*/(0, _react.forwardRef)(({
           }) : showSuffixIcon ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             className: (0, _style.getFilterCls)(prefixCls, 'icon-wrapper'),
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.DownOutlined, {
-              className: selected ? (0, _style.getFilterCls)(prefixCls, 'arrow-icon') : '',
+              className: selected && allowClear ? (0, _style.getFilterCls)(prefixCls, 'arrow-icon') : '',
               style: disabled ? {
                 color: 'var(--ob-color-icon-disabled)'
               } : undefined
-            }), selected && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            }), selected && allowClear && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: (0, _style.getFilterCls)(prefixCls, 'clear-icon'),
               onClick: e => {
                 if (!disabled) {

package/lib/filter/components/FilterCascader/components/FlatCascaderContent/index.d.ts

@@ -1,12 +1,13 @@
 import React from 'react';
+import type { CascaderPanelProps } from 'antd';
 import type { CascaderOption } from '../../types';
 import type { FilterButtonRef } from '../../../FilterButton';
-interface FlatCascaderContentProps {
+interface FlatCascaderContentProps extends CascaderPanelProps {
     options: CascaderOption[];
-    currentValue: string[][];
+    currentValue: (string | number)[][];
     multiple: boolean;
     filterButtonRef: React.RefObject<FilterButtonRef>;
-    onValueChange: (value: string[][]) => void;
+    onValueChange: (value: (string | number)[][]) => void;
 }
 /**
  * Flat 模式的级联内容容器组件

package/lib/filter/components/FilterCascader/components/FlatCascaderContent/index.js

@@ -23,7 +23,8 @@ const FlatCascaderContent = ({
   currentValue,
   filterButtonRef,
   multiple = false,
-  onValueChange
+  onValueChange,
+  ...restProps
 }) => {
   // 将组件内部的值格式转换为 Cascader.Panel 需要的格式
   // 组件内部：[[parent, child], ...] 或 [[parent, child]]
@@ -43,7 +44,7 @@ const FlatCascaderContent = ({
   }, [currentValue, multiple]);
 
   // 处理 Cascader.Panel 的值变化
-  const handleCascaderChange = (value, _selectedOptions) => {
+  const handleCascaderChange = value => {
     if (multiple) {
       // 多选：value 是 string[][]，如 [['frontend', 'react'], ['backend', 'java']]
       onValueChange(value);
@@ -55,16 +56,22 @@ const FlatCascaderContent = ({
   };
 
   // 使用条件渲染来处理 multiple 属性的类型问题
-  return multiple ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Cascader.Panel, {
+  return multiple ?
+  /*#__PURE__*/
+  // @ts-ignore-next-line
+  (0, _jsxRuntime.jsx)(_antd.Cascader.Panel, {
     options: options,
     value: cascaderValue,
     onChange: handleCascaderChange,
-    multiple: multiple
+    multiple: multiple,
+    showCheckedStrategy: _antd.Cascader.SHOW_CHILD,
+    ...restProps
   }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Cascader.Panel, {
     options: options,
     value: cascaderValue,
     onChange: handleCascaderChange,
-    multiple: false
+    multiple: false,
+    ...restProps
   });
 };
 exports.FlatCascaderContent = FlatCascaderContent;

package/lib/filter/components/FilterCascader/components/NormalCascaderContent.js

@@ -11,7 +11,6 @@ var _theme = _interopRequireDefault(require("../../../../theme"));
 var _input = _interopRequireDefault(require("../../../../input"));
 var _empty = _interopRequireDefault(require("../../../../empty"));
 var _icons = require("@oceanbase/icons");
-var _classnames = _interopRequireDefault(require("classnames"));
 var _style = require("../../../style");
 var _constants = require("../constants");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -109,9 +108,7 @@ const NormalCascaderContent = ({
           },
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Flex, {
             gap: _constants.GAP_SIZE_SMALL * 2,
-            className: (0, _classnames.default)((0, _style.getFilterCls)(prefixCls, 'select-option'), {
-              [(0, _style.getFilterCls)(prefixCls, 'has-selected')]: isNodeSelected
-            }),
+            className: (0, _style.getFilterCls)(prefixCls, 'select-option'),
             justify: "space-between",
             align: "center",
             onClick: handleNodeClick,
@@ -207,9 +204,7 @@ const NormalCascaderContent = ({
           },
           children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Flex, {
             gap: _constants.GAP_SIZE_SMALL * 2,
-            className: (0, _classnames.default)((0, _style.getFilterCls)(prefixCls, 'select-option'), {
-              [(0, _style.getFilterCls)(prefixCls, 'has-selected')]: hasSelectedChildren
-            }),
+            className: (0, _style.getFilterCls)(prefixCls, 'select-option'),
             justify: "space-between",
             align: "center",
             style: {

package/lib/filter/components/FilterInput.d.ts

@@ -11,6 +11,8 @@ export interface FilterInputProps extends BaseFilterProps {
     inputProps?: InputProps;
     /** Switch 组件的额外属性 */
     switchProps?: SwitchProps;
+    /** 是否显示开关，默认为 false */
+    showSwitch?: boolean;
 }
 declare const FilterInput: FC<FilterInputProps>;
 export default FilterInput;

package/lib/filter/components/FilterInput.js

@@ -24,6 +24,7 @@ const FilterInput = ({
   bordered = true,
   inputProps,
   switchProps,
+  showSwitch,
   ...restProps
 }) => {
   const {
@@ -76,13 +77,15 @@ const FilterInput = ({
       align: "center",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: label
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_switch.default, {
+      }), showSwitch && /*#__PURE__*/(0, _jsxRuntime.jsx)(_switch.default, {
         checked: switchValue,
         onChange: val => setSwitchValue(val),
         size: "small",
         ...switchProps
       })]
-    }), switchValue ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    }), showSwitch ?
+    // 有开关：根据 switchValue 决定是否显示 Input
+    switchValue && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         marginTop: 8
       },
@@ -91,7 +94,19 @@ const FilterInput = ({
         onChange: handleChange,
         ...inputProps
       })
-    }) : null]
+    }) :
+    /*#__PURE__*/
+    // 无开关：直接显示 Input
+    (0, _jsxRuntime.jsx)("div", {
+      style: {
+        marginTop: 8
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_input.default, {
+        value: currentValue,
+        onChange: handleChange,
+        ...inputProps
+      })
+    })]
   });
 
   // 如果处于折叠模式，只渲染内容部分

package/lib/filter/components/FilterSlot.d.ts

@@ -0,0 +1,28 @@
+import type { FC, ReactNode } from 'react';
+import type { BaseFilterProps, InternalFilterProps } from '../type';
+export interface FilterSlotProps extends BaseFilterProps, InternalFilterProps {
+    /**
+     * 直接渲染的自定义内容，不包裹 FilterButton + Popover。
+     * Filter.Slot 仅作为响应式收集的包裹容器，
+     * 会通过 cloneElement 自动注入 value/onChange。
+     */
+    children?: ReactNode;
+    /**
+     * Popover 弹框中的自定义筛选内容。
+     * 设置后使用 FilterButton + Popover 模式，
+     * 会通过 cloneElement 自动注入 value/onChange。
+     */
+    dropdownRender?: ReactNode;
+    /** 当前筛选值（受控） */
+    value?: any;
+    /** 默认筛选值（非受控） */
+    defaultValue?: any;
+    /** 值变化回调 */
+    onChange?: (value: any) => void;
+    /** 将 value 格式化为展示文本，用于 FilterButton 标签和折叠态 Tooltip */
+    formatValue?: (value: any) => string;
+    /** 未选值时的占位文本 */
+    placeholder?: string;
+}
+declare const FilterSlot: FC<FilterSlotProps>;
+export default FilterSlot;

package/lib/filter/components/FilterSlot.js

@@ -0,0 +1,174 @@
+"use strict";
+"use client";
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _theme = _interopRequireDefault(require("../../theme"));
+var _useControlledState = require("../hooks/useControlledState");
+var _FilterContext = require("../FilterContext");
+var _useFilterCollapsed = require("../hooks/useFilterCollapsed");
+var _useFilterTooltip = require("../hooks/useFilterTooltip");
+var _style = _interopRequireWildcard(require("../style"));
+var _utils = require("../utils");
+var _FilterButton = _interopRequireDefault(require("./FilterButton"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const FilterSlot = ({
+  children,
+  dropdownRender,
+  value,
+  defaultValue,
+  onChange,
+  formatValue,
+  placeholder,
+  icon,
+  label,
+  bordered = true,
+  loading = false,
+  _isCollapsed = false,
+  ...restProps
+}) => {
+  const isCollapsed = (0, _useFilterCollapsed.useFilterCollapsed)(_isCollapsed);
+  const {
+    token
+  } = _theme.default.useToken();
+  const {
+    prefixCls
+  } = (0, _style.default)();
+  const filterButtonRef = (0, _react.useRef)(null);
+  const {
+    updateFilterValue
+  } = (0, _FilterContext.useFilterContext)();
+  const filterId = (0, _react.useMemo)(() => (0, _utils.generateFilterId)('slot', label), [label]);
+  const {
+    onOpenChange: externalOnOpenChange,
+    ...filterButtonProps
+  } = restProps;
+  const [currentValue, setValue] = (0, _useControlledState.useControlledState)(value, defaultValue, onChange);
+  const hasValue = currentValue !== undefined && currentValue !== null && currentValue !== '';
+  const formattedText = hasValue && formatValue ? formatValue(currentValue) : '';
+  const displayText = hasValue ? formattedText || String(currentValue) : '';
+  const currentLabel = hasValue && displayText ? displayText : label;
+  const isDirectRender = !dropdownRender;
+  const {
+    onPopoverOpenChange,
+    wrapWithTooltip
+  } = (0, _useFilterTooltip.useFilterTooltip)({
+    hasValue,
+    label,
+    content: displayText || null,
+    disabled: isCollapsed || isDirectRender
+  });
+  const handlePopoverOpenChange = open => {
+    onPopoverOpenChange(open);
+    externalOnOpenChange?.(open);
+  };
+  (0, _react.useEffect)(() => {
+    if (isCollapsed && updateFilterValue) {
+      updateFilterValue(filterId, label, currentValue, [{
+        formattedText
+      }], 'slot');
+    }
+  }, [isCollapsed, updateFilterValue, filterId, label, currentValue, formattedText]);
+  const handleClear = () => {
+    setValue(undefined);
+  };
+  const handleChildChange = (0, _react.useCallback)((...args) => {
+    const firstArg = args[0];
+    let newValue;
+    if (firstArg && typeof firstArg === 'object' && 'target' in firstArg && typeof firstArg.target === 'object') {
+      newValue = 'value' in firstArg.target ? firstArg.target.value : firstArg.target.checked;
+    } else {
+      newValue = firstArg;
+    }
+    setValue(newValue);
+  }, [setValue]);
+  const injectValueProps = (0, _react.useCallback)(element => {
+    if ( /*#__PURE__*/(0, _react.isValidElement)(element)) {
+      const childElement = element;
+      const originalOnChange = childElement.props?.onChange;
+      return /*#__PURE__*/_react.default.cloneElement(childElement, {
+        value: currentValue,
+        onChange: (...args) => {
+          handleChildChange(...args);
+          originalOnChange?.(...args);
+        }
+      });
+    }
+    return element;
+  }, [currentValue, handleChildChange]);
+
+  // ======== 直接渲染模式（仅 children，无 dropdownRender） ========
+  if (isDirectRender) {
+    if (isCollapsed) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        style: {
+          paddingBlock: token.paddingXXS
+        },
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          style: {
+            marginBottom: 8
+          },
+          children: label
+        }), injectValueProps(children)]
+      });
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: injectValueProps(children)
+    });
+  }
+
+  // ======== Popover 模式（设置了 dropdownRender） ========
+  const wrappedContent = (0, _utils.wrapContent)(injectValueProps(dropdownRender));
+  if (isCollapsed) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      style: {
+        paddingBlock: token.paddingXXS
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        style: {
+          marginBottom: 8
+        },
+        children: label
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_FilterButton.default, {
+        ref: filterButtonRef,
+        icon: icon,
+        label: label,
+        bordered: bordered,
+        onClear: handleClear,
+        content: wrappedContent,
+        loading: loading,
+        selected: hasValue,
+        onOpenChange: handlePopoverOpenChange,
+        ...filterButtonProps,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: (0, _style.getFilterCls)(prefixCls, 'text-ellipsis'),
+          style: (0, _utils.getWrappedValueStyle)(hasValue),
+          children: hasValue ? displayText : placeholder || (0, _utils.getPlaceholder)()
+        })
+      })]
+    });
+  }
+  const filterButton = /*#__PURE__*/(0, _jsxRuntime.jsx)(_FilterButton.default, {
+    ref: filterButtonRef,
+    icon: icon,
+    label: label,
+    bordered: bordered,
+    onClear: handleClear,
+    content: wrappedContent,
+    loading: loading,
+    selected: hasValue,
+    onOpenChange: handlePopoverOpenChange,
+    ...filterButtonProps,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: (0, _style.getFilterCls)(prefixCls, 'text-ellipsis'),
+      children: hasValue ? currentLabel : placeholder || label
+    })
+  });
+  return wrapWithTooltip(filterButton);
+};
+var _default = exports.default = FilterSlot;

package/lib/filter/components/FilterWrap.js

@@ -142,6 +142,14 @@ const FilterWrap = ({
         {
           return String(value);
         }
+      case 'slot':
+        {
+          const slotMeta = options;
+          if (slotMeta?.[0]?.formattedText) {
+            return slotMeta[0].formattedText;
+          }
+          return String(value);
+        }
       default:
         {
           return String(value);

package/lib/filter/components/ResponsiveFilterGroup.js

@@ -180,6 +180,34 @@ const ResponsiveFilterGroup = ({
     setVisibleCount(prev => prev === count ? prev : count);
   }, [filterValues]);
 
+  // Effect 4: 监听子元素的宽度变化（如筛选值变化导致按钮变宽），
+  // 更新缓存宽度并重新计算可见数量。
+  // 依赖 visibleCount 以便在显隐切换后重新查询 DOM 元素。
+  (0, _react.useEffect)(() => {
+    if (!containerRef.current || isMeasuring) return;
+    const el = containerRef.current;
+    const items = el.querySelectorAll('[data-filter-item]');
+    if (items.length === 0) return;
+    const ro = new ResizeObserver(() => {
+      let widthChanged = false;
+      items.forEach(item => {
+        const idx = Number(item.dataset.filterItem);
+        if (isNaN(idx)) return;
+        const w = item.offsetWidth;
+        if (w > 0 && Math.abs(w - (cachedWidths.current[idx] || 0)) > 1) {
+          cachedWidths.current[idx] = w;
+          widthChanged = true;
+        }
+      });
+      if (widthChanged) {
+        const count = calculateRef.current(el.offsetWidth);
+        setVisibleCount(prev => prev === count ? prev : count);
+      }
+    });
+    items.forEach(item => ro.observe(item));
+    return () => ro.disconnect();
+  }, [isMeasuring, visibleCount]);
+
   // --- 派生状态 ---
   const visibleIndexSet = (0, _react.useMemo)(() => {
     if (visibleCount === null) return null;
@@ -317,9 +345,10 @@ const ResponsiveFilterGroup = ({
         filterValues: filterValues,
         updateFilterValue: updateFilterValue,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          "data-filter-item": isMeasuring ? index : undefined,
+          "data-filter-item": index,
           style: {
-            display
+            display,
+            flexShrink: 0
           },
           children: child
         })
@@ -345,6 +374,7 @@ const ResponsiveFilterGroup = ({
       flex: '1 1 auto',
       minWidth: 0,
       position: 'relative',
+      overflow: 'hidden',
       visibility: isMeasuring ? 'hidden' : undefined,
       ...style
     },

package/lib/filter/index.d.ts

@@ -7,6 +7,7 @@ export type { FilterCascaderProps, CascaderOption } from './components/FilterCas
 export type { FilterSwitchProps } from './components/FilterSwitch';
 export type { FilterRangeProps, RangeOption } from './components/FilterRange';
 export type { FilterInputProps } from './components/FilterInput';
+export type { FilterSlotProps } from './components/FilterSlot';
 export type { FilterWrapProps } from './components/FilterWrap';
 export type { ResponsiveFilterGroupProps } from './components/ResponsiveFilterGroup';
 declare const Filter: {
@@ -17,6 +18,7 @@ declare const Filter: {
     Cascader: import("react").FC<import("./components/FilterCascader/types").FilterCascaderProps>;
     Switch: import("react").FC<import("./components/FilterSwitch").FilterSwitchProps>;
     Input: import("react").FC<import("./components/FilterInput").FilterInputProps>;
+    Slot: import("react").FC<import("./components/FilterSlot").FilterSlotProps>;
     ResponsiveGroup: import("react").FC<import("./components/ResponsiveFilterGroup").ResponsiveFilterGroupProps>;
 };
 export default Filter;

package/lib/filter/index.js

@@ -21,6 +21,7 @@ var _FilterCheckbox = _interopRequireDefault(require("./components/FilterCheckbo
 var _FilterRange = _interopRequireDefault(require("./components/FilterRange"));
 var _FilterInput = _interopRequireDefault(require("./components/FilterInput"));
 var _FilterSelect = _interopRequireDefault(require("./components/FilterSelect"));
+var _FilterSlot = _interopRequireDefault(require("./components/FilterSlot"));
 var _FilterSwitch = _interopRequireDefault(require("./components/FilterSwitch"));
 var _FilterWrap = _interopRequireDefault(require("./components/FilterWrap"));
 var _ResponsiveFilterGroup = _interopRequireDefault(require("./components/ResponsiveFilterGroup"));
@@ -34,10 +35,11 @@ const Filter = {
   Select: markAsFilterComponent(_FilterSelect.default),
   Checkbox: markAsFilterComponent(_FilterCheckbox.default),
   Range: markAsFilterComponent(_FilterRange.default),
-  Wrap: _FilterWrap.default,
+  Wrap: markAsFilterComponent(_FilterWrap.default),
   Cascader: markAsFilterComponent(_index.default),
   Switch: markAsFilterComponent(_FilterSwitch.default),
   Input: markAsFilterComponent(_FilterInput.default),
+  Slot: markAsFilterComponent(_FilterSlot.default),
   ResponsiveGroup: _ResponsiveFilterGroup.default
 };
 var _default = exports.default = Filter;

package/lib/filter/style/index.js

@@ -199,7 +199,7 @@ const genFilterButtonStyle = token => {
       justifyContent: 'right',
       color: token.colorText,
       whiteSpace: 'nowrap',
-      maxWidth: '260px',
+      maxWidth: '268px',
       '&:hover': {
         [`${componentCls}-arrow-icon`]: {
           opacity: 0,

package/lib/filter/type.d.ts

@@ -21,6 +21,8 @@ export interface BaseFilterProps extends Omit<PopoverProps, 'title' | 'content'
     alwaysCollapse?: boolean;
     /** 是否显示后缀图标区域（包括下拉箭头和清除图标），默认 true */
     showSuffixIcon?: boolean;
+    /** 是否显示清除按钮，默认 true */
+    allowClear?: boolean;
 }
 /** 内部属性，用于标记组件是否在折叠模式中 */
 export interface InternalFilterProps {

package/lib/table/index.d.ts

@@ -38,8 +38,8 @@ declare const _default: (<RecordType extends AnyObject = AnyObject>(props: Table
     SELECTION_ALL: "SELECT_ALL";
     SELECTION_INVERT: "SELECT_INVERT";
     SELECTION_NONE: "SELECT_NONE";
-    Column: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType_1>) => null;
-    ColumnGroup: <RecordType_2 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_2>) => null;
+    Column: <RecordType extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType>) => null;
+    ColumnGroup: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_1>) => null;
     Summary: typeof Summary;
     useStyle: (prefixCls: string, rootCls?: string) => readonly [(node: ReactElement<any, string | React.JSXElementConstructor<any>>) => ReactElement<any, string | React.JSXElementConstructor<any>>, string, string];
     useDefaultPagination: (pagination?: false | import("antd").TablePaginationConfig) => false | import("antd").TablePaginationConfig;

package/lib/table/style/index.js

@@ -5,25 +5,33 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.genTableStyle = exports.default = void 0;
 var _cssinjs = require("@ant-design/cssinjs");
+var _style = require("antd/es/table/style");
 var _genComponentStyleHook = require("../../_util/genComponentStyleHook");
+/**
+ * 单元格是否与全局正文同档（`cellFontSize === token.fontSize`）。
+ */
+const isTableCellBodyFontScale = token => token.cellFontSize === token.fontSize;
+const getTableCellLineHeight = token => isTableCellBodyFontScale(token) ? token.lineHeight : token.lineHeightSM;
+const getTableEmbeddedControlHeight = token => isTableCellBodyFontScale(token) ? token.controlHeight : token.controlHeightSM;
 const genSmallBtnStyle = token => {
   const {
     antCls
   } = token;
+  const cellLineHeight = getTableCellLineHeight(token);
+  const controlH = getTableEmbeddedControlHeight(token);
   return {
-    // button is small size by default
     [`${antCls}-btn:not(${antCls}-btn-sm):not(${antCls}-btn-lg)`]: {
-      height: token.controlHeightSM,
-      fontSize: token.fontSizeSM,
-      lineHeight: token.lineHeightSM,
+      height: controlH,
+      fontSize: token.cellFontSize,
+      lineHeight: cellLineHeight,
       [`&:not(${antCls}-btn-icon-only):not(${antCls}-btn-circle)`]: {
         paddingInline: token.paddingXS
       },
       [`&${antCls}-btn-icon-only`]: {
-        width: token.controlHeightSM
+        width: controlH
       },
       [`&${antCls}-btn-circle`]: {
-        minWidth: token.controlHeightSM
+        minWidth: controlH
       }
     }
   };
@@ -46,11 +54,12 @@ const genTableStyle = token => {
     marginXS,
     calc
   } = token;
+  const cellLineHeight = getTableCellLineHeight(token);
+  const embeddedControlH = getTableEmbeddedControlHeight(token);
   return {
     // 表格通用样式
     [`${componentCls}-wrapper ${componentCls}`]: {
-      // to match fontSizeSM lineHeight
-      lineHeight: token.lineHeightSM,
+      lineHeight: cellLineHeight,
       color: colorText,
       backgroundColor: colorBgBase,
       borderRadius: borderRadiusLG,
@@ -137,8 +146,8 @@ const genTableStyle = token => {
           },
           a: {
             fontWeight: token.fontWeightStrong,
-            // work for ProTable link style
-            fontSize: token.fontSizeSM
+            // work for ProTable link style；与单元格字号一致
+            fontSize: token.cellFontSize
           }
         },
         ...genSmallBtnStyle(token),
@@ -418,7 +427,7 @@ const genTableStyle = token => {
     [`${componentCls}-wrapper`]: {
       [`${componentCls}-pagination`]: {
         [`&${antCls}-pagination`]: {
-          fontSize: token.fontSizeSM,
+          fontSize: token.cellFontSize,
           padding: `${(0, _cssinjs.unit)(token.paddingSM)} 0`,
           margin: 0,
           // 带边框和带内部边框的 Table，分页器右侧间距设为 token.marginLG
@@ -426,14 +435,14 @@ const genTableStyle = token => {
             marginInlineEnd: marginLG
           },
           [`${antCls}-pagination-item, ${antCls}-pagination-total-text, ${antCls}-pagination-prev, ${antCls}-pagination-next`]: {
-            height: token.controlHeightSM,
-            minWidth: token.controlHeightSM,
-            lineHeight: (0, _cssinjs.unit)(calc(token.controlHeightSM).sub(calc(token.lineWidth).mul(2)).equal())
+            height: embeddedControlH,
+            minWidth: embeddedControlH,
+            lineHeight: (0, _cssinjs.unit)(calc(embeddedControlH).sub(calc(token.lineWidth).mul(2)).equal())
           },
           [`${antCls}-pagination-options ${antCls}-select-single`]: {
-            height: token.controlHeightSM,
+            height: embeddedControlH,
             [`${antCls}-select-selector`]: {
-              fontSize: token.fontSizeSM,
+              fontSize: token.cellFontSize,
               paddingInline: calc(token.paddingXS).sub(token.lineWidth).equal()
             }
           }
@@ -465,7 +474,7 @@ const genTableStyle = token => {
     }
   };
 };
+
+// 经 genComponentStyleHook 注册为 ['Table','oceanbase']：合并 components.Table，且不与 antd 主 Table 样式钩子冲突。
 exports.genTableStyle = genTableStyle;
-var _default = exports.default = (0, _genComponentStyleHook.genStyleHooks)('Table', token => {
-  return [genTableStyle(token)];
-});
+var _default = exports.default = (0, _genComponentStyleHook.genStyleHooks)('Table', token => [genTableStyle(token)], _style.prepareComponentToken);