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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/design.min.js +1 -1
  2. package/es/_util/genComponentStyleHook.js +6 -2
  3. package/es/config-provider/index.d.ts +2 -0
  4. package/es/config-provider/index.js +68 -38
  5. package/es/filter/FilterContext.d.ts +1 -1
  6. package/es/filter/components/FilterButton.js +30 -7
  7. package/es/filter/components/FilterCascader/components/FlatCascaderContent/index.d.ts +4 -3
  8. package/es/filter/components/FilterCascader/components/FlatCascaderContent/index.js +20 -6
  9. package/es/filter/components/FilterCascader/components/NormalCascaderContent.js +2 -7
  10. package/es/filter/components/FilterInput.d.ts +2 -0
  11. package/es/filter/components/FilterInput.js +18 -4
  12. package/es/filter/components/FilterSlot.d.ts +28 -0
  13. package/es/filter/components/FilterSlot.js +189 -0
  14. package/es/filter/components/FilterWrap.js +9 -0
  15. package/es/filter/components/ResponsiveFilterGroup.js +38 -2
  16. package/es/filter/index.d.ts +2 -0
  17. package/es/filter/index.js +3 -1
  18. package/es/filter/style/index.js +1 -1
  19. package/es/filter/type.d.ts +2 -0
  20. package/es/table/index.d.ts +2 -2
  21. package/es/table/style/index.js +34 -16
  22. package/es/theme/default.d.ts +12 -0
  23. package/es/theme/default.js +27 -5
  24. package/lib/_util/genComponentStyleHook.js +6 -2
  25. package/lib/config-provider/index.d.ts +2 -0
  26. package/lib/config-provider/index.js +38 -2
  27. package/lib/filter/FilterContext.d.ts +1 -1
  28. package/lib/filter/components/FilterButton.js +22 -4
  29. package/lib/filter/components/FilterCascader/components/FlatCascaderContent/index.d.ts +4 -3
  30. package/lib/filter/components/FilterCascader/components/FlatCascaderContent/index.js +12 -5
  31. package/lib/filter/components/FilterCascader/components/NormalCascaderContent.js +2 -7
  32. package/lib/filter/components/FilterInput.d.ts +2 -0
  33. package/lib/filter/components/FilterInput.js +18 -3
  34. package/lib/filter/components/FilterSlot.d.ts +28 -0
  35. package/lib/filter/components/FilterSlot.js +174 -0
  36. package/lib/filter/components/FilterWrap.js +8 -0
  37. package/lib/filter/components/ResponsiveFilterGroup.js +32 -2
  38. package/lib/filter/index.d.ts +2 -0
  39. package/lib/filter/index.js +3 -1
  40. package/lib/filter/style/index.js +1 -1
  41. package/lib/filter/type.d.ts +2 -0
  42. package/lib/table/index.d.ts +2 -2
  43. package/lib/table/style/index.js +28 -19
  44. package/lib/theme/default.d.ts +12 -0
  45. package/lib/theme/default.js +29 -6
  46. package/package.json +2 -2
