@canvas-components/react-list-table 0.3.12 → 0.3.13

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.
package/dist/index.d.cts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as react from 'react';
2
2
  import { CSSProperties, ReactNode, ForwardedRef, PropsWithChildren } from 'react';
3
- import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions } from '@canvas-components/list-table';
3
+ import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions, EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN } from '@canvas-components/list-table';
4
+ export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
4
5
 
5
6
  interface ReactListTableScrollConfig {
6
7
  x?: number | string | true;
@@ -54,6 +55,8 @@ interface ReactListTableRef<RecordType = Record<string, unknown>> {
54
55
  getDebugSnapshot: () => ReturnType<ListTable<RecordType>["getDebugSnapshot"]>;
55
56
  resetSorter: () => void;
56
57
  resetFilter: () => void;
58
+ /** 人工重试最近一次仍有效的本地查询失败。 */
59
+ retryQuery: () => boolean;
57
60
  }
58
61
  /**
59
62
  * antd Table 风格的 props 类型别名。
@@ -84,9 +87,15 @@ type ReactListTableQuery<RecordType = Record<string, unknown>> = ListTableQueryO
84
87
  * ListTable 的 React 宿主组件。
85
88
  */
86
89
  declare function ReactListTableInner<RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType>, ref: ForwardedRef<ReactListTableRef<RecordType>>): react.JSX.Element;
87
- declare const ReactListTable: <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
88
- ref?: ForwardedRef<ReactListTableRef<RecordType>>;
89
- }) => ReturnType<typeof ReactListTableInner>;
90
+ interface ReactListTableComponent {
91
+ <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
92
+ ref?: ForwardedRef<ReactListTableRef<RecordType>>;
93
+ }): ReturnType<typeof ReactListTableInner>;
94
+ EXPAND_COLUMN: typeof EXPAND_COLUMN;
95
+ SELECTION_COLUMN: typeof SELECTION_COLUMN;
96
+ ROW_SELECTION_COLUMN: typeof ROW_SELECTION_COLUMN;
97
+ }
98
+ declare const ReactListTable: ReactListTableComponent;
90
99
 
91
100
  /** ReactListTable 调试模式上下文属性。 */
92
101
  interface ReactListTableDebugProviderProps extends PropsWithChildren {
package/dist/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as react from 'react';
2
2
  import { CSSProperties, ReactNode, ForwardedRef, PropsWithChildren } from 'react';
3
- import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions } from '@canvas-components/list-table';
3
+ import { ListTableOptions, ListTableQueryChange, ListTableExportXlsxOptions, ListTableScrollToOptions, ListTable, ListTableColumn, ListTablePaginationOptions, ListTableQueryOptions, ListTableRowSelectionOptions, EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN } from '@canvas-components/list-table';
4
+ export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
4
5
 
5
6
  interface ReactListTableScrollConfig {
6
7
  x?: number | string | true;
@@ -54,6 +55,8 @@ interface ReactListTableRef<RecordType = Record<string, unknown>> {
54
55
  getDebugSnapshot: () => ReturnType<ListTable<RecordType>["getDebugSnapshot"]>;
55
56
  resetSorter: () => void;
56
57
  resetFilter: () => void;
58
+ /** 人工重试最近一次仍有效的本地查询失败。 */
59
+ retryQuery: () => boolean;
57
60
  }
58
61
  /**
59
62
  * antd Table 风格的 props 类型别名。
@@ -84,9 +87,15 @@ type ReactListTableQuery<RecordType = Record<string, unknown>> = ListTableQueryO
84
87
  * ListTable 的 React 宿主组件。
85
88
  */
86
89
  declare function ReactListTableInner<RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType>, ref: ForwardedRef<ReactListTableRef<RecordType>>): react.JSX.Element;
87
- declare const ReactListTable: <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
88
- ref?: ForwardedRef<ReactListTableRef<RecordType>>;
89
- }) => ReturnType<typeof ReactListTableInner>;
90
+ interface ReactListTableComponent {
91
+ <RecordType = Record<string, unknown>>(props: ReactListTableProps<RecordType> & {
92
+ ref?: ForwardedRef<ReactListTableRef<RecordType>>;
93
+ }): ReturnType<typeof ReactListTableInner>;
94
+ EXPAND_COLUMN: typeof EXPAND_COLUMN;
95
+ SELECTION_COLUMN: typeof SELECTION_COLUMN;
96
+ ROW_SELECTION_COLUMN: typeof ROW_SELECTION_COLUMN;
97
+ }
98
+ declare const ReactListTable: ReactListTableComponent;
90
99
 
91
100
  /** ReactListTable 调试模式上下文属性。 */
92
101
  interface ReactListTableDebugProviderProps extends PropsWithChildren {
package/dist/index.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import { createContext, forwardRef, useMemo, useRef, useState, useImperativeHandle, useContext, useEffect, useLayoutEffect, Fragment as Fragment$1 } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
3
  import { ReactImagePreview, ReactNumberInput, ReactSelect, ReactPagination, ReactFilterPanel, ReactPopup, ReactModal, ReactInput, ReactPopconfirm, ReactContentScaleProvider, ReactInputNumber, ReactCheckbox, ReactAutoComplete, ReactColorPicker, ReactTimeRangePicker, ReactDateTimeRangePicker, ReactDateTimePicker, ReactTimePicker, ReactDateRangePicker, ReactDatePicker, ReactMonthPicker, ReactQuarterPicker, ReactYearPicker, ReactInputRange } from '@canvas-components/react-components';
4
- import { resetListTableStoredColumnConfig, ListTable } from '@canvas-components/list-table';
4
+ import { EXPAND_COLUMN, SELECTION_COLUMN, ROW_SELECTION_COLUMN, resetListTableStoredColumnConfig, ListTable } from '@canvas-components/list-table';
5
+ export { EXPAND_COLUMN, ROW_SELECTION_COLUMN, SELECTION_COLUMN } from '@canvas-components/list-table';
5
6
  import { formatDateTimeValue, isDateTimeFormatPattern } from '@canvas-components/utils/date';
6
7
  import { formatNumberValue, formatPercentValue, formatScientificValue, formatCustomNumberPattern } from '@canvas-components/utils/number';
7
8
  import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -438,7 +439,7 @@ function MenuAction(props) {
438
439
  );
439
440
  }