@@ -0,0 +1,189 @@
1
+ "use client";
2
+ var _excluded = ["children", "dropdownRender", "value", "defaultValue", "onChange", "formatValue", "placeholder", "icon", "label", "bordered", "loading", "_isCollapsed"],
3
+ _excluded2 = ["onOpenChange"];
4
+ 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; }
5
+ 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; }
6
+ 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; }
7
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
8
+ 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); }
9
+ 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); }
10
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
11
+ 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."); }
12
+ 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); }
13
+ 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; }
14
+ 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; } }
15
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
16
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
17
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
18
+ import React, { isValidElement, useCallback, useEffect, useMemo, useRef } from 'react';
19
+ import theme from "../../theme";
20
+ import { useControlledState } from "../hooks/useControlledState";
21
+ import { useFilterContext } from "../FilterContext";
22
+ import { useFilterCollapsed } from "../hooks/useFilterCollapsed";
23
+ import { useFilterTooltip } from "../hooks/useFilterTooltip";
24
+ import useFilterStyle, { getFilterCls } from "../style";
25
+ import { generateFilterId, getPlaceholder, getWrappedValueStyle, wrapContent } from "../utils";
26
+ import FilterButton from "./FilterButton";
27
+ import { jsx as _jsx } from "react/jsx-runtime";
28
+ import { jsxs as _jsxs } from "react/jsx-runtime";
29
+ import { Fragment as _Fragment } from "react/jsx-runtime";
30
+ var FilterSlot = function FilterSlot(_ref) {
31
+ var children = _ref.children,
32
+ dropdownRender = _ref.dropdownRender,
33
+ value = _ref.value,
34
+ defaultValue = _ref.defaultValue,
35
+ onChange = _ref.onChange,
36
+ formatValue = _ref.formatValue,
37
+ placeholder = _ref.placeholder,
38
+ icon = _ref.icon,
39
+ label = _ref.label,
40
+ _ref$bordered = _ref.bordered,
41
+ bordered = _ref$bordered === void 0 ? true : _ref$bordered,
42
+ _ref$loading = _ref.loading,
43
+ loading = _ref$loading === void 0 ? false : _ref$loading,
44
+ _ref$_isCollapsed = _ref._isCollapsed,
45
+ _isCollapsed = _ref$_isCollapsed === void 0 ? false : _ref$_isCollapsed,
46
+ restProps = _objectWithoutProperties(_ref, _excluded);
47
+ var isCollapsed = useFilterCollapsed(_isCollapsed);
48
+ var _theme$useToken = theme.useToken(),
49
+ token = _theme$useToken.token;
50
+ var _useFilterStyle = useFilterStyle(),
51
+ prefixCls = _useFilterStyle.prefixCls;
52
+ var filterButtonRef = useRef(null);
53
+ var _useFilterContext = useFilterContext(),
54
+ updateFilterValue = _useFilterContext.updateFilterValue;
55
+ var filterId = useMemo(function () {
56
+ return generateFilterId('slot', label);
57
+ }, [label]);
58
+ var externalOnOpenChange = restProps.onOpenChange,
59
+ filterButtonProps = _objectWithoutProperties(restProps, _excluded2);
60
+ var _useControlledState = useControlledState(value, defaultValue, onChange),
61
+ _useControlledState2 = _slicedToArray(_useControlledState, 2),
62
+ currentValue = _useControlledState2[0],
63
+ setValue = _useControlledState2[1];
64
+ var hasValue = currentValue !== undefined && currentValue !== null && currentValue !== '';
65
+ var formattedText = hasValue && formatValue ? formatValue(currentValue) : '';
66
+ var displayText = hasValue ? formattedText || String(currentValue) : '';
67
+ var currentLabel = hasValue && displayText ? displayText : label;
68
+ var isDirectRender = !dropdownRender;
69
+ var _useFilterTooltip = useFilterTooltip({
70
+ hasValue: hasValue,
71
+ label: label,
72
+ content: displayText || null,
73
+ disabled: isCollapsed || isDirectRender
74
+ }),
75
+ onPopoverOpenChange = _useFilterTooltip.onPopoverOpenChange,
76
+ wrapWithTooltip = _useFilterTooltip.wrapWithTooltip;
77
+ var handlePopoverOpenChange = function handlePopoverOpenChange(open) {
78
+ onPopoverOpenChange(open);
79
+ externalOnOpenChange === null || externalOnOpenChange === void 0 || externalOnOpenChange(open);
80
+ };
81
+ useEffect(function () {
82
+ if (isCollapsed && updateFilterValue) {
83
+ updateFilterValue(filterId, label, currentValue, [{
84
+ formattedText: formattedText
85
+ }], 'slot');
86
+ }
87
+ }, [isCollapsed, updateFilterValue, filterId, label, currentValue, formattedText]);
88
+ var handleClear = function handleClear() {
89
+ setValue(undefined);
90
+ };
91
+ var handleChildChange = useCallback(function () {
92
+ var firstArg = arguments.length <= 0 ? undefined : arguments[0];
93
+ var newValue;
94
+ if (firstArg && _typeof(firstArg) === 'object' && 'target' in firstArg && _typeof(firstArg.target) === 'object') {
95
+ newValue = 'value' in firstArg.target ? firstArg.target.value : firstArg.target.checked;
96
+ } else {
97
+ newValue = firstArg;
98
+ }
99
+ setValue(newValue);
100
+ }, [setValue]);
101
+ var injectValueProps = useCallback(function (element) {
102
+ if ( /*#__PURE__*/isValidElement(element)) {
103
+ var _childElement$props;
104
+ var childElement = element;
105
+ var originalOnChange = (_childElement$props = childElement.props) === null || _childElement$props === void 0 ? void 0 : _childElement$props.onChange;
106
+ return /*#__PURE__*/React.cloneElement(childElement, {
107
+ value: currentValue,
108
+ onChange: function onChange() {
109
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
110
+ args[_key] = arguments[_key];
111
+ }
112
+ handleChildChange.apply(void 0, args);
113
+ originalOnChange === null || originalOnChange === void 0 || originalOnChange.apply(void 0, args);
114
+ }
115
+ });
116
+ }
117
+ return element;
118
+ }, [currentValue, handleChildChange]);
119
+
120
+ // ======== 直接渲染模式(仅 children,无 dropdownRender) ========
121
+ if (isDirectRender) {
122
+ if (isCollapsed) {
123
+ return /*#__PURE__*/_jsxs("div", {
124
+ style: {
125
+ paddingBlock: token.paddingXXS
126
+ },
127
+ children: [/*#__PURE__*/_jsx("div", {
128
+ style: {
129
+ marginBottom: 8
130
+ },
131
+ children: label
132
+ }), injectValueProps(children)]
133
+ });
134
+ }
135
+ return /*#__PURE__*/_jsx(_Fragment, {
136
+ children: injectValueProps(children)
137
+ });
138
+ }
139
+
140
+ // ======== Popover 模式(设置了 dropdownRender) ========
141
+ var wrappedContent = wrapContent(injectValueProps(dropdownRender));
142
+ if (isCollapsed) {
143
+ return /*#__PURE__*/_jsxs("div", {
144
+ style: {
145
+ paddingBlock: token.paddingXXS
146
+ },
147
+ children: [/*#__PURE__*/_jsx("div", {
148
+ style: {
149
+ marginBottom: 8
150
+ },
151
+ children: label
152
+ }), /*#__PURE__*/_jsx(FilterButton, _objectSpread(_objectSpread({
153
+ ref: filterButtonRef,
154
+ icon: icon,
155
+ label: label,
156
+ bordered: bordered,
157
+ onClear: handleClear,
158
+ content: wrappedContent,
159
+ loading: loading,
160
+ selected: hasValue,
161
+ onOpenChange: handlePopoverOpenChange
162
+ }, filterButtonProps), {}, {
163
+ children: /*#__PURE__*/_jsx("span", {
164
+ className: getFilterCls(prefixCls, 'text-ellipsis'),
165
+ style: getWrappedValueStyle(hasValue),
166
+ children: hasValue ? displayText : placeholder || getPlaceholder()
167
+ })
168
+ }))]
169
+ });
170
+ }
171
+ var filterButton = /*#__PURE__*/_jsx(FilterButton, _objectSpread(_objectSpread({
172
+ ref: filterButtonRef,
173
+ icon: icon,
174
+ label: label,
175
+ bordered: bordered,
176
+ onClear: handleClear,
177
+ content: wrappedContent,
178
+ loading: loading,
179
+ selected: hasValue,
180
+ onOpenChange: handlePopoverOpenChange
181
+ }, filterButtonProps), {}, {
182
+ children: /*#__PURE__*/_jsx("span", {
183
+ className: getFilterCls(prefixCls, 'text-ellipsis'),
184
+ children: hasValue ? currentLabel : placeholder || label
185
+ })
186
+ }));
187
+ return wrapWithTooltip(filterButton);
188
+ };
189
+ export default FilterSlot;
@@ -167,6 +167,15 @@ var FilterWrap = function FilterWrap(_ref) {
167
167
  {
168
168
  return String(value);
169
169
  }
170
+ case 'slot':
171
+ {
172
+ var _slotMeta$;
173
+ var slotMeta = options;
174
+ if (slotMeta !== null && slotMeta !== void 0 && (_slotMeta$ = slotMeta[0]) !== null && _slotMeta$ !== void 0 && _slotMeta$.formattedText) {
175
+ return slotMeta[0].formattedText;
176
+ }
177
+ return String(value);
178
+ }
170
179
  default:
171
180
  {
172
181
  return String(value);
@@ -227,6 +227,40 @@ var ResponsiveFilterGroup = function ResponsiveFilterGroup(_ref) {
227
227
  });
228
228
  }, [filterValues]);