440
441
  function MenuSubmenu(props) {
441
- const { label, items, footer, children, minWidth = 220 } = props;
442
+ const { label, items, header, footer, children, minWidth = 220 } = props;
442
443
  const menuItems = items.filter((item) => item.onClick || item.disabled);
443
444
  const reserveSelectionIcon = menuItems.some(
444
445
  (item) => typeof item.selected === "boolean"
@@ -446,7 +447,7 @@ function MenuSubmenu(props) {
446
447
  const triggerRef = useRef(null);
447
448
  const [open, setOpen] = useState(false);
448
449
  const closeTimerRef = useRef(null);
449
- if (!menuItems.length && !footer && !children) {
450
+ if (!menuItems.length && !header && !footer && !children) {
450
451
  return null;
451
452
  }
452
453
  const clearCloseTimer = () => {
@@ -528,6 +529,7 @@ function MenuSubmenu(props) {
528
529
  scheduleClose();
529
530
  },
530
531
  children: [
532
+ header,
531
533
  menuItems.map((item) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
532
534
  item.separatorBefore ? /* @__PURE__ */ jsx(MenuDivider, {}) : null,
533
535
  /* @__PURE__ */ jsx(
@@ -1163,6 +1165,7 @@ function CustomSelectionRow(props) {
1163
1165
  }
1164
1166
  function SummaryMenu(props) {
1165
1167
  const { request } = props;
1168
+ const [title, setTitle] = useState(request.summaryTitle ?? "");
1166
1169
  const [precision, setPrecision] = useState(
1167
1170
  request.summaryPrecision ?? null
1168
1171
  );
@@ -1173,11 +1176,13 @@ function SummaryMenu(props) {
1173
1176
  request.summaryPreserveTrailingZeros ?? false
1174
1177
  );
1175
1178
  useEffect(() => {
1179
+ setTitle(request.summaryTitle ?? "");
1176
1180
  setPrecision(request.summaryPrecision ?? null);
1177
1181
  setRoundingMode(request.summaryRoundingMode ?? "round");
1178
1182
  setPreserveTrailingZeros(request.summaryPreserveTrailingZeros ?? false);
1179
1183
  }, [
1180
1184
  request.summaryColumnKey,
1185
+ request.summaryTitle,
1181
1186
  request.summaryPrecision,
1182
1187
  request.summaryRoundingMode,
1183
1188
  request.summaryPreserveTrailingZeros
@@ -1200,12 +1205,49 @@ function SummaryMenu(props) {
1200
1205
  {
1201
1206
  label: "\u6C47\u603B\u65B9\u5F0F",
1202
1207
  minWidth: 268,
1203
- items: summaryTypes.map((item) => ({
1204
- key: item.key,
1205
- label: item.label,
1206
- selected: request.summaryType === item.value,
1207
- onClick: () => request.onChangeSummaryType?.(item.value)
1208
- })),
1208
+ header: request.onChangeSummaryTitle ? /* @__PURE__ */ jsxs(
1209
+ "div",
1210
+ {
1211
+ style: {
1212
+ display: "grid",
1213
+ gridTemplateColumns: "56px 1fr",
1214
+ gap: 8,
1215
+ alignItems: "center",
1216
+ padding: "2px 10px 10px",
1217
+ marginBottom: 4,
1218
+ borderBottom: "1px solid #e5e7eb"
1219
+ },
1220
+ children: [
1221
+ /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontSize: 14 }, children: "\u6807\u9898\uFF1A" }),
1222
+ /* @__PURE__ */ jsx(
1223
+ ReactInput,
1224
+ {
1225
+ value: title,
1226
+ placeholder: "\u8BF7\u8F93\u5165\u6807\u9898",
1227
+ onChange: (event) => {
1228
+ const value = event.target.value;
1229
+ setTitle(value);
1230
+ request.onChangeSummaryTitle?.(value);
1231
+ }
1232
+ }
1233
+ )
1234
+ ]
1235
+ }
1236
+ ) : void 0,
1237
+ items: [
1238
+ ...summaryTypes.map((item) => ({
1239
+ key: item.key,
1240
+ label: item.label,
1241
+ selected: request.summaryType === item.value,
1242
+ onClick: () => request.onChangeSummaryType?.(item.value)
1243
+ })),
1244
+ {
1245
+ key: "clear-summary",
1246
+ label: "\u53D6\u6D88\u6C47\u603B",
1247
+ separatorBefore: true,
1248
+ onClick: request.onClearSummary
1249
+ }
1250
+ ],
1209
1251
  footer: request.onChangeSummaryPrecision || request.onChangeSummaryRoundingMode || request.onChangeSummaryPreserveTrailingZeros ? /* @__PURE__ */ jsxs(
1210
1252
  "div",
1211
1253
  {
@@ -3829,6 +3871,7 @@ function ReactListTableInner(props, ref) {
3829
3871
  rowKey,
3830
3872
  columns,
3831
3873
  dataSource,
3874
+ loading,
3832
3875
  onRow,
3833
3876
  theme,
3834
3877
  striped,
@@ -3840,6 +3883,7 @@ function ReactListTableInner(props, ref) {
3840
3883
  summaryRowHeight,
3841
3884
  overscanRowCount,
3842
3885
  query,
3886
+ experimental,
3843
3887
  rowSelector,
3844
3888
  rowSelection,
3845
3889
  expandable,
@@ -3899,6 +3943,7 @@ function ReactListTableInner(props, ref) {
3899
3943
  rowKey,
3900
3944
  columns: resolvedColumns,
3901
3945
  dataSource,
3946
+ loading,
3902
3947
  onRow,
3903
3948
  theme,
3904
3949
  striped,
@@ -3910,6 +3955,7 @@ function ReactListTableInner(props, ref) {
3910
3955
  summaryRowHeight: resolvedSummaryRowHeight,
3911
3956
  overscanRowCount,
3912
3957
  query,
3958
+ experimental,
3913
3959
  rowSelector,
3914
3960
  rowSelection,
3915
3961
  expandable,
@@ -3948,6 +3994,7 @@ function ReactListTableInner(props, ref) {
3948
3994
  rowKey,
3949
3995
  resolvedColumns,
3950
3996
  dataSource,
3997
+ loading,
3951
3998
  onRow,
3952
3999
  theme,
3953
4000
  striped,
@@ -3959,6 +4006,7 @@ function ReactListTableInner(props, ref) {
3959
4006
  resolvedSummaryRowHeight,
3960
4007
  overscanRowCount,
3961
4008
  query,
4009
+ experimental,
3962
4010
  rowSelector,
3963
4011
  rowSelection,
3964
4012
  expandable,
@@ -3991,9 +4039,7 @@ function ReactListTableInner(props, ref) {
3991
4039
  closeDangerConfirmRequest
3992
4040
  } = useReactListTableState(options);
3993
4041
  const hasPagination = paginationConfig != null;
3994
- const paginationLayout = resolveReactListTablePaginationLayout(
3995
- resolvedRowHeight
3996
- );
4042
+ const paginationLayout = resolveReactListTablePaginationLayout(resolvedRowHeight);
3997
4043
  useImperativeHandle(
3998
4044
  ref,
3999
4045
  () => ({
@@ -4010,7 +4056,8 @@ function ReactListTableInner(props, ref) {
4010
4056
  },
4011
4057
  resetFilter: () => {
4012
4058
  tableRef.current?.resetFilter();
4013
- }
4059
+ },
4060
+ retryQuery: () => tableRef.current?.retryQuery() ?? false
4014
4061
  }),
4015
4062
  []
4016
4063
  );
@@ -4123,7 +4170,7 @@ function ReactListTableInner(props, ref) {
4123
4170
  )
4124
4171
  }
4125
4172
  ),
4126
- loadingRequest ? /* @__PURE__ */ jsx(
4173
+ loading || loadingRequest ? /* @__PURE__ */ jsx(
4127
4174
  "div",
4128
4175
  {
4129
4176
  style: {
@@ -4138,7 +4185,7 @@ function ReactListTableInner(props, ref) {
4138
4185
  pointerEvents: "auto",
4139
4186
  cursor: "progress"
4140
4187
  },
4141
- children: loadingRequest.text ?? "\u5904\u7406\u4E2D\u2026"
4188
+ children: loading ? "\u6570\u636E\u52A0\u8F7D\u4E2D\u2026" : loadingRequest?.text ?? "\u5904\u7406\u4E2D\u2026"
4142
4189
  }
4143
4190
  ) : null
4144
4191
  ]
@@ -4236,7 +4283,12 @@ function applyManagedColumnOrder(columns, orderedKeys) {
4236
4283
  function resolveColumnKey(column) {
4237
4284
  return String(column.key ?? column.dataIndex);
4238
4285
  }
4239
- var ReactListTable = forwardRef(ReactListTableInner);
4286
+ var ReactListTable = forwardRef(
4287
+ ReactListTableInner
4288
+ );
4289
+ ReactListTable.EXPAND_COLUMN = EXPAND_COLUMN;
4290
+ ReactListTable.SELECTION_COLUMN = SELECTION_COLUMN;
4291
+ ReactListTable.ROW_SELECTION_COLUMN = ROW_SELECTION_COLUMN;
4240
4292
 
4241
4293
  export { ReactListTable, ReactListTableDebugProvider };
4242
4294
  //# sourceMappingURL=index.js.map