229
229
 
230
+ // Effect 4: 监听子元素的宽度变化(如筛选值变化导致按钮变宽),
231
+ // 更新缓存宽度并重新计算可见数量。
232
+ // 依赖 visibleCount 以便在显隐切换后重新查询 DOM 元素。
233
+ useEffect(function () {
234
+ if (!containerRef.current || isMeasuring) return;
235
+ var el = containerRef.current;
236
+ var items = el.querySelectorAll('[data-filter-item]');
237
+ if (items.length === 0) return;
238
+ var ro = new ResizeObserver(function () {
239
+ var widthChanged = false;
240
+ items.forEach(function (item) {
241
+ var idx = Number(item.dataset.filterItem);
242
+ if (isNaN(idx)) return;
243
+ var w = item.offsetWidth;
244
+ if (w > 0 && Math.abs(w - (cachedWidths.current[idx] || 0)) > 1) {
245
+ cachedWidths.current[idx] = w;
246
+ widthChanged = true;
247
+ }
248
+ });
249
+ if (widthChanged) {
250
+ var count = calculateRef.current(el.offsetWidth);
251
+ setVisibleCount(function (prev) {
252
+ return prev === count ? prev : count;
253
+ });
254
+ }
255
+ });
256
+ items.forEach(function (item) {
257
+ return ro.observe(item);
258
+ });
259
+ return function () {
260
+ return ro.disconnect();
261
+ };
262
+ }, [isMeasuring, visibleCount]);
263
+
230
264
  // --- 派生状态 ---
231
265
  var visibleIndexSet = useMemo(function () {
232
266
  if (visibleCount === null) return null;
@@ -377,9 +411,10 @@ var ResponsiveFilterGroup = function ResponsiveFilterGroup(_ref) {
377
411
  filterValues: filterValues,
378
412
  updateFilterValue: updateFilterValue,
379
413
  children: /*#__PURE__*/_jsx("div", {
380
- "data-filter-item": isMeasuring ? index : undefined,
414
+ "data-filter-item": index,
381
415
  style: {
382
- display: display
416
+ display: display,
417
+ flexShrink: 0
383
418
  },
384
419
  children: child
385
420
  })
@@ -405,6 +440,7 @@ var ResponsiveFilterGroup = function ResponsiveFilterGroup(_ref) {
405
440
  flex: '1 1 auto',
406
441
  minWidth: 0,
407
442
  position: 'relative',
443
+ overflow: 'hidden',
408
444
  visibility: isMeasuring ? 'hidden' : undefined
409
445
  }, style),
410
446
  children: [/*#__PURE__*/_jsx("div", {
@@ -7,6 +7,7 @@ export type { FilterCascaderProps, CascaderOption } from './components/FilterCas
7
7
  export type { FilterSwitchProps } from './components/FilterSwitch';
8
8
  export type { FilterRangeProps, RangeOption } from './components/FilterRange';
9
9
  export type { FilterInputProps } from './components/FilterInput';
10
+ export type { FilterSlotProps } from './components/FilterSlot';
10
11
  export type { FilterWrapProps } from './components/FilterWrap';
11
12
  export type { ResponsiveFilterGroupProps } from './components/ResponsiveFilterGroup';
12
13
  declare const Filter: {
@@ -17,6 +18,7 @@ declare const Filter: {
17
18
  Cascader: import("react").FC<import("./components/FilterCascader/types").FilterCascaderProps>;
18
19
  Switch: import("react").FC<import("./components/FilterSwitch").FilterSwitchProps>;
19
20
  Input: import("react").FC<import("./components/FilterInput").FilterInputProps>;
21
+ Slot: import("react").FC<import("./components/FilterSlot").FilterSlotProps>;
20
22
  ResponsiveGroup: import("react").FC<import("./components/ResponsiveFilterGroup").ResponsiveFilterGroupProps>;
21
23
  };
22
24
  export default Filter;
@@ -4,6 +4,7 @@ import Checkbox from "./components/FilterCheckbox";
4
4
  import Range from "./components/FilterRange";
5
5
  import Input from "./components/FilterInput";
6
6
  import Select from "./components/FilterSelect";
7
+ import Slot from "./components/FilterSlot";
7
8
  import Switch from "./components/FilterSwitch";
8
9
  import Wrap from "./components/FilterWrap";
9
10
  import ResponsiveGroup from "./components/ResponsiveFilterGroup";
@@ -16,10 +17,11 @@ var Filter = {
16
17
  Select: markAsFilterComponent(Select),
17
18
  Checkbox: markAsFilterComponent(Checkbox),
18
19
  Range: markAsFilterComponent(Range),
19
- Wrap: Wrap,
20
+ Wrap: markAsFilterComponent(Wrap),
20
21
  Cascader: markAsFilterComponent(Cascader),
21
22
  Switch: markAsFilterComponent(Switch),
22
23
  Input: markAsFilterComponent(Input),
24
+ Slot: markAsFilterComponent(Slot),
23
25
  ResponsiveGroup: ResponsiveGroup
24
26
  };
25
27
  export default Filter;
@@ -151,7 +151,7 @@ var genFilterButtonStyle = function genFilterButtonStyle(token) {
151
151
  justifyContent: 'right',
152
152
  color: token.colorText,
153
153
  whiteSpace: 'nowrap',
154
- maxWidth: '260px',
154
+ maxWidth: '268px',
155
155
  '&:hover': _defineProperty(_defineProperty({}, "".concat(componentCls, "-arrow-icon"), {
156
156
  opacity: 0,
157
157
  visibility: 'hidden'
@@ -21,6 +21,8 @@ export interface BaseFilterProps extends Omit<PopoverProps, 'title' | 'content'
21
21
  alwaysCollapse?: boolean;
22
22
  /** 是否显示后缀图标区域(包括下拉箭头和清除图标),默认 true */
23
23
  showSuffixIcon?: boolean;
24
+ /** 是否显示清除按钮,默认 true */
25
+ allowClear?: boolean;
24
26
  }
25
27
  /** 内部属性,用于标记组件是否在折叠模式中 */
26
28
  export interface InternalFilterProps {
@@ -38,8 +38,8 @@ declare const _default: (<RecordType extends AnyObject = AnyObject>(props: Table
38
38
  SELECTION_ALL: "SELECT_ALL";
39
39
  SELECTION_INVERT: "SELECT_INVERT";
40
40
  SELECTION_NONE: "SELECT_NONE";
41
- Column: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType_1>) => null;
42
- ColumnGroup: <RecordType_2 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_2>) => null;
41
+ Column: <RecordType extends import("antd/es/_util/type").AnyObject>(_: import("antd").TableColumnProps<RecordType>) => null;
42
+ ColumnGroup: <RecordType_1 extends import("antd/es/_util/type").AnyObject>(_: import("antd/es/table/ColumnGroup").ColumnGroupProps<RecordType_1>) => null;
43
43
  Summary: typeof Summary;
44
44
  useStyle: (prefixCls: string, rootCls?: string) => readonly [(node: ReactElement<any, string | React.JSXElementConstructor<any>>) => ReactElement<any, string | React.JSXElementConstructor<any>>, string, string];
45
45
  useDefaultPagination: (pagination?: false | import("antd").TablePaginationConfig) => false | import("antd").TablePaginationConfig;
@@ -5,19 +5,34 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
5
5
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
6
6
  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); }
7
7
  import { unit } from '@ant-design/cssinjs';
8
+ import { prepareComponentToken } from 'antd/es/table/style';
8
9
  import { genStyleHooks } from "../../_util/genComponentStyleHook";
10
+ /**
11
+ * 单元格是否与全局正文同档(`cellFontSize === token.fontSize`)。
12
+ */
13
+ var isTableCellBodyFontScale = function isTableCellBodyFontScale(token) {
14
+ return token.cellFontSize === token.fontSize;
15
+ };
16
+ var getTableCellLineHeight = function getTableCellLineHeight(token) {
17
+ return isTableCellBodyFontScale(token) ? token.lineHeight : token.lineHeightSM;
18
+ };
19
+ var getTableEmbeddedControlHeight = function getTableEmbeddedControlHeight(token) {
20
+ return isTableCellBodyFontScale(token) ? token.controlHeight : token.controlHeightSM;
21
+ };
9
22
  var genSmallBtnStyle = function genSmallBtnStyle(token) {
10
23
  var antCls = token.antCls;
24
+ var cellLineHeight = getTableCellLineHeight(token);
25
+ var controlH = getTableEmbeddedControlHeight(token);
11
26
  return _defineProperty({}, "".concat(antCls, "-btn:not(").concat(antCls, "-btn-sm):not(").concat(antCls, "-btn-lg)"), _defineProperty(_defineProperty(_defineProperty({
12
- height: token.controlHeightSM,
13
- fontSize: token.fontSizeSM,
14
- lineHeight: token.lineHeightSM
27
+ height: controlH,
28
+ fontSize: token.cellFontSize,
29
+ lineHeight: cellLineHeight
15
30
  }, "&:not(".concat(antCls, "-btn-icon-only):not(").concat(antCls, "-btn-circle)"), {
16
31
  paddingInline: token.paddingXS
17
32
  }), "&".concat(antCls, "-btn-icon-only"), {
18
- width: token.controlHeightSM
33
+ width: controlH
19
34
  }), "&".concat(antCls, "-btn-circle"), {
20
- minWidth: token.controlHeightSM
35
+ minWidth: controlH
21
36
  }));
22
37
  };
23
38
  export var genTableStyle = function genTableStyle(token) {
@@ -37,9 +52,10 @@ export var genTableStyle = function genTableStyle(token) {
37
52
  marginLG = token.marginLG,
38
53
  marginXS = token.marginXS,
39
54
  calc = token.calc;
55
+ var cellLineHeight = getTableCellLineHeight(token);
56
+ var embeddedControlH = getTableEmbeddedControlHeight(token);
40
57
  return _ref2 = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref2, "".concat(componentCls, "-wrapper ").concat(componentCls), _defineProperty(_defineProperty(_defineProperty({
41
- // to match fontSizeSM lineHeight
42
- lineHeight: token.lineHeightSM,
58
+ lineHeight: cellLineHeight,
43
59
  color: colorText,
44
60
  backgroundColor: colorBgBase,
45
61
  borderRadius: borderRadiusLG
@@ -91,8 +107,8 @@ export var genTableStyle = function genTableStyle(token) {
91
107
  backgroundColor: colorBgBase
92
108
  }), "a", {
93
109
  fontWeight: token.fontWeightStrong,
94
- // work for ProTable link style
95
- fontSize: token.fontSizeSM
110
+ // work for ProTable link style;与单元格字号一致
111
+ fontSize: token.cellFontSize
96
112
  })), genSmallBtnStyle(token)), {}, _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-placeholder td"), {}), "".concat(componentCls, "-empty-wrapper"), {
97
113
  minHeight: calc(360).sub(calc(token.paddingXS).mul(2).equal()).equal(),
98
114
  display: 'flex',
@@ -182,19 +198,19 @@ export var genTableStyle = function genTableStyle(token) {
182
198
  // hide empty when Table loading
183
199
  visibility: 'hidden'
184
200
  }))), "".concat(componentCls, "-wrapper"), _defineProperty({}, "".concat(componentCls, "-pagination"), _defineProperty(_defineProperty({}, "&".concat(antCls, "-pagination"), _defineProperty(_defineProperty(_defineProperty({
185
- fontSize: token.fontSizeSM,
201
+ fontSize: token.cellFontSize,
186
202
  padding: "".concat(unit(token.paddingSM), " 0"),
187
203
  margin: 0
188
204
  }, "".concat(componentCls, "-wrapper").concat(componentCls, "-has-bordered &"), {
189
205
  marginInlineEnd: marginLG
190
206
  }), "".concat(antCls, "-pagination-item, ").concat(antCls, "-pagination-total-text, ").concat(antCls, "-pagination-prev, ").concat(antCls, "-pagination-next"), {
191
- height: token.controlHeightSM,
192
- minWidth: token.controlHeightSM,
193
- lineHeight: unit(calc(token.controlHeightSM).sub(calc(token.lineWidth).mul(2)).equal())
207
+ height: embeddedControlH,
208
+ minWidth: embeddedControlH,
209
+ lineHeight: unit(calc(embeddedControlH).sub(calc(token.lineWidth).mul(2)).equal())
194
210
  }), "".concat(antCls, "-pagination-options ").concat(antCls, "-select-single"), _defineProperty({
195
- height: token.controlHeightSM
211
+ height: embeddedControlH
196
212
  }, "".concat(antCls, "-select-selector"), {
197
- fontSize: token.fontSizeSM,
213
+ fontSize: token.cellFontSize,
198
214
  paddingInline: calc(token.paddingXS).sub(token.lineWidth).equal()
199
215
  }))), "".concat(componentCls, "-batch-operation-bar"), _objectSpread(_defineProperty({
200
216
  position: 'absolute',
@@ -207,6 +223,8 @@ export var genTableStyle = function genTableStyle(token) {
207
223
  minHeight: 'auto'
208
224
  })));
209
225
  };
226
+
227
+ // 经 genComponentStyleHook 注册为 ['Table','oceanbase']:合并 components.Table,且不与 antd 主 Table 样式钩子冲突。
210
228
  export default genStyleHooks('Table', function (token) {
211
229
  return [genTableStyle(token)];
212
- });
230
+ }, prepareComponentToken);
@@ -46,5 +46,17 @@ export declare const fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Op
46
46
  export declare const fontWeightWeakEn = 300;
47
47
  export declare const fontWeightEn = 500;
48
48
  export declare const fontWeightStrongEn = 600;
49
+ /** 正文字号(非 Cn),与 token.fontSize 一致;命名对齐 fontFamilyEn / fontWeightEn */
50
+ export declare const fontSizeEn = 13;
51
+ /** Table 单元格字号(非 Cn),与 components.Table.cellFontSize 默认值一致 */
52
+ export declare const tableCellFontSizeEn = 12;
53
+ /** Cn 正文/表内字号补丁(由 config-provider `getLocaleFontSizeThemePatch` 消费) */
54
+ export declare const fontSizeCn = 14;
55
+ export declare const fontHeightCn = 22;
56
+ export declare const lineHeightCn: number;
49
57
  declare const _default: import("antd").ThemeConfig;
50
58
  export default _default;
59
+ /**
60
+ * Whether the BCP 47 locale should use Cn typography sizing (14px body + table cells; zh/ja/ko).
61
+ */
62
+ export declare function isCnLikeLocale(locale: string | undefined): boolean;
@@ -89,6 +89,17 @@ export var fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans',
89
89
  export var fontWeightWeakEn = 300;
90
90
  export var fontWeightEn = 500;
91
91
  export var fontWeightStrongEn = 600;
92
+
93
+ /** 正文字号(非 Cn),与 token.fontSize 一致;命名对齐 fontFamilyEn / fontWeightEn */
94
+ export var fontSizeEn = 13;
95
+
96
+ /** Table 单元格字号(非 Cn),与 components.Table.cellFontSize 默认值一致 */
97
+ export var tableCellFontSizeEn = fontSizeSM;
98
+
99
+ /** Cn 正文/表内字号补丁(由 config-provider `getLocaleFontSizeThemePatch` 消费) */
100
+ export var fontSizeCn = 14;
101
+ export var fontHeightCn = 22;
102
+ export var lineHeightCn = fontHeightCn / fontSizeCn;
92
103
  var lineHeightSM = 20 / 12;
93
104
  var defaultTheme = {
94
105
  token: {
@@ -102,9 +113,9 @@ var defaultTheme = {
102
113
  borderRadiusMD: borderRadiusMD,
103
114
  borderRadiusLG: borderRadiusLG,
104
115
  fontSizeSM: fontSizeSM,
105
- fontSize: 13,
116
+ fontSize: fontSizeEn,
106
117
  lineHeightSM: lineHeightSM,
107
- lineHeight: 20 / 13,
118
+ lineHeight: 20 / fontSizeEn,
108
119
  lineHeightLG: 24 / 16,
109
120
  fontHeight: 20,
110
121
  fontSizeLG: 16,
@@ -112,12 +123,12 @@ var defaultTheme = {
112
123
  fontSizeHeading2: 20,
113
124
  fontSizeHeading3: 18,
114
125
  fontSizeHeading4: 16,
115
- fontSizeHeading5: 13,
126
+ fontSizeHeading5: fontSizeEn,
116
127
  lineHeightHeading1: 32 / 24,
117
128
  lineHeightHeading2: 28 / 20,
118
129
  lineHeightHeading3: 26 / 18,
119
130
  lineHeightHeading4: 24 / 16,
120
- lineHeightHeading5: 20 / 13,
131
+ lineHeightHeading5: 20 / fontSizeEn,
121
132
  controlHeightSM: 24,
122
133
  controlHeight: 28,
123
134
  colorLinkHover: blue5,
@@ -443,4 +454,15 @@ defaultTheme.token = _objectSpread(_objectSpread({}, defaultTheme.token), {}, {
443
454
  yellow: defaultTheme === null || defaultTheme === void 0 || (_defaultTheme$token3 = defaultTheme.token) === null || _defaultTheme$token3 === void 0 ? void 0 : _defaultTheme$token3.colorWarning,
444
455
  red: defaultTheme === null || defaultTheme === void 0 || (_defaultTheme$token4 = defaultTheme.token) === null || _defaultTheme$token4 === void 0 ? void 0 : _defaultTheme$token4.colorError
445
456
  });
446
- export default formatTheme(defaultTheme);
457
+ export default formatTheme(defaultTheme);
458
+
459
+ /**
460
+ * Whether the BCP 47 locale should use Cn typography sizing (14px body + table cells; zh/ja/ko).
461
+ */
462
+ export function isCnLikeLocale(locale) {
463
+ if (locale == null || locale === '') {
464
+ return false;
465
+ }
466
+ var primary = String(locale).toLowerCase().replace(/_/g, '-').split('-')[0];
467
+ return primary === 'zh' || primary === 'ja' || primary === 'ko';
468
+ }
@@ -33,8 +33,12 @@ exports.genSelectCommonStyle = genSelectCommonStyle;
33
33
  function genStyleHooks(componentName, styleFn, getDefaultToken, options) {
34
34
  const normalizedComponentName = Array.isArray(componentName) ? componentName[0] : componentName;
35
35
 
36
- // Create the component name with OB- prefix
37
- const obComponentName = Array.isArray(componentName) ? [`OB-${normalizedComponentName}`, componentName[1]] : `OB-${normalizedComponentName}`;
36
+ /**
37
+ * 使用 [Component, subName] 注册,第一维与 antd 一致以便合并 `theme.components[Component]`(如 Table.cellFontSize);
38
+ * 第二维与 antd 默认样式区分,避免覆盖/顶替同组件的主样式钩子。
39
+ */
40
+ const OCEANBASE_SUB_STYLE = 'oceanbase';
41
+ const obComponentName = Array.isArray(componentName) ? [normalizedComponentName, `${OCEANBASE_SUB_STYLE}-${componentName[1]}`] : [normalizedComponentName, OCEANBASE_SUB_STYLE];
38
42
  return (0, _internal.genStyleHooks)(obComponentName, token => {
39
43
  const styles = [];
40
44
 
@@ -63,5 +63,7 @@ export type ConfigProviderType = React.FC<ConfigProviderProps> & {
63
63
  config: typeof AntConfigProvider.config;
64
64
  useConfig: typeof AntConfigProvider.useConfig;
65
65
  };
66
+ /** Cn 字号补丁(正文 + Table 单元格),供单测与 ConfigProvider 共用。 */
67
+ export declare function getLocaleFontSizeThemePatch(mergedLocale: Locale, mergedTheme: ThemeConfig, resolvedFontSize: number | undefined): ThemeConfig;
66
68
  declare const ConfigProvider: ConfigProviderType;
67
69
  export default ConfigProvider;
@@ -3,8 +3,11 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- var _exportNames = {};
6
+ var _exportNames = {
7
+ getLocaleFontSizeThemePatch: true
8
+ };
7
9
  exports.default = void 0;
10
+ exports.getLocaleFontSizeThemePatch = getLocaleFontSizeThemePatch;
8
11
  var _react = _interopRequireDefault(require("react"));
9
12
  var _antd = require("antd");
10
13
  var _cssinjs = require("@ant-design/cssinjs");
@@ -90,6 +93,7 @@ const ExtendedConfigContext = /*#__PURE__*/_react.default.createContext({
90
93
  hideOnSinglePage: false,
91
94
  injectStaticFunction: true
92
95
  });
96
+ /** `en` / `en-gb` → `tokenValueEn`(与 `fontFamilyEn` 等一致)。 */
93
97
  const getLocaleTokenValue = (mergedThemeToken, locale, tokenKey, tokenValue, tokenValueEn) => {
94
98
  return tokenValue !== mergedThemeToken[tokenKey] ? {
95
99
  [tokenKey]: tokenValue
@@ -97,6 +101,37 @@ const getLocaleTokenValue = (mergedThemeToken, locale, tokenKey, tokenValue, tok
97
101
  [tokenKey]: tokenValueEn
98
102
  } : {};
99
103
  };
104
+
105
+ /** Cn(zh/ja/ko)且仍为拉丁基线 `tokenValueEn` 时 → `tokenValueCn`,结构上与 {@link getLocaleTokenValue} 对称。 */
106
+ const getLocaleTokenValueCn = (mergedThemeToken, locale, tokenKey, tokenValue, tokenValueEn, tokenValueCn) => {
107
+ return tokenValue !== mergedThemeToken[tokenKey] ? {
108
+ [tokenKey]: tokenValue
109
+ } : (0, _default2.isCnLikeLocale)(locale.locale) && (tokenValue === undefined || tokenValue === tokenValueEn) ? {
110
+ [tokenKey]: tokenValueCn
111
+ } : {};
112
+ };
113
+
114
+ /** Cn 字号补丁(正文 + Table 单元格),供单测与 ConfigProvider 共用。 */
115
+ function getLocaleFontSizeThemePatch(mergedLocale, mergedTheme, resolvedFontSize) {
116
+ const tokenPatch = getLocaleTokenValueCn(mergedTheme.token ?? {}, mergedLocale, 'fontSize', resolvedFontSize, _default2.fontSizeEn, _default2.fontSizeCn);
117
+ const patch = {};
118
+ if ('fontSize' in tokenPatch && tokenPatch.fontSize !== undefined) {
119
+ patch.token = {
120
+ fontSize: tokenPatch.fontSize,
121
+ lineHeight: _default2.lineHeightCn,
122
+ fontHeight: _default2.fontHeightCn
123
+ };
124
+ }
125
+ const cellFs = mergedTheme.components?.Table?.cellFontSize;
126
+ if ((cellFs === undefined || cellFs === _default2.tableCellFontSizeEn) && (0, _default2.isCnLikeLocale)(mergedLocale.locale)) {
127
+ patch.components = {
128
+ Table: {
129
+ cellFontSize: _default2.fontSizeCn
130
+ }
131
+ };
132
+ }
133
+ return patch;
134
+ }
100
135
  const ConfigProvider = ({
101
136
  children,
102
137
  theme,
@@ -142,6 +177,7 @@ const ConfigProvider = ({
142
177
  token
143
178
  } = _theme.default.useToken();
144
179
  const fontFamily = mergedTheme.token?.fontFamily || token.fontFamily;
180
+ const fontSize = mergedTheme.token?.fontSize ?? token.fontSize;
145
181
  const fontWeightWeak = mergedTheme.token?.fontWeightWeak || token.fontWeightWeak;
146
182
  const fontWeight = mergedTheme.token?.fontWeight || token.fontWeight;
147
183
  const fontWeightStrong = mergedTheme.token?.fontWeightStrong || token.fontWeightStrong;
@@ -186,7 +222,7 @@ const ConfigProvider = ({
186
222
  }
187
223
  }, parentContext.table, table),
188
224
  tabs: (0, _lodash.merge)({}, parentContext.tabs, tabs),
189
- theme: (0, _lodash.merge)({}, mergedTheme, {
225
+ theme: (0, _lodash.merge)({}, mergedTheme, getLocaleFontSizeThemePatch(mergedLocale, mergedTheme, fontSize), {
190
226
  token: {
191
227
  ...getLocaleTokenValue(mergedTheme.token || {}, mergedLocale, 'fontFamily', fontFamily, _default2.fontFamilyEn),
192
228
  ...getLocaleTokenValue(mergedTheme.token || {}, mergedLocale, 'fontWeightWeak', fontWeightWeak, _default2.fontWeightWeakEn),
@@ -1,5 +1,5 @@
1
1
  import type { FC, ReactNode } from 'react';
2
- export type FilterComponentName = 'select' | 'checkbox' | 'cascader' | 'switch' | 'range' | 'input';
2
+ export type FilterComponentName = 'select' | 'checkbox' | 'cascader' | 'switch' | 'range' | 'input' | 'slot';
3
3
  export type FilterValue = string | string[] | string[][] | boolean | [any, any] | null | undefined;
4
4
  export interface FilterValueItem {
5
5
  id: string